barsa-sap-ui 2.0.45 → 2.0.47

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, TemplateRef, HostListener, Directive, inject, ViewContainerRef, NgModule, signal, 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, LayoutService, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, GetAllColumnsSorted, measureText, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, BaseDirective, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, isImage, getIcon, LayoutPanelBaseComponent, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, BaseColumnPropsComponent, ColumnService, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateWidthOfListColumn, DateRanges, LogService, UlvMainService, isFunction, UploadService, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, FORM_DIALOG_COMPONENT, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, executeUlvCommandHandler, FillAllLayoutControls, PictureFieldSourcePipe, getDeviceIsPhone, PortalService, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, BarsaNovinRayCoreModule, ResizableModule, DIALOG_SERVICE } from 'barsa-novin-ray-core';
+import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, LayoutService, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, GetAllColumnsSorted, measureText, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, BaseDirective, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, isImage, getIcon, LayoutPanelBaseComponent, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, BaseColumnPropsComponent, ColumnService, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateWidthOfListColumn, DateRanges, LogService, UlvMainService, isFunction, UploadService, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, DIALOG_SERVICE, FORM_DIALOG_COMPONENT, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, executeUlvCommandHandler, FillAllLayoutControls, PictureFieldSourcePipe, getDeviceIsPhone, PortalService, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, BarsaNovinRayCoreModule, ResizableModule } from 'barsa-novin-ray-core';
 import moment from 'moment';
 import jmoment from 'moment-jalaali';
 import { merge, of, BehaviorSubject, Subject, combineLatest, takeUntil as takeUntil$1, concatMap, tap as tap$1, Observable, fromEvent, filter as filter$1 } from 'rxjs';
@@ -1149,7 +1149,7 @@ class UiGridColumnsComponent extends BaseComponent {
         return column.Name;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridColumnsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: { columns: "columns", selectedColumns: "selectedColumns" }, outputs: { columnsChange: "columnsChange" }, usesInheritance: true, ngImport: i0, template: "<h3>{{ 'Select All (' + selectedColumns + '/' + columns.length + ')' }}</h3>\n<ul\n  fd-list\n  [selection]=\"true\"\n  cdkDropList\n  cdkDropListOrientation=\"vertical\"\n  (cdkDropListDropped)=\"onDropColumn(columns, $event)\"\n  >\n  @for (column of columns; track trackByMethod($index, column)) {\n    <li\n      cdkDrag\n      fd-list-item\n      [selected]=\"!column.Hidden\"\n      (click)=\"onChangeColumnHidden(column)\"\n      >\n      <fd-checkbox [ngModel]=\"!column.Hidden\"></fd-checkbox>\n      <span fd-list-title>\n        {{ column.Caption }}\n        @if (column.IsMandatory) {\n          <strong>*</strong>\n        }\n      </span>\n    </li>\n  }\n</ul>\n", styles: [":host{display:flex;flex-direction:column;width:100%}.inputIcon{background:#fafafa;color:#0a6ed1;cursor:pointer;max-width:400px;min-width:200px}.inputIcon:hover{background:#e0e0e080}strong{color:#ce3b3b}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: { columns: "columns", selectedColumns: "selectedColumns" }, outputs: { columnsChange: "columnsChange" }, usesInheritance: true, ngImport: i0, template: "<h3>{{ 'Select All (' + selectedColumns + '/' + columns.length + ')' }}</h3>\n<ul\n  fd-list\n  [selection]=\"true\"\n  cdkDropList\n  cdkDropListOrientation=\"vertical\"\n  (cdkDropListDropped)=\"onDropColumn(columns, $event)\"\n  >\n  @for (column of columns; track trackByMethod($index, column)) {\n    <li\n      cdkDrag\n      fd-list-item\n      [selected]=\"!column.Hidden\"\n      (click)=\"onChangeColumnHidden(column)\"\n      >\n      <fd-checkbox [ngModel]=\"!column.Hidden\"></fd-checkbox>\n      <span fd-list-title>\n        {{ column.Caption }}\n        @if (column.IsMandatory) {\n          <strong>*</strong>\n        }\n      </span>\n    </li>\n  }\n</ul>\n", styles: [":host{display:flex;flex-direction:column;width:100%}.inputIcon{background:#fafafa;color:#0a6ed1;cursor:pointer;max-width:400px;min-width:200px}.inputIcon:hover{background:#e0e0e080}strong{color:#ce3b3b}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridColumnsComponent, decorators: [{
             type: Component,
@@ -1191,7 +1191,7 @@ class UlvColumnSettingsComponent extends BaseUlvSettingComponent {
         this.dialogRef.close(setting);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvColumnSettingsComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvColumnSettingsComponent, selector: "bsu-ulv-column-settings", viewQueries: [{ propertyName: "gridColumnsComponent", first: true, predicate: UiGridColumnsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<!--this commit is for test some github ability not more-->\r\n\r\n<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <fd-input-group\r\n            type=\"search\"\r\n            glyph=\"search\"\r\n            [glyphAriaLabel]=\"'EnterSearchCriteria' | bbbTranslate\"\r\n            [placeholder]=\"'EnterSearchCriteria' | bbbTranslate\"\r\n            [button]=\"true\"\r\n            [disabled]=\"false\"\r\n            [(ngModel)]=\"searchTerm\"\r\n            (addOnButtonClicked)=\"onSearchSubmit()\"\r\n        >\r\n        </fd-input-group>\r\n\r\n        <bsu-ui-grid-columns\r\n            [selectedColumns]=\"columns | filter: { Hidden: false } | listCount\"\r\n            [columns]=\"columns\"\r\n            (columnsChange)=\"onColumnsChange($event)\"\r\n            #gridColumnsRef\r\n        ></bsu-ui-grid-columns>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.FilterPipe, name: "filter" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ListCountPipe, name: "listCount" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvColumnSettingsComponent, selector: "bsu-ulv-column-settings", viewQueries: [{ propertyName: "gridColumnsComponent", first: true, predicate: UiGridColumnsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<!--this commit is for test some github ability not more-->\r\n\r\n<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <fd-input-group\r\n            type=\"search\"\r\n            glyph=\"search\"\r\n            [glyphAriaLabel]=\"'EnterSearchCriteria' | bbbTranslate\"\r\n            [placeholder]=\"'EnterSearchCriteria' | bbbTranslate\"\r\n            [button]=\"true\"\r\n            [disabled]=\"false\"\r\n            [(ngModel)]=\"searchTerm\"\r\n            (addOnButtonClicked)=\"onSearchSubmit()\"\r\n        >\r\n        </fd-input-group>\r\n\r\n        <bsu-ui-grid-columns\r\n            [selectedColumns]=\"columns | filter: { Hidden: false } | listCount\"\r\n            [columns]=\"columns\"\r\n            (columnsChange)=\"onColumnsChange($event)\"\r\n            #gridColumnsRef\r\n        ></bsu-ui-grid-columns>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.FilterPipe, name: "filter" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ListCountPipe, name: "listCount" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvColumnSettingsComponent, decorators: [{
             type: Component,
@@ -1228,7 +1228,7 @@ class UiGridSortItemComponent extends BaseComponent {
         this.sortItem.SortDirection = direction;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridSortItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridSortItemComponent, selector: "bsu-ui-grid-sort-item", inputs: { showGroups: "showGroups", sortItem: "sortItem", sortDirections: "sortDirections", columns: "columns", isFirst: "isFirst" }, outputs: { add: "add", remove: "remove", changeSetting: "changeSetting" }, host: { properties: { "class.ulv-sort-item-settings": "this.sortItemClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"sort-select\">\n    <fd-select (valueChange)=\"onColumnChange($event)\" [value]=\"sortItem.Name\">\n        @for (column of columns; track column) {\n        <fd-option [value]=\"column.Name\">{{ column.Caption === 'None' ? '' : column.Caption }}</fd-option>\n        }\n    </fd-select>\n\n    @if (!showGroups) {\n    <fd-select (valueChange)=\"onDirectionChange($event)\" [value]=\"sortItem.SortDirection\">\n        @for (item of sortDirections; track item) {\n        <fd-option [value]=\"item.value\">{{ item.text === 'None' ? '' : item.text }}</fd-option>\n        }\n    </fd-select>\n    }\n</div>\n<div class=\"sort-buttons\">\n    <button fd-button glyph=\"sys-cancel\" fdType=\"transparent\" (click)=\"this.remove.emit()\"></button>\n    <button fd-button glyph=\"add\" fdType=\"transparent\" (click)=\"this.add.emit()\"></button>\n</div>\n", styles: [".ulv-sort-item-settings{display:flex;width:100%}.ulv-sort-item-settings .sort-select{display:flex;flex-grow:1}.ulv-sort-item-settings .sort-select fd-select,.ulv-sort-item-settings .sort-select fd-select fd-popover{width:100%}.ulv-sort-item-settings .sort-buttons{display:flex;margin:0 10px}.ulv-sort-item-settings .sort-buttons button{margin:0 5px}body[dir=rtl] fd-select:nth-child(n+1){margin-right:5px}body[dir=ltr] fd-select:nth-child(n+1){margin-left:5px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i2$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridSortItemComponent, selector: "bsu-ui-grid-sort-item", inputs: { showGroups: "showGroups", sortItem: "sortItem", sortDirections: "sortDirections", columns: "columns", isFirst: "isFirst" }, outputs: { add: "add", remove: "remove", changeSetting: "changeSetting" }, host: { properties: { "class.ulv-sort-item-settings": "this.sortItemClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"sort-select\">\n    <fd-select (valueChange)=\"onColumnChange($event)\" [value]=\"sortItem.Name\">\n        @for (column of columns; track column) {\n        <fd-option [value]=\"column.Name\">{{ column.Caption === 'None' ? '' : column.Caption }}</fd-option>\n        }\n    </fd-select>\n\n    @if (!showGroups) {\n    <fd-select (valueChange)=\"onDirectionChange($event)\" [value]=\"sortItem.SortDirection\">\n        @for (item of sortDirections; track item) {\n        <fd-option [value]=\"item.value\">{{ item.text === 'None' ? '' : item.text }}</fd-option>\n        }\n    </fd-select>\n    }\n</div>\n<div class=\"sort-buttons\">\n    <button fd-button glyph=\"sys-cancel\" fdType=\"transparent\" (click)=\"this.remove.emit()\"></button>\n    <button fd-button glyph=\"add\" fdType=\"transparent\" (click)=\"this.add.emit()\"></button>\n</div>\n", styles: [".ulv-sort-item-settings{display:flex;width:100%}.ulv-sort-item-settings .sort-select{display:flex;flex-grow:1}.ulv-sort-item-settings .sort-select fd-select,.ulv-sort-item-settings .sort-select fd-select fd-popover{width:100%}.ulv-sort-item-settings .sort-buttons{display:flex;margin:0 10px}.ulv-sort-item-settings .sort-buttons button{margin:0 5px}body[dir=rtl] fd-select:nth-child(n+1){margin-right:5px}body[dir=ltr] fd-select:nth-child(n+1){margin-left:5px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i2$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridSortItemComponent, decorators: [{
             type: Component,
@@ -1404,7 +1404,7 @@ class UlvSortSettingsComponent extends BaseUlvSettingComponent {
         this.dialogRef.close(setting);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSortSettingsComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvSortSettingsComponent, selector: "bsu-ulv-sort-settings", viewQueries: [{ propertyName: "ulvSortSetting", first: true, predicate: UiGridSortSettingComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-sort-setting [columns]=\"allColumns\" [sortSettings]=\"sortSettings\"></bsu-ui-grid-sort-setting>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvSortSettingsComponent, selector: "bsu-ulv-sort-settings", viewQueries: [{ propertyName: "ulvSortSetting", first: true, predicate: UiGridSortSettingComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-sort-setting [columns]=\"allColumns\" [sortSettings]=\"sortSettings\"></bsu-ui-grid-sort-setting>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSortSettingsComponent, decorators: [{
             type: Component,
@@ -1436,7 +1436,7 @@ class UlvGroupbySettingsComponent extends BaseUlvSettingComponent {
         this.dialogRef.close(setting);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvGroupbySettingsComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvGroupbySettingsComponent, selector: "bsu-ulv-groupby-settings", viewQueries: [{ propertyName: "ulvSortSetting", first: true, predicate: UiGridSortSettingComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-sort-setting\r\n            [columns]=\"allColumns\"\r\n            [sortSettings]=\"sortSettings\"\r\n            [showGroups]=\"true\"\r\n        ></bsu-ui-grid-sort-setting>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UlvGroupbySettingsComponent, selector: "bsu-ulv-groupby-settings", viewQueries: [{ propertyName: "ulvSortSetting", first: true, predicate: UiGridSortSettingComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Columns' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button\r\n                        fd-button\r\n                        [label]=\"'Reset' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onReset()\"\r\n                    ></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-sort-setting\r\n            [columns]=\"allColumns\"\r\n            [sortSettings]=\"sortSettings\"\r\n            [showGroups]=\"true\"\r\n        ></bsu-ui-grid-sort-setting>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvGroupbySettingsComponent, decorators: [{
             type: Component,
@@ -1484,7 +1484,7 @@ class UiGridFilterItemComponent extends BaseComponent {
         this.selectedColumn = this.columns.find((c) => c.Name === this.selectedColumnName);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridFilterItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridFilterItemComponent, selector: "bsu-ui-grid-filter-item", inputs: { formPanelCtrlr: "formPanelCtrlr", columns: "columns", selectedColumnName: "selectedColumnName", selectedColumn: "selectedColumn" }, outputs: { add: "add", remove: "remove" }, viewQueries: [{ propertyName: "formComponent", first: true, predicate: FormComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"sort-select\">\n  <fd-select (valueChange)=\"onColumnChange($event)\" [value]=\"selectedColumn?.Name\">\n    @for (column of columns; track column) {\n      <fd-option [value]=\"column.Name\">{{ column.Caption }}</fd-option>\n    }\n  </fd-select>\n  <div class=\"spacer\"></div>\n  <fd-select (valueChange)=\"onConditionChange()\">\n    @for (item of allConditions; track item) {\n      <fd-option [value]=\"item\">{{ item }}</fd-option>\n    }\n  </fd-select>\n  <button fd-button glyph=\"decline\" fdType=\"transparent\" style=\"visibility: hidden\"></button>\n</div>\n<div class=\"sort-buttons\">\n  <bnrc-form [formPanelCtrl]=\"formPanelCtrlr\"></bnrc-form>\n  <button fd-button glyph=\"decline\" fdType=\"transparent\" (click)=\"this.remove.emit()\"></button>\n</div>\n", styles: [":host{display:flex;width:100%;flex-direction:column;margin-bottom:15px}:host ::ng-deep bnrc-form bsu-layout-control,:host ::ng-deep bnrc-form bnrc-field-ui{max-width:100%!important;width:100%!important;padding:0!important}:host ::ng-deep .sort-select fd-select,:host ::ng-deep .sort-select fd-select fd-popover{width:100%}.sort-select{display:flex;flex-grow:1}.spacer{flex-shrink:0;width:10px}.sort-buttons{display:flex;align-items:center}.sort-buttons input{flex:1}button{margin:0 5px}\n"], dependencies: [{ 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: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i2$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridFilterItemComponent, selector: "bsu-ui-grid-filter-item", inputs: { formPanelCtrlr: "formPanelCtrlr", columns: "columns", selectedColumnName: "selectedColumnName", selectedColumn: "selectedColumn" }, outputs: { add: "add", remove: "remove" }, viewQueries: [{ propertyName: "formComponent", first: true, predicate: FormComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"sort-select\">\n  <fd-select (valueChange)=\"onColumnChange($event)\" [value]=\"selectedColumn?.Name\">\n    @for (column of columns; track column) {\n      <fd-option [value]=\"column.Name\">{{ column.Caption }}</fd-option>\n    }\n  </fd-select>\n  <div class=\"spacer\"></div>\n  <fd-select (valueChange)=\"onConditionChange()\">\n    @for (item of allConditions; track item) {\n      <fd-option [value]=\"item\">{{ item }}</fd-option>\n    }\n  </fd-select>\n  <button fd-button glyph=\"decline\" fdType=\"transparent\" style=\"visibility: hidden\"></button>\n</div>\n<div class=\"sort-buttons\">\n  <bnrc-form [formPanelCtrl]=\"formPanelCtrlr\"></bnrc-form>\n  <button fd-button glyph=\"decline\" fdType=\"transparent\" (click)=\"this.remove.emit()\"></button>\n</div>\n", styles: [":host{display:flex;width:100%;flex-direction:column;margin-bottom:15px}:host ::ng-deep bnrc-form bsu-layout-control,:host ::ng-deep bnrc-form bnrc-field-ui{max-width:100%!important;width:100%!important;padding:0!important}:host ::ng-deep .sort-select fd-select,:host ::ng-deep .sort-select fd-select fd-popover{width:100%}.sort-select{display:flex;flex-grow:1}.spacer{flex-shrink:0;width:10px}.sort-buttons{display:flex;align-items:center}.sort-buttons input{flex:1}button{margin:0 5px}\n"], dependencies: [{ 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: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i2$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridFilterItemComponent, decorators: [{
             type: Component,
@@ -1570,7 +1570,7 @@ class UiGridFilterSettingsComponent extends BaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridFilterSettingsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridFilterSettingsComponent, selector: "bsu-ui-grid-filter-settings", inputs: { sortDirections: "sortDirections", typeDefId: "typeDefId", selectedColumnName: "selectedColumnName", filters: "filters", columns: "columns", controlsInfo: "controlsInfo" }, viewQueries: [{ propertyName: "filterItemList", predicate: UiGridFilterItemComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@for (formPanelCtrlr of listOfFormPanelCtrlr; track formPanelCtrlr; let i = $index) {\n  <bsu-ui-grid-filter-item\n    #sortItemsRef\n    [isFirst]=\"i === 0\"\n    (remove)=\"onRemove(i)\"\n    [columns]=\"columns\"\n    [selectedColumnName]=\"selectedColumnName\"\n    [formPanelCtrlr]=\"formPanelCtrlr\"\n    [style.margin-top.px]=\"i > 0 ? 5 : 0\"\n    >\n  </bsu-ui-grid-filter-item>\n}\n<div style=\"display: flex\">\n  <div class=\"spacer\"></div>\n  <button fd-button label=\"Add\" fdType=\"standard\" (click)=\"onAdd()\" [disabled]=\"addingForm\">\n    @if (addingForm) {\n      <bsu-mask size=\"s\"></bsu-mask>\n    }\n  </button>\n  <button\n    style=\"visibility: hidden; pointer-events: none; margin: 0 3px\"\n    fd-button\n    label=\"Add\"\n    fdType=\"standard\"\n  ></button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;margin-bottom:30px}.spacer{flex:1;width:100%}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UiGridFilterItemComponent, selector: "bsu-ui-grid-filter-item", inputs: ["formPanelCtrlr", "columns", "selectedColumnName", "selectedColumn"], outputs: ["add", "remove"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiGridFilterSettingsComponent, selector: "bsu-ui-grid-filter-settings", inputs: { sortDirections: "sortDirections", typeDefId: "typeDefId", selectedColumnName: "selectedColumnName", filters: "filters", columns: "columns", controlsInfo: "controlsInfo" }, viewQueries: [{ propertyName: "filterItemList", predicate: UiGridFilterItemComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@for (formPanelCtrlr of listOfFormPanelCtrlr; track formPanelCtrlr; let i = $index) {\n  <bsu-ui-grid-filter-item\n    #sortItemsRef\n    [isFirst]=\"i === 0\"\n    (remove)=\"onRemove(i)\"\n    [columns]=\"columns\"\n    [selectedColumnName]=\"selectedColumnName\"\n    [formPanelCtrlr]=\"formPanelCtrlr\"\n    [style.margin-top.px]=\"i > 0 ? 5 : 0\"\n    >\n  </bsu-ui-grid-filter-item>\n}\n<div style=\"display: flex\">\n  <div class=\"spacer\"></div>\n  <button fd-button label=\"Add\" fdType=\"standard\" (click)=\"onAdd()\" [disabled]=\"addingForm\">\n    @if (addingForm) {\n      <bsu-mask size=\"s\"></bsu-mask>\n    }\n  </button>\n  <button\n    style=\"visibility: hidden; pointer-events: none; margin: 0 3px\"\n    fd-button\n    label=\"Add\"\n    fdType=\"standard\"\n  ></button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;margin-bottom:30px}.spacer{flex:1;width:100%}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UiGridFilterItemComponent, selector: "bsu-ui-grid-filter-item", inputs: ["formPanelCtrlr", "columns", "selectedColumnName", "selectedColumn"], outputs: ["add", "remove"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiGridFilterSettingsComponent, decorators: [{
             type: Component,
@@ -1612,7 +1612,7 @@ class UlvFilterSettingsComponent extends BaseUlvSettingComponent {
         this.close(filters);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvFilterSettingsComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvFilterSettingsComponent, selector: "bsu-ulv-filter-settings", viewQueries: [{ propertyName: "gridFilterSettings", first: true, predicate: UiGridFilterSettingsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'Filter' | bbbTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n        @if (controlsInfo$ | async; as controlsInfo) {\n        <bsu-ui-grid-filter-settings\n            [columns]=\"allColumns\"\n            [sortSettings]=\"sortSettings\"\n            [controlsInfo]=\"controlsInfo\"\n            [typeDefId]=\"typeDefId\"\n            [selectedColumnName]=\"selectedColumnName\"\n        ></bsu-ui-grid-filter-settings>\n        }\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\n        </fd-dialog-footer-button>\n        <fd-dialog-footer-button>\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridFilterSettingsComponent, selector: "bsu-ui-grid-filter-settings", inputs: ["sortDirections", "typeDefId", "selectedColumnName", "filters", "columns", "controlsInfo"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvFilterSettingsComponent, selector: "bsu-ulv-filter-settings", viewQueries: [{ propertyName: "gridFilterSettings", first: true, predicate: UiGridFilterSettingsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">{{ 'Filter' | bbbTranslate }}</h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n        @if (controlsInfo$ | async; as controlsInfo) {\n        <bsu-ui-grid-filter-settings\n            [columns]=\"allColumns\"\n            [sortSettings]=\"sortSettings\"\n            [controlsInfo]=\"controlsInfo\"\n            [typeDefId]=\"typeDefId\"\n            [selectedColumnName]=\"selectedColumnName\"\n        ></bsu-ui-grid-filter-settings>\n        }\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\n        </fd-dialog-footer-button>\n        <fd-dialog-footer-button>\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridFilterSettingsComponent, selector: "bsu-ui-grid-filter-settings", inputs: ["sortDirections", "typeDefId", "selectedColumnName", "filters", "columns", "controlsInfo"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvFilterSettingsComponent, decorators: [{
             type: Component,
@@ -2442,7 +2442,7 @@ class UlvToolbarComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", 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: "17.3.5", 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", 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: ToolbarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@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>\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 ::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$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6$1.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", "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: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", 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", 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: ToolbarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@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>\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 ::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$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6$1.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", "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: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvToolbarComponent, decorators: [{
             type: Component,
@@ -2791,7 +2791,7 @@ class UiExceptionFormComponent extends BaseComponent {
         BarsaApi.Bw.Logout();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiExceptionFormComponent, deps: [{ token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiExceptionFormComponent, selector: "bsu-ui-exception-form", viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #templateRef>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title>\n                {{ dialogConfig.text }}\n            </h1>\n\n            <button fd-dialog-close-button (click)=\"onClose(dialog, dialogConfig)\"></button>\n        </fd-dialog-header>\n\n        <fd-dialog-body style=\"padding: 15px\">\n            <div style=\"min-height: 125px\">\n                <label fd-label [innerHtml]=\"dialogConfig.detail\"> </label>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'emphasized'\"\n                    [label]=\"'Continue' | bbbTranslate\"\n                    (click)=\"onContinue(dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'standard'\"\n                    [label]=\"'Copy' | bbbTranslate\"\n                    [copy]=\"dialogConfig.detail\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'negative'\"\n                    [label]=\"'Logout' | bbbTranslate\"\n                    (click)=\"onLogout(dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.CopyDirective, selector: "[copy]", inputs: ["copy"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiExceptionFormComponent, selector: "bsu-ui-exception-form", viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #templateRef>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title>\n                {{ dialogConfig.text }}\n            </h1>\n\n            <button fd-dialog-close-button (click)=\"onClose(dialog, dialogConfig)\"></button>\n        </fd-dialog-header>\n\n        <fd-dialog-body style=\"padding: 15px\">\n            <div style=\"min-height: 125px\">\n                <label fd-label [innerHtml]=\"dialogConfig.detail\"> </label>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'emphasized'\"\n                    [label]=\"'Continue' | bbbTranslate\"\n                    (click)=\"onContinue(dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'standard'\"\n                    [label]=\"'Copy' | bbbTranslate\"\n                    [copy]=\"dialogConfig.detail\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"'negative'\"\n                    [label]=\"'Logout' | bbbTranslate\"\n                    (click)=\"onLogout(dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.CopyDirective, selector: "[copy]", inputs: ["copy"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiExceptionFormComponent, decorators: [{
             type: Component,
@@ -3058,7 +3058,7 @@ class UiMatrixViewComponent extends ReportViewBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMatrixViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: { deviceSize: "deviceSize", deviceName: "deviceName", moDataList: "moDataList", columns: "columns", formLayout: "formLayout", conditionalFormat: "conditionalFormat", activeCell: "activeCell", valueControlFieldCaption: "valueControlFieldCaption", formTemplate: "formTemplate", valueType: "valueType", cellWidth: "cellWidth", cellHeight: "cellHeight", verticalLabelWidth: "verticalLabelWidth", fitWidth: "fitWidth", minWidth: "minWidth", minHeight: "minHeight", rowResizer: "rowResizer", enableResizing: "enableResizing" }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "tableHead", first: true, predicate: ["tableHead"], descendants: true }, { propertyName: "ellipsifyDirective", first: true, predicate: EllipsifyDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-layout-panel>\n    <fd-layout-panel-body [bleed]=\"true\">\n        <table\n            fd-table\n            ellipsify\n            tableResizer\n            [fitWidth]=\"fitWidth\"\n            [minWidth]=\"minWidth\"\n            [minHeight]=\"minHeight\"\n            [VerticalLableVisible]=\"false\"\n            [rowResizer]=\"rowResizer\"\n            [enableResizing]=\"enableResizing\"\n        >\n            <thead fd-table-header #tableHead>\n                <tr fd-table-row>\n                    <th fd-table-cell class=\"empty-cell\"></th>\n                    @for (column of columns; track column) {\n                    <th fd-table-cell>\n                        <span>\n                            {{ column.Caption }}\n                        </span>\n                    </th>\n                    }\n                </tr>\n            </thead>\n            <tbody fd-table-body>\n                @if (moDataList?.length) { @for (mo of moDataList; track mo; let i = $index) { @if (mo.VerticalColumn) {\n                <tr\n                    fd-table-row\n                    #trEl\n                    [applyConditionalFormats]=\"conditionalFormat\"\n                    [styleIndex]=\"mo.$StyleIndex ? mo.$StyleIndex : []\"\n                    [hostEl]=\"trEl\"\n                    [hoverable]=\"false\"\n                    [class]=\"'row_' + mo?.VerticalData?.Id\"\n                >\n                    <td fd-table-cell class=\"vertical-label\">\n                        <span>{{ mo.VerticalColumn }}</span>\n                    </td>\n                    @for (column of columns; track column; let j = $index; let first = $first; let last = $last) {\n                    <td fd-table-cell [hoverable]=\"true\">\n                        <bsu-column-matrix-renderer\n                            class=\"column-renderer\"\n                            (cellClick)=\"onSelectionChange({ value: mo[column.Caption], index: { i: i, j: j } })\"\n                            [value]=\"mo[column.Caption]\"\n                            [isActive]=\"i === activeCell?.i && j === activeCell?.j\"\n                            [formLayout]=\"formLayout\"\n                            [uiControl]=\"valueControlFieldCaption | controlUi: formLayout\"\n                            [columnCaption]=\"column.Caption\"\n                            [valueType]=\"valueType\"\n                            [height]=\"mo.height\"\n                            (changeToEdit)=\"onChangeToEdit(i, j)\"\n                        ></bsu-column-matrix-renderer>\n                    </td>\n                    }\n                </tr>\n                } } }\n            </tbody>\n        </table>\n    </fd-layout-panel-body>\n</fd-layout-panel>\n", styles: ["fd-layout-panel{height:100%}fd-layout-panel table thead tr{background-color:var(--sapList_HeaderBackground, #f2f2f2)}fd-layout-panel table tbody{border-bottom:none}fd-layout-panel table tbody .fd-table__cell.vertical-label{background-color:var(--sapList_HeaderBackground, #f2f2f2)}:host{display:block;width:100%;height:100%;overflow:hidden}::-webkit-scrollbar{height:7px;width:7px}::-webkit-scrollbar-track{box-shadow:inset 0 0 2px #d0cece;border-radius:10px}::-webkit-scrollbar-thumb{background:#c8cacb;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#adb0b2}\n"], dependencies: [{ kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.TableResizerDirective, selector: "[tableResizer]", inputs: ["fitWidth", "minWidth", "minHeight", "containerWidth", "rowResizer", "enableResizing"], outputs: ["columnResized"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: ColumnMatrixRendererComponent, selector: "bsu-column-matrix-renderer", inputs: ["value", "valueCaption", "formLayout", "columnCaption", "uiControl", "valueType", "isActive", "height"], outputs: ["cellClick", "changeToEdit"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: { deviceSize: "deviceSize", deviceName: "deviceName", moDataList: "moDataList", columns: "columns", formLayout: "formLayout", conditionalFormat: "conditionalFormat", activeCell: "activeCell", valueControlFieldCaption: "valueControlFieldCaption", formTemplate: "formTemplate", valueType: "valueType", cellWidth: "cellWidth", cellHeight: "cellHeight", verticalLabelWidth: "verticalLabelWidth", fitWidth: "fitWidth", minWidth: "minWidth", minHeight: "minHeight", rowResizer: "rowResizer", enableResizing: "enableResizing" }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "tableHead", first: true, predicate: ["tableHead"], descendants: true }, { propertyName: "ellipsifyDirective", first: true, predicate: EllipsifyDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-layout-panel>\n    <fd-layout-panel-body [bleed]=\"true\">\n        <table\n            fd-table\n            ellipsify\n            tableResizer\n            [fitWidth]=\"fitWidth\"\n            [minWidth]=\"minWidth\"\n            [minHeight]=\"minHeight\"\n            [VerticalLableVisible]=\"false\"\n            [rowResizer]=\"rowResizer\"\n            [enableResizing]=\"enableResizing\"\n        >\n            <thead fd-table-header #tableHead>\n                <tr fd-table-row>\n                    <th fd-table-cell class=\"empty-cell\"></th>\n                    @for (column of columns; track column) {\n                    <th fd-table-cell>\n                        <span>\n                            {{ column.Caption }}\n                        </span>\n                    </th>\n                    }\n                </tr>\n            </thead>\n            <tbody fd-table-body>\n                @if (moDataList?.length) { @for (mo of moDataList; track mo; let i = $index) { @if (mo.VerticalColumn) {\n                <tr\n                    fd-table-row\n                    #trEl\n                    [applyConditionalFormats]=\"conditionalFormat\"\n                    [styleIndex]=\"mo.$StyleIndex ? mo.$StyleIndex : []\"\n                    [hostEl]=\"trEl\"\n                    [hoverable]=\"false\"\n                    [class]=\"'row_' + mo?.VerticalData?.Id\"\n                >\n                    <td fd-table-cell class=\"vertical-label\">\n                        <span>{{ mo.VerticalColumn }}</span>\n                    </td>\n                    @for (column of columns; track column; let j = $index; let first = $first; let last = $last) {\n                    <td fd-table-cell [hoverable]=\"true\">\n                        <bsu-column-matrix-renderer\n                            class=\"column-renderer\"\n                            (cellClick)=\"onSelectionChange({ value: mo[column.Caption], index: { i: i, j: j } })\"\n                            [value]=\"mo[column.Caption]\"\n                            [isActive]=\"i === activeCell?.i && j === activeCell?.j\"\n                            [formLayout]=\"formLayout\"\n                            [uiControl]=\"valueControlFieldCaption | controlUi: formLayout\"\n                            [columnCaption]=\"column.Caption\"\n                            [valueType]=\"valueType\"\n                            [height]=\"mo.height\"\n                            (changeToEdit)=\"onChangeToEdit(i, j)\"\n                        ></bsu-column-matrix-renderer>\n                    </td>\n                    }\n                </tr>\n                } } }\n            </tbody>\n        </table>\n    </fd-layout-panel-body>\n</fd-layout-panel>\n", styles: ["fd-layout-panel{height:100%}fd-layout-panel table thead tr{background-color:var(--sapList_HeaderBackground, #f2f2f2)}fd-layout-panel table tbody{border-bottom:none}fd-layout-panel table tbody .fd-table__cell.vertical-label{background-color:var(--sapList_HeaderBackground, #f2f2f2)}:host{display:block;width:100%;height:100%;overflow:hidden}::-webkit-scrollbar{height:7px;width:7px}::-webkit-scrollbar-track{box-shadow:inset 0 0 2px #d0cece;border-radius:10px}::-webkit-scrollbar-thumb{background:#c8cacb;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#adb0b2}\n"], dependencies: [{ kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.TableResizerDirective, selector: "[tableResizer]", inputs: ["fitWidth", "minWidth", "minHeight", "containerWidth", "rowResizer", "enableResizing"], outputs: ["columnResized"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: ColumnMatrixRendererComponent, selector: "bsu-column-matrix-renderer", inputs: ["value", "valueCaption", "formLayout", "columnCaption", "uiControl", "valueType", "isActive", "height"], outputs: ["cellClick", "changeToEdit"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMatrixViewComponent, decorators: [{
             type: Component,
@@ -3218,7 +3218,7 @@ class UiEditableGridComponent extends SapUiReportBaseComponent {
             .subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiEditableGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiEditableGridComponent, selector: "bsu-ui-editable-grid", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        matrixTemplate;\n        context: {\n            moDataList: matrixMoList$ | async,\n            columns: horizontalRows,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            title: title$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            hideToolbar: hideToolbar$ | async,\n            contentDensity: contentDensity$ | async,\n            activeCell: activeCell,\n            valueControlFieldCaption: valueControlFieldCaption,\n            valueType: valueType,\n            formSetting: context.Setting.FormTemplate,\n            matrixWidthType: matrixWidthType,\n            cellWidth: cellWidth,\n            verticalLabelWidth: verticalLabelWidth,\n            fitWidth: fitWidth,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            hasSelected: hasSelected$ | async,\n            containerWidth: containerWidth$ | async,\n            formLayout: formLayout\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #matrixTemplate\n    let-moDataList=\"moDataList\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-contentDensity=\"contentDensity\"\n    let-columns=\"columns\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-activeCell=\"activeCell\"\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\n    let-valueType=\"valueType\"\n    let-formSetting=\"formSetting\"\n    let-matrixWidthType=\"matrixWidthType\"\n    let-cellWidth=\"cellWidth\"\n    let-verticalLabelWidth=\"verticalLabelWidth\"\n    let-fitWidth=\"fitWidth\"\n    let-access=\"access\"\n    let-hasSelected=\"hasSelected\"\n    let-containerWidth=\"containterWidth\"\n    let-formLayout=\"formLayout\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [access]=\"access\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    >\n        <button\n            fd-toolbar-item\n            fd-button\n            [fdType]=\"'emphasized'\"\n            [label]=\"'Save' | bbbTranslate\"\n            [glyph]=\"'save'\"\n            (click)=\"onSave()\"\n        ></button>\n        <fd-split-button\n            fd-toolbar-item\n            [mainAction]=\"{\n                keepMainAction: true,\n                mainActionTitle: splitBtnTitle\n            }\"\n        >\n            <fd-menu>\n                <li fd-menu-item>\n                    <div fd-menu-interactive (click)=\"onChangeView(true)\">\n                        <span fd-menu-title>\n                            {{ widthTypeEnum.FitWidth }}\n                        </span>\n                    </div>\n                </li>\n                <li fd-menu-item>\n                    <div fd-menu-interactive (click)=\"onChangeView(false)\">\n                        <span fd-menu-title>\n                            {{ widthTypeEnum.StaticWidth }}\n                        </span>\n                    </div>\n                </li>\n            </fd-menu>\n        </fd-split-button>\n\n        <ng-template #splitBtnTitle>\n            <span>{{ fitWidth ? widthTypeEnum.FitWidth : widthTypeEnum.StaticWidth }}</span>\n        </ng-template>\n    </bsu-ulv-toolbar>\n    <bsu-ui-matrix-view\n        [moDataList]=\"moDataList\"\n        [columns]=\"columns\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [activeCell]=\"activeCell\"\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\n        [valueType]=\"valueType\"\n        [access]=\"access\"\n        [formLayout]=\"formLayout\"\n        [matrixWidthType]=\"matrixWidthType\"\n        [cellWidth]=\"cellWidth\"\n        [cellHeight]=\"cellHeight\"\n        [verticalLabelWidth]=\"verticalLabelWidth\"\n        [fitWidth]=\"fitWidth\"\n        [minWidth]=\"minWidth\"\n        [minHeight]=\"minHeight\"\n        [rowResizer]=\"rowResizer\"\n        [enableResizing]=\"enableResizing\"\n        [containerWidth]=\"containerWidth\"\n        (selectionChange)=\"onSelectionChange($event)\"\n    ></bsu-ui-matrix-view>\n</ng-template>\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: ["deviceSize", "deviceName", "moDataList", "columns", "formLayout", "conditionalFormat", "activeCell", "valueControlFieldCaption", "formTemplate", "valueType", "cellWidth", "cellHeight", "verticalLabelWidth", "fitWidth", "minWidth", "minHeight", "rowResizer", "enableResizing"], outputs: ["selectionChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiEditableGridComponent, selector: "bsu-ui-editable-grid", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        matrixTemplate;\n        context: {\n            moDataList: matrixMoList$ | async,\n            columns: horizontalRows,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            title: title$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            hideToolbar: hideToolbar$ | async,\n            contentDensity: contentDensity$ | async,\n            activeCell: activeCell,\n            valueControlFieldCaption: valueControlFieldCaption,\n            valueType: valueType,\n            formSetting: context.Setting.FormTemplate,\n            matrixWidthType: matrixWidthType,\n            cellWidth: cellWidth,\n            verticalLabelWidth: verticalLabelWidth,\n            fitWidth: fitWidth,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            hasSelected: hasSelected$ | async,\n            containerWidth: containerWidth$ | async,\n            formLayout: formLayout\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #matrixTemplate\n    let-moDataList=\"moDataList\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-contentDensity=\"contentDensity\"\n    let-columns=\"columns\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-activeCell=\"activeCell\"\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\n    let-valueType=\"valueType\"\n    let-formSetting=\"formSetting\"\n    let-matrixWidthType=\"matrixWidthType\"\n    let-cellWidth=\"cellWidth\"\n    let-verticalLabelWidth=\"verticalLabelWidth\"\n    let-fitWidth=\"fitWidth\"\n    let-access=\"access\"\n    let-hasSelected=\"hasSelected\"\n    let-containerWidth=\"containterWidth\"\n    let-formLayout=\"formLayout\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [access]=\"access\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    >\n        <button\n            fd-toolbar-item\n            fd-button\n            [fdType]=\"'emphasized'\"\n            [label]=\"'Save' | bbbTranslate\"\n            [glyph]=\"'save'\"\n            (click)=\"onSave()\"\n        ></button>\n        <fd-split-button\n            fd-toolbar-item\n            [mainAction]=\"{\n                keepMainAction: true,\n                mainActionTitle: splitBtnTitle\n            }\"\n        >\n            <fd-menu>\n                <li fd-menu-item>\n                    <div fd-menu-interactive (click)=\"onChangeView(true)\">\n                        <span fd-menu-title>\n                            {{ widthTypeEnum.FitWidth }}\n                        </span>\n                    </div>\n                </li>\n                <li fd-menu-item>\n                    <div fd-menu-interactive (click)=\"onChangeView(false)\">\n                        <span fd-menu-title>\n                            {{ widthTypeEnum.StaticWidth }}\n                        </span>\n                    </div>\n                </li>\n            </fd-menu>\n        </fd-split-button>\n\n        <ng-template #splitBtnTitle>\n            <span>{{ fitWidth ? widthTypeEnum.FitWidth : widthTypeEnum.StaticWidth }}</span>\n        </ng-template>\n    </bsu-ulv-toolbar>\n    <bsu-ui-matrix-view\n        [moDataList]=\"moDataList\"\n        [columns]=\"columns\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [activeCell]=\"activeCell\"\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\n        [valueType]=\"valueType\"\n        [access]=\"access\"\n        [formLayout]=\"formLayout\"\n        [matrixWidthType]=\"matrixWidthType\"\n        [cellWidth]=\"cellWidth\"\n        [cellHeight]=\"cellHeight\"\n        [verticalLabelWidth]=\"verticalLabelWidth\"\n        [fitWidth]=\"fitWidth\"\n        [minWidth]=\"minWidth\"\n        [minHeight]=\"minHeight\"\n        [rowResizer]=\"rowResizer\"\n        [enableResizing]=\"enableResizing\"\n        [containerWidth]=\"containerWidth\"\n        (selectionChange)=\"onSelectionChange($event)\"\n    ></bsu-ui-matrix-view>\n</ng-template>\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: ["deviceSize", "deviceName", "moDataList", "columns", "formLayout", "conditionalFormat", "activeCell", "valueControlFieldCaption", "formTemplate", "valueType", "cellWidth", "cellHeight", "verticalLabelWidth", "fitWidth", "minWidth", "minHeight", "rowResizer", "enableResizing"], outputs: ["selectionChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiEditableGridComponent, decorators: [{
             type: Component,
@@ -3734,7 +3734,7 @@ class UlvContextMenuComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvContextMenuComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", deviceName: "deviceName", menuItems: "menuItems", allColumns: "allColumns", index: "index", mo: "mo", styleIndex: "styleIndex", conditionalFormats: "conditionalFormats", disableOverflowContextMenu: "disableOverflowContextMenu", footerMode: "footerMode" }, outputs: { commandClick: "commandClick" }, host: { properties: { "class.disableOverflow": "this._disableOverflow" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (footerMode) {\n<div fd-bar barDesign=\"footer\" [cozy]=\"false\" style=\"width: 100%\">\n    @if (overflowMode) {\n    <div fd-bar-middle>\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\n    </div>\n    } @if (!overflowMode) {\n    <div fd-bar-right>\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\n    </div>\n    }\n    <ng-template #footerToolbarTpl>\n        <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n            @for (cmd of menuItems; track cmd) {\n            <ng-container *ngTemplateOutlet=\"buttonTemplate; context: { $implicit: cmd }\"></ng-container>\n            }\n        </fd-toolbar>\n    </ng-template>\n</div>\n} @else {\n<ng-container\n    *ngTemplateOutlet=\"\n        overflowMode && !disableOverflowContextMenu ? overflowCommands : simpleCommands;\n        context: { $implicit: menuItems, index: index }\n    \"\n></ng-container>\n}\n\n<ng-template #simpleCommands let-commands let-index=\"index\">\n    @for (cmd of commands; track cmd) {\n    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\n    }\n</ng-template>\n\n<ng-template #overflowCommands let-commands let-index=\"index\">\n    <fd-popover placement=\"bottom\" [(isOpen)]=\"isOpenOverflow\" [closeOnOutsideClick]=\"true\" [noArrow]=\"true\">\n        <fd-popover-control #popover>\n            <button fd-button (click)=\"onOpenOverflow($event)\" [fdType]=\"'transparent'\" [glyph]=\"'overflow'\"></button>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list>\n                @for (cmd of commands; track cmd) {\n                <li fd-list-item>\n                    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\n                </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #menuButtonTemplate let-cmd>\n    <ng-container\n        *ngTemplateOutlet=\"cmd.menu ? menuTemplate : buttonTemplate; context: { $implicit: cmd }\"\n    ></ng-container>\n</ng-template>\n<ng-template #menuTemplate let-cmd>\n    <fd-split-button fd-toolbar-item [mainAction]=\"{ mainActionTitle: cmd.text, keepMainAction: true }\">\n        <fd-menu>\n            @for (btnCommand of cmd.menu.items; track btnCommand) {\n            <li\n                fd-menu-item\n                #liEl\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"cmd.text\"\n                [hostEl]=\"liEl\"\n                (click)=\"onCommandSplitButtonClick($event, btnCommand)\"\n            >\n                <div fd-menu-interactive>\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n</ng-template>\n<ng-template #buttonTemplate let-cmd>\n    <ng-container\n        *ngTemplateOutlet=\"\n            cmd?.Command?.CustomUi ? customButtonTemplate : defaultButtonTemplate;\n            context: { $implicit: cmd }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #defaultButtonTemplate let-cmd>\n    <button\n        fd-button\n        #btnEl\n        [fdType]=\"cmd.Command?.JsonExtraProp?.Design ? cmd.Command?.JsonExtraProp.Design : 'transparent'\"\n        [glyph]=\"cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon || ''\"\n        [ulvCommandHandler]=\"cmd\"\n        [label]=\"cmd.Command?.NewIcon && cmd.Command?.JsonExtraProp?.Icon ? (cmd.text | bbbTranslate) : ''\"\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [dbName]=\"cmd.text\"\n        [hostEl]=\"btnEl\"\n        (commandClick)=\"onCommandClick($event)\"\n    >\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 -->\n        @if (!cmd.Command?.NewIcon && !cmd.Command?.JsonExtraProp?.Icon) {\n        <img [src]=\"cmd.icon\" />\n        }\n        <span *ngIf=\"!(cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon)\">{{ cmd.text | bbbTranslate }}</span>\n    </button>\n</ng-template>\n<ng-template #customButtonTemplate let-cmd>\n    <div\n        #hostEl\n        [dbName]=\"cmd.text\"\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [hostEl]=\"hostEl\"\n        [styleIndex]=\"styleIndex\"\n    >\n        <bnrc-dynamic-form-toolbaritem\n            fd-toolbar-item\n            [ulvCommandHandler]=\"cmd\"\n            [component]=\"cmd.Command?.CustomUi\"\n            [mo]=\"mo\"\n            [context]=\"cmd\"\n            [showText]=\"disableOverflowContextMenu === false\"\n            [deviceName]=\"deviceName\"\n            [index]=\"index\"\n            [isEnable]=\"cmd.Command?._isEnable || cmd.Command?.UseForSingle\"\n            [allColumns]=\"allColumns\"\n            (btnClick)=\"onCommandClick($event)\"\n        ></bnrc-dynamic-form-toolbaritem>\n    </div>\n</ng-template>\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$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.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.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[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"], outputs: ["keyDown"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "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: "17.3.5", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", deviceName: "deviceName", menuItems: "menuItems", allColumns: "allColumns", index: "index", mo: "mo", styleIndex: "styleIndex", conditionalFormats: "conditionalFormats", disableOverflowContextMenu: "disableOverflowContextMenu", footerMode: "footerMode" }, outputs: { commandClick: "commandClick" }, host: { properties: { "class.disableOverflow": "this._disableOverflow" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (footerMode) {\n<div fd-bar barDesign=\"footer\" [cozy]=\"false\" style=\"width: 100%\">\n    @if (overflowMode) {\n    <div fd-bar-middle>\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\n    </div>\n    } @if (!overflowMode) {\n    <div fd-bar-right>\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\n    </div>\n    }\n    <ng-template #footerToolbarTpl>\n        <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n            @for (cmd of menuItems; track cmd) {\n            <ng-container *ngTemplateOutlet=\"buttonTemplate; context: { $implicit: cmd }\"></ng-container>\n            }\n        </fd-toolbar>\n    </ng-template>\n</div>\n} @else {\n<ng-container\n    *ngTemplateOutlet=\"\n        overflowMode && !disableOverflowContextMenu ? overflowCommands : simpleCommands;\n        context: { $implicit: menuItems, index: index }\n    \"\n></ng-container>\n}\n\n<ng-template #simpleCommands let-commands let-index=\"index\">\n    @for (cmd of commands; track cmd) {\n    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\n    }\n</ng-template>\n\n<ng-template #overflowCommands let-commands let-index=\"index\">\n    <fd-popover placement=\"bottom\" [(isOpen)]=\"isOpenOverflow\" [closeOnOutsideClick]=\"true\" [noArrow]=\"true\">\n        <fd-popover-control #popover>\n            <button fd-button (click)=\"onOpenOverflow($event)\" [fdType]=\"'transparent'\" [glyph]=\"'overflow'\"></button>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list>\n                @for (cmd of commands; track cmd) {\n                <li fd-list-item>\n                    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\n                </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #menuButtonTemplate let-cmd>\n    <ng-container\n        *ngTemplateOutlet=\"cmd.menu ? menuTemplate : buttonTemplate; context: { $implicit: cmd }\"\n    ></ng-container>\n</ng-template>\n<ng-template #menuTemplate let-cmd>\n    <fd-split-button fd-toolbar-item [mainAction]=\"{ mainActionTitle: cmd.text, keepMainAction: true }\">\n        <fd-menu>\n            @for (btnCommand of cmd.menu.items; track btnCommand) {\n            <li\n                fd-menu-item\n                #liEl\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"cmd.text\"\n                [hostEl]=\"liEl\"\n                (click)=\"onCommandSplitButtonClick($event, btnCommand)\"\n            >\n                <div fd-menu-interactive>\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n</ng-template>\n<ng-template #buttonTemplate let-cmd>\n    <ng-container\n        *ngTemplateOutlet=\"\n            cmd?.Command?.CustomUi ? customButtonTemplate : defaultButtonTemplate;\n            context: { $implicit: cmd }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #defaultButtonTemplate let-cmd>\n    <button\n        fd-button\n        #btnEl\n        [fdType]=\"cmd.Command?.JsonExtraProp?.Design ? cmd.Command?.JsonExtraProp.Design : 'transparent'\"\n        [glyph]=\"cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon || ''\"\n        [ulvCommandHandler]=\"cmd\"\n        [label]=\"cmd.Command?.NewIcon && cmd.Command?.JsonExtraProp?.Icon ? (cmd.text | bbbTranslate) : ''\"\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [dbName]=\"cmd.text\"\n        [hostEl]=\"btnEl\"\n        (commandClick)=\"onCommandClick($event)\"\n    >\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 -->\n        @if (!cmd.Command?.NewIcon && !cmd.Command?.JsonExtraProp?.Icon) {\n        <img [src]=\"cmd.icon\" />\n        }\n        <span *ngIf=\"!(cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon)\">{{ cmd.text | bbbTranslate }}</span>\n    </button>\n</ng-template>\n<ng-template #customButtonTemplate let-cmd>\n    <div\n        #hostEl\n        [dbName]=\"cmd.text\"\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [hostEl]=\"hostEl\"\n        [styleIndex]=\"styleIndex\"\n    >\n        <bnrc-dynamic-form-toolbaritem\n            fd-toolbar-item\n            [ulvCommandHandler]=\"cmd\"\n            [component]=\"cmd.Command?.CustomUi\"\n            [mo]=\"mo\"\n            [context]=\"cmd\"\n            [showText]=\"disableOverflowContextMenu === false\"\n            [deviceName]=\"deviceName\"\n            [index]=\"index\"\n            [isEnable]=\"cmd.Command?._isEnable || cmd.Command?.UseForSingle\"\n            [allColumns]=\"allColumns\"\n            (btnClick)=\"onCommandClick($event)\"\n        ></bnrc-dynamic-form-toolbaritem>\n    </div>\n</ng-template>\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$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.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.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3.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"], outputs: ["keyDown"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "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: "17.3.5", ngImport: i0, type: UlvContextMenuComponent, decorators: [{
             type: Component,
@@ -3796,7 +3796,7 @@ class HtreeCreateNewComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: HtreeCreateNewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: HtreeCreateNewComponent, selector: "bsu-htree-create-new", inputs: { relationList: "relationList", node: "node" }, outputs: { createNew: "createNew" }, usesInheritance: true, ngImport: i0, template: "@if (relationItem) {\n<button\n    fd-button\n    [fdType]=\"'transparent'\"\n    [label]=\"('Create' | bbbTranslate) + ' ' + relationItem.ObjectInRelationName\"\n    (click)=\"onClick($event)\"\n></button>\n}\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: HtreeCreateNewComponent, selector: "bsu-htree-create-new", inputs: { relationList: "relationList", node: "node" }, outputs: { createNew: "createNew" }, usesInheritance: true, ngImport: i0, template: "@if (relationItem) {\n<button\n    fd-button\n    [fdType]=\"'transparent'\"\n    [label]=\"('Create' | bbbTranslate) + ' ' + relationItem.ObjectInRelationName\"\n    (click)=\"onClick($event)\"\n></button>\n}\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: HtreeCreateNewComponent, decorators: [{
             type: Component,
@@ -3884,7 +3884,7 @@ class BarsaTreeItemComponent extends BaseViewItemPropsComponent {
         this.dragMoved.emit($event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTreeItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTreeItemComponent, selector: "bsu-barsa-tree-item", inputs: { node: "node", selectedNode: "selectedNode", relationList: "relationList", hideOpenIcon: "hideOpenIcon", hasArrowIcon: "hasArrowIcon", collapseIcon: "collapseIcon", loading: "loading", hasChildren: "hasChildren", leafCursorPointer: "leafCursorPointer", isExpand: "isExpand", children: "children", parentNode: "parentNode", text: "text", icon: "icon", color: "color", isHetro: "isHetro", enableNodeReordering: "enableNodeReordering", hideIcon: "hideIcon" }, outputs: { createNew: "createNew", select: "select", checkChange: "checkChange", viewClick: "viewClick", loadChildren: "loadChildren", dragMoved: "dragMoved" }, usesInheritance: true, ngImport: i0, template: "<li\n    fd-list-item\n    #liEl\n    [class.!tw-cursor-pointer]=\"leafCursorPointer\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"liEl\"\n    [focusable]=\"true\"\n    [attr.level]=\"level\"\n    [class.root-group]=\"level === 1\"\n    [interactive]=\"true\"\n    [selected]=\"isChecked\"\n    (dblclick)=\"onNodeViewClick()\"\n    cdkDrag\n    [cdkDragDisabled]=\"!enableNodeReordering\"\n    [cdkDragData]=\"node.Data.Id\"\n    (cdkDragMoved)=\"onDragMoved($event)\"\n    (click)=\"openOnClick ? onNodeViewClick() : onListItemClick(liEl, $event)\"\n>\n    <div (click)=\"onRowCheck()\" class=\"spacer\" [style.width]=\"(level - 1) * 4 + 'rem'\"></div>\n    @if (enableNodeReordering && !isHetro) {\n    <fd-icon glyph=\"grip\" font=\"BusinessSuiteInAppSymbols\" cdkDragHandle></fd-icon>\n    } @if (inDialog && isMultiSelect) {\n    <fd-checkbox [name]=\"node.Data.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onCheckbox($event)\"></fd-checkbox>\n    }\n\n    <div (click)=\"onRowCheck()\" style=\"display: flex; width: 100%; justify-content: space-between\">\n        <div style=\"display: flex; flex: 1\">\n            @if (hasArrowIcon) { @if (hasChildren) {\n            <div class=\"arrow-container\">\n                <button\n                    [attr.rtl]=\"rtl\"\n                    fd-button\n                    fdType=\"transparent\"\n                    [glyph]=\"hasChildren ? (isExpand ? 'slim-arrow-up' : collapseIcon) : ''\"\n                    (click)=\"onLoadChildren($event)\"\n                    (dblclick)=\"onExpandDblClick($event)\"\n                ></button>\n            </div>\n            } @else { @if (!parentNode?.hasOneDepthLevel) {\n            <div class=\"empty-container\" (click)=\"onRowCheck()\">\n                <button fd-button></button>\n            </div>\n            } } @if(!hideIcon || appComponentIcon){ @if(icon || appComponentIcon){\n            <i\n                [style.color]=\"appComponentIconColor || color\"\n                class=\"icon-item\"\n                fd-list-icon\n                [glyph]=\"appComponentIcon || icon\"\n            ></i>\n            }@else {\n            <i fd-list-icon class=\"icon-item\" style=\"display: flex; align-items: center; justify-content: center\">\n                <img [src]=\"node.icon\" width=\"16px\" />\n            </i>\n            } } @if (loading) {\n            <fd-busy-indicator\n                style=\"display: flex; align-items: center; width: 2rem\"\n                size=\"s\"\n                [loading]=\"true\"\n            ></fd-busy-indicator>\n            } }\n            <div style=\"display: flex; flex: unset; align-items: center\" fd-list-title [focusable]=\"true\">\n                <span [style.color]=\"color\">{{ text }}</span>\n                @if (children) {\n                <span>{{ ' ( ' + children.length + ' )' }}</span>\n                }\n            </div>\n        </div>\n        @if (contextMenuItems && contextMenuItems.length > 0) {\n        <i\n            ulvContextMenu\n            [allColumns]=\"allColumns\"\n            [menuItems]=\"contextMenuItems\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [mo]=\"node.Data\"\n            [index]=\"index\"\n            (commandClick)=\"onUlvCommand()\"\n            [deviceName]=\"deviceName\"\n        ></i>\n        } @if (access?.Add !== false && !inDialog) {\n        <bsu-htree-create-new\n            [node]=\"node\"\n            [relationList]=\"relationList\"\n            (createNew)=\"onCreateNew($event)\"\n        ></bsu-htree-create-new>\n        }\n    </div>\n    @if (access?.View && !showOkCancelButtons && deviceName !== 'desktop' && !hideOpenIcon) {\n    <button fd-button [glyph]=\"navigationArrow\" fdType=\"transparent\" (click)=\"onNodeViewClick()\"></button>\n    }\n\n    <bsu-barsa-tree-item\n        *cdkDragPreview\n        [node]=\"node\"\n        [rtl]=\"rtl\"\n        [selectedNode]=\"selectedNode\"\n        [hasArrowIcon]=\"false\"\n    ></bsu-barsa-tree-item>\n</li>\n", styles: [":host{display:block}li{column-gap:8px}li .cdk-drag-handle{opacity:.5;cursor:move}li .spacer{height:100%}li .arrow-container,li .empty-container{display:flex;width:28px;align-items:center;justify-content:center}li .arrow-container fd-icon,li .empty-container fd-icon{cursor:pointer;width:100%;height:100%;text-align:center}li .arrow-container button[rtl=true],li .empty-container button[rtl=true]{margin-left:5px}li .arrow-container button[rtl=false],li .empty-container button[rtl=false]{margin-right:5px}li .empty-container{visibility:hidden!important}.cdk-drag{cursor:default}.tree-icon-children{cursor:pointer}.icon-item{width:1.75rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2$1.CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTreeItemComponent, selector: "bsu-barsa-tree-item", inputs: ["node", "selectedNode", "relationList", "hideOpenIcon", "hasArrowIcon", "collapseIcon", "loading", "hasChildren", "leafCursorPointer", "isExpand", "children", "parentNode", "text", "icon", "color", "isHetro", "enableNodeReordering", "hideIcon"], outputs: ["createNew", "select", "checkChange", "viewClick", "loadChildren", "dragMoved"] }, { kind: "component", type: HtreeCreateNewComponent, selector: "bsu-htree-create-new", inputs: ["relationList", "node"], outputs: ["createNew"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTreeItemComponent, selector: "bsu-barsa-tree-item", inputs: { node: "node", selectedNode: "selectedNode", relationList: "relationList", hideOpenIcon: "hideOpenIcon", hasArrowIcon: "hasArrowIcon", collapseIcon: "collapseIcon", loading: "loading", hasChildren: "hasChildren", leafCursorPointer: "leafCursorPointer", isExpand: "isExpand", children: "children", parentNode: "parentNode", text: "text", icon: "icon", color: "color", isHetro: "isHetro", enableNodeReordering: "enableNodeReordering", hideIcon: "hideIcon" }, outputs: { createNew: "createNew", select: "select", checkChange: "checkChange", viewClick: "viewClick", loadChildren: "loadChildren", dragMoved: "dragMoved" }, usesInheritance: true, ngImport: i0, template: "<li\n    fd-list-item\n    #liEl\n    [class.!tw-cursor-pointer]=\"leafCursorPointer\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"liEl\"\n    [focusable]=\"true\"\n    [attr.level]=\"level\"\n    [class.root-group]=\"level === 1\"\n    [interactive]=\"true\"\n    [selected]=\"isChecked\"\n    (dblclick)=\"onNodeViewClick()\"\n    cdkDrag\n    [cdkDragDisabled]=\"!enableNodeReordering\"\n    [cdkDragData]=\"node.Data.Id\"\n    (cdkDragMoved)=\"onDragMoved($event)\"\n    (click)=\"openOnClick ? onNodeViewClick() : onListItemClick(liEl, $event)\"\n>\n    <div (click)=\"onRowCheck()\" class=\"spacer\" [style.width]=\"(level - 1) * 4 + 'rem'\"></div>\n    @if (enableNodeReordering && !isHetro) {\n    <fd-icon glyph=\"grip\" font=\"BusinessSuiteInAppSymbols\" cdkDragHandle></fd-icon>\n    } @if (inDialog && isMultiSelect) {\n    <fd-checkbox [name]=\"node.Data.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onCheckbox($event)\"></fd-checkbox>\n    }\n\n    <div (click)=\"onRowCheck()\" style=\"display: flex; width: 100%; justify-content: space-between\">\n        <div style=\"display: flex; flex: 1\">\n            @if (hasArrowIcon) { @if (hasChildren) {\n            <div class=\"arrow-container\">\n                <button\n                    [attr.rtl]=\"rtl\"\n                    fd-button\n                    fdType=\"transparent\"\n                    [glyph]=\"hasChildren ? (isExpand ? 'slim-arrow-up' : collapseIcon) : ''\"\n                    (click)=\"onLoadChildren($event)\"\n                    (dblclick)=\"onExpandDblClick($event)\"\n                ></button>\n            </div>\n            } @else { @if (!parentNode?.hasOneDepthLevel) {\n            <div class=\"empty-container\" (click)=\"onRowCheck()\">\n                <button fd-button></button>\n            </div>\n            } } @if(!hideIcon || appComponentIcon){ @if(icon || appComponentIcon){\n            <i\n                [style.color]=\"appComponentIconColor || color\"\n                class=\"icon-item\"\n                fd-list-icon\n                [glyph]=\"appComponentIcon || icon\"\n            ></i>\n            }@else {\n            <i fd-list-icon class=\"icon-item\" style=\"display: flex; align-items: center; justify-content: center\">\n                <img [src]=\"node.icon\" width=\"16px\" />\n            </i>\n            } } @if (loading) {\n            <fd-busy-indicator\n                style=\"display: flex; align-items: center; width: 2rem\"\n                size=\"s\"\n                [loading]=\"true\"\n            ></fd-busy-indicator>\n            } }\n            <div style=\"display: flex; flex: unset; align-items: center\" fd-list-title [focusable]=\"true\">\n                <span [style.color]=\"color\">{{ text }}</span>\n                @if (children) {\n                <span>{{ ' ( ' + children.length + ' )' }}</span>\n                }\n            </div>\n        </div>\n        @if (contextMenuItems && contextMenuItems.length > 0) {\n        <i\n            ulvContextMenu\n            [allColumns]=\"allColumns\"\n            [menuItems]=\"contextMenuItems\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [mo]=\"node.Data\"\n            [index]=\"index\"\n            (commandClick)=\"onUlvCommand()\"\n            [deviceName]=\"deviceName\"\n        ></i>\n        } @if (access?.Add !== false && !inDialog) {\n        <bsu-htree-create-new\n            [node]=\"node\"\n            [relationList]=\"relationList\"\n            (createNew)=\"onCreateNew($event)\"\n        ></bsu-htree-create-new>\n        }\n    </div>\n    @if (access?.View && !showOkCancelButtons && deviceName !== 'desktop' && !hideOpenIcon) {\n    <button fd-button [glyph]=\"navigationArrow\" fdType=\"transparent\" (click)=\"onNodeViewClick()\"></button>\n    }\n\n    <bsu-barsa-tree-item\n        *cdkDragPreview\n        [node]=\"node\"\n        [rtl]=\"rtl\"\n        [selectedNode]=\"selectedNode\"\n        [hasArrowIcon]=\"false\"\n    ></bsu-barsa-tree-item>\n</li>\n", styles: [":host{display:block}li{column-gap:8px}li .cdk-drag-handle{opacity:.5;cursor:move}li .spacer{height:100%}li .arrow-container,li .empty-container{display:flex;width:28px;align-items:center;justify-content:center}li .arrow-container fd-icon,li .empty-container fd-icon{cursor:pointer;width:100%;height:100%;text-align:center}li .arrow-container button[rtl=true],li .empty-container button[rtl=true]{margin-left:5px}li .arrow-container button[rtl=false],li .empty-container button[rtl=false]{margin-right:5px}li .empty-container{visibility:hidden!important}.cdk-drag{cursor:default}.tree-icon-children{cursor:pointer}.icon-item{width:1.75rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2$1.CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.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", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTreeItemComponent, selector: "bsu-barsa-tree-item", inputs: ["node", "selectedNode", "relationList", "hideOpenIcon", "hasArrowIcon", "collapseIcon", "loading", "hasChildren", "leafCursorPointer", "isExpand", "children", "parentNode", "text", "icon", "color", "isHetro", "enableNodeReordering", "hideIcon"], outputs: ["createNew", "select", "checkChange", "viewClick", "loadChildren", "dragMoved"] }, { kind: "component", type: HtreeCreateNewComponent, selector: "bsu-htree-create-new", inputs: ["relationList", "node"], outputs: ["createNew"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTreeItemComponent, decorators: [{
             type: Component,
@@ -3952,7 +3952,7 @@ class NoDataComponent extends BaseComponent {
         this._alingItems = this.simple;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NoDataComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NoDataComponent, selector: "bsu-no-data", inputs: { simple: "simple" }, host: { properties: { "class.a-center": "this._alingItems" } }, usesInheritance: true, ngImport: i0, template: "@if (!simple) {\n<tr style=\"text-align: center\">\n    <td colspan=\"75%\" style=\"padding: 10px\">\n        <!-- <span>{{ 'NoData' | bbbTranslate }}</span> -->\n        <figure fd-illustrated-message [svgConfig]=\"sceneConfig\">\n            <figcaption fd-illustrated-message-figcaption>\n                <h3 fd-illustrated-message-title>{{ 'NoData' | bbbTranslate }}</h3>\n                <p fd-illustrated-message-text>{{ 'NoDataAtThisTime' | bbbTranslate }}</p>\n            </figcaption>\n            <!-- <fd-illustrated-message-actions>\n        <button fd-button label=\"Action One\"></button>\n        <button fd-button label=\"Action Two\"></button>\n      </fd-illustrated-message-actions> -->\n        </figure>\n    </td>\n</tr>\n} @else {\n<h4 fd-title>{{ 'NoData' | bbbTranslate }}</h4>\n}\n", styles: [":host{width:100%;display:flex;justify-content:center}:host.no-topborder{border-top:none}:host.no-btborder{border-bottom:none}:host.a-center{align-items:center}figure{max-height:140px;margin-top:0}\n"], dependencies: [{ kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$3.IllustratedMessageComponent, selector: "[fd-illustrated-message]", inputs: ["type", "svgConfig", "noSvg", "id", "class"] }, { kind: "component", type: i2$3.IllustratedMessageFigcaptionComponent, selector: "[fd-illustrated-message-figcaption]" }, { kind: "directive", type: i2$3.IllustratedMessageTextDirective, selector: "[fd-illustrated-message-text]" }, { kind: "directive", type: i2$3.IllustratedMessageTitleDirective, selector: "[fd-illustrated-message-title]" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NoDataComponent, selector: "bsu-no-data", inputs: { simple: "simple" }, host: { properties: { "class.a-center": "this._alingItems" } }, usesInheritance: true, ngImport: i0, template: "@if (!simple) {\n<tr style=\"text-align: center\">\n    <td colspan=\"75%\" style=\"padding: 10px\">\n        <!-- <span>{{ 'NoData' | bbbTranslate }}</span> -->\n        <figure fd-illustrated-message [svgConfig]=\"sceneConfig\">\n            <figcaption fd-illustrated-message-figcaption>\n                <h3 fd-illustrated-message-title>{{ 'NoData' | bbbTranslate }}</h3>\n                <p fd-illustrated-message-text>{{ 'NoDataAtThisTime' | bbbTranslate }}</p>\n            </figcaption>\n            <!-- <fd-illustrated-message-actions>\n        <button fd-button label=\"Action One\"></button>\n        <button fd-button label=\"Action Two\"></button>\n      </fd-illustrated-message-actions> -->\n        </figure>\n    </td>\n</tr>\n} @else {\n<h4 fd-title>{{ 'NoData' | bbbTranslate }}</h4>\n}\n", styles: [":host{width:100%;display:flex;justify-content:center}:host.no-topborder{border-top:none}:host.no-btborder{border-bottom:none}:host.a-center{align-items:center}figure{max-height:140px;margin-top:0}\n"], dependencies: [{ kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$3.IllustratedMessageComponent, selector: "[fd-illustrated-message]", inputs: ["type", "svgConfig", "svgAriaLabel", "noSvg", "id", "class"] }, { kind: "component", type: i2$3.IllustratedMessageFigcaptionComponent, selector: "[fd-illustrated-message-figcaption]" }, { kind: "directive", type: i2$3.IllustratedMessageTextDirective, selector: "[fd-illustrated-message-text]" }, { kind: "directive", type: i2$3.IllustratedMessageTitleDirective, selector: "[fd-illustrated-message-title]" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NoDataComponent, decorators: [{
             type: Component,
@@ -4133,7 +4133,7 @@ class UiTreeComponent extends ReportTreeBaseComponent {
         this.loadChildren(node);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiTreeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiTreeComponent, selector: "bsu-ui-tree", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        renderTree;\n        context: {\n            $implicit: root$ | async,\n            moDataList: flatMoDataList,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: visibleColumns$ | async,\n            groupby: groupby$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            hideToolbar: hideToolbar$ | async,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            hasSelected: hasSelected$ | async,\n            showOkCancelButtons: showOkCancelButtons,\n            hideOpenIcon: viewSetting?.HideOpenIcon,\n            openOnClick: viewSetting?.OpenOnClick,\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\n            iconField: viewSetting?.IconField,\n            hideIcon: viewSetting?.HideIcon,\n            colorField: viewSetting?.ColorField,\n            selectedNode: selectedNode$ | async,\n            navigationArrow: navigationArrow$ | async,\n            collapseIcon: collapseIcon$ | async,\n            relationList: context.Setting.View.RelationList,\n            allColumns: allColumns,\n            rtl: rtl$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderTree\n    let-root\n    let-moDataList=\"moDataList\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-access=\"access\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-hasSelected=\"hasSelected\"\n    let-showOkCancelButtons=\"showOkCancelButtons\"\n    let-selectedNode=\"selectedNode\"\n    let-navigationArrow=\"navigationArrow\"\n    let-collapseIcon=\"collapseIcon\"\n    let-rtl=\"rtl\"\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\n    let-relationList=\"relationList\"\n    let-isHetro=\"isHetro\"\n    let-inDialog=\"inDialog\"\n    let-isMultiSelect=\"isMultiSelect\"\n    let-selectedMo=\"selectedMo\"\n    let-hideOpenIcon=\"hideOpenIcon\"\n    let-openOnClick=\"openOnClick\"\n    let-enableNodeReordering=\"enableNodeReordering\"\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\n    let-iconField=\"iconField\"\n    let-colorField=\"colorField\"\n    let-allColumns=\"allColumns\"\n    let-hideIcon=\"hideIcon\"\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [inDialog]=\"inDialog\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\n        (columnClick)=\"onColumnSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    >\n        <button\n            fd-button\n            fd-toolbar-item\n            [fdType]=\"'transparent'\"\n            [glyph]=\"'collapse-all'\"\n            (click)=\"onCollapseAll()\"\n        ></button>\n        @if (!showOkCancelButtons && enableNodeReordering) {\n        <button\n            fd-button\n            fd-toolbar-item\n            [fdType]=\"'transparent'\"\n            [glyph]=\"'move'\"\n            (click)=\"onOpenMoveToDialog(selectedNode, deviceName, moveDialog)\"\n        ></button>\n        }\n    </bsu-ulv-toolbar>\n    <bsu-ui-tree-view\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\n        [rtl]=\"rtl\"\n        [relationList]=\"relationList\"\n        [root]=\"root\"\n        [allColumns]=\"allColumns\"\n        [hideIcon]=\"hideIcon\"\n        [selectedMo]=\"selectedMo\"\n        [hideOpenIcon]=\"hideOpenIcon\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [iconField]=\"iconField\"\n        [colorField]=\"colorField\"\n        [navigationArrow]=\"navigationArrow\"\n        [collapseIcon]=\"collapseIcon\"\n        [selectedNode]=\"selectedNode\"\n        [access]=\"access\"\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [enableNodeReordering]=\"enableNodeReordering\"\n        [inDialog]=\"inDialog\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [openOnClick]=\"openOnClick\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [moDataList]=\"moDataList\"\n        [groupby]=\"groupby\"\n        [isHetro]=\"isHetro\"\n        [isCheckList]=\"isCheckList\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        (checkChange)=\"onCheckChange($event)\"\n        (itemDrop)=\"onDrop($event)\"\n        (itemDragMoved)=\"onDragMoved($event)\"\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\n        (nodeViewClick)=\"onNodeViewClick($event)\"\n        (loadChildren)=\"onLoadChildren($event)\"\n        (nodeSelect)=\"onNodeSelect($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"onExpandClick($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (createNew)=\"onCreateNew($event)\"\n    >\n    </bsu-ui-tree-view>\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n            <fd-dialog-header>\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n            </fd-dialog-header>\n\n            <fd-dialog-body>\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\n                    <bsu-ui-tree-view\n                        [rtl]=\"rtl\"\n                        [root]=\"root\"\n                        [access]=\"access\"\n                        [navigationArrow]=\"navigationArrow\"\n                        [collapseIcon]=\"collapseIcon\"\n                        [deviceName]=\"deviceName\"\n                        [deviceSize]=\"deviceSize\"\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\n                        [enableNodeReordering]=\"enableNodeReordering\"\n                        [openOnClick]=\"openOnClick\"\n                        [selectedNode]=\"dialogSelectedNode\"\n                        [moDataList]=\"flatMoDataList\"\n                        [groupby]=\"groupby\"\n                        [isCheckList]=\"isCheckList\"\n                        [conditionalFormats]=\"conditionalFormats\"\n                        (loadChildren)=\"onLoadChildren($event)\"\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\n                    ></bsu-ui-tree-view>\n                </div>\n            </fd-dialog-body>\n\n            <fd-dialog-footer>\n                <ng-template fdkTemplate=\"footer\">\n                    <div fd-bar-right>\n                        <fd-button-bar\n                            fdType=\"emphasized\"\n                            [label]=\"'OK' | bbbTranslate\"\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\n                        >\n                        </fd-button-bar>\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\n                        </fd-button-bar>\n                    </div>\n                </ng-template>\n            </fd-dialog-footer>\n        </fd-dialog>\n    </ng-template>\n</ng-template>\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTreeViewComponent, selector: "bsu-ui-tree-view", inputs: ["root", "selectedNode", "isHetro", "leafCursorPointer", "relationList", "showOkCancelButtons", "enableNodeReordering", "collapseIcon", "iconField", "colorField", "viewSettingsContentDensity"], outputs: ["checkChange", "nodeSelect", "createNew", "loadChildren", "nodeViewClick", "nodeUlvCommand", "itemDrop", "itemDragMoved"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiTreeComponent, selector: "bsu-ui-tree", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        renderTree;\n        context: {\n            $implicit: root$ | async,\n            moDataList: flatMoDataList,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: visibleColumns$ | async,\n            groupby: groupby$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            hideToolbar: hideToolbar$ | async,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            hasSelected: hasSelected$ | async,\n            showOkCancelButtons: showOkCancelButtons,\n            hideOpenIcon: viewSetting?.HideOpenIcon,\n            openOnClick: viewSetting?.OpenOnClick,\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\n            iconField: viewSetting?.IconField,\n            hideIcon: viewSetting?.HideIcon,\n            colorField: viewSetting?.ColorField,\n            selectedNode: selectedNode$ | async,\n            navigationArrow: navigationArrow$ | async,\n            collapseIcon: collapseIcon$ | async,\n            relationList: context.Setting.View.RelationList,\n            allColumns: allColumns,\n            rtl: rtl$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderTree\n    let-root\n    let-moDataList=\"moDataList\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-access=\"access\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-hasSelected=\"hasSelected\"\n    let-showOkCancelButtons=\"showOkCancelButtons\"\n    let-selectedNode=\"selectedNode\"\n    let-navigationArrow=\"navigationArrow\"\n    let-collapseIcon=\"collapseIcon\"\n    let-rtl=\"rtl\"\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\n    let-relationList=\"relationList\"\n    let-isHetro=\"isHetro\"\n    let-inDialog=\"inDialog\"\n    let-isMultiSelect=\"isMultiSelect\"\n    let-selectedMo=\"selectedMo\"\n    let-hideOpenIcon=\"hideOpenIcon\"\n    let-openOnClick=\"openOnClick\"\n    let-enableNodeReordering=\"enableNodeReordering\"\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\n    let-iconField=\"iconField\"\n    let-colorField=\"colorField\"\n    let-allColumns=\"allColumns\"\n    let-hideIcon=\"hideIcon\"\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [inDialog]=\"inDialog\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\n        (columnClick)=\"onColumnSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    >\n        <button\n            fd-button\n            fd-toolbar-item\n            [fdType]=\"'transparent'\"\n            [glyph]=\"'collapse-all'\"\n            (click)=\"onCollapseAll()\"\n        ></button>\n        @if (!showOkCancelButtons && enableNodeReordering) {\n        <button\n            fd-button\n            fd-toolbar-item\n            [fdType]=\"'transparent'\"\n            [glyph]=\"'move'\"\n            (click)=\"onOpenMoveToDialog(selectedNode, deviceName, moveDialog)\"\n        ></button>\n        }\n    </bsu-ulv-toolbar>\n    <bsu-ui-tree-view\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\n        [rtl]=\"rtl\"\n        [relationList]=\"relationList\"\n        [root]=\"root\"\n        [allColumns]=\"allColumns\"\n        [hideIcon]=\"hideIcon\"\n        [selectedMo]=\"selectedMo\"\n        [hideOpenIcon]=\"hideOpenIcon\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [iconField]=\"iconField\"\n        [colorField]=\"colorField\"\n        [navigationArrow]=\"navigationArrow\"\n        [collapseIcon]=\"collapseIcon\"\n        [selectedNode]=\"selectedNode\"\n        [access]=\"access\"\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [enableNodeReordering]=\"enableNodeReordering\"\n        [inDialog]=\"inDialog\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [openOnClick]=\"openOnClick\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [moDataList]=\"moDataList\"\n        [groupby]=\"groupby\"\n        [isHetro]=\"isHetro\"\n        [isCheckList]=\"isCheckList\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        (checkChange)=\"onCheckChange($event)\"\n        (itemDrop)=\"onDrop($event)\"\n        (itemDragMoved)=\"onDragMoved($event)\"\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\n        (nodeViewClick)=\"onNodeViewClick($event)\"\n        (loadChildren)=\"onLoadChildren($event)\"\n        (nodeSelect)=\"onNodeSelect($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"onExpandClick($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (createNew)=\"onCreateNew($event)\"\n    >\n    </bsu-ui-tree-view>\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n            <fd-dialog-header>\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n            </fd-dialog-header>\n\n            <fd-dialog-body>\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\n                    <bsu-ui-tree-view\n                        [rtl]=\"rtl\"\n                        [root]=\"root\"\n                        [access]=\"access\"\n                        [navigationArrow]=\"navigationArrow\"\n                        [collapseIcon]=\"collapseIcon\"\n                        [deviceName]=\"deviceName\"\n                        [deviceSize]=\"deviceSize\"\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\n                        [enableNodeReordering]=\"enableNodeReordering\"\n                        [openOnClick]=\"openOnClick\"\n                        [selectedNode]=\"dialogSelectedNode\"\n                        [moDataList]=\"flatMoDataList\"\n                        [groupby]=\"groupby\"\n                        [isCheckList]=\"isCheckList\"\n                        [conditionalFormats]=\"conditionalFormats\"\n                        (loadChildren)=\"onLoadChildren($event)\"\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\n                    ></bsu-ui-tree-view>\n                </div>\n            </fd-dialog-body>\n\n            <fd-dialog-footer>\n                <ng-template fdkTemplate=\"footer\">\n                    <div fd-bar-right>\n                        <fd-button-bar\n                            fdType=\"emphasized\"\n                            [label]=\"'OK' | bbbTranslate\"\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\n                        >\n                        </fd-button-bar>\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\n                        </fd-button-bar>\n                    </div>\n                </ng-template>\n            </fd-dialog-footer>\n        </fd-dialog>\n    </ng-template>\n</ng-template>\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTreeViewComponent, selector: "bsu-ui-tree-view", inputs: ["root", "selectedNode", "isHetro", "leafCursorPointer", "relationList", "showOkCancelButtons", "enableNodeReordering", "collapseIcon", "iconField", "colorField", "viewSettingsContentDensity"], outputs: ["checkChange", "nodeSelect", "createNew", "loadChildren", "nodeViewClick", "nodeUlvCommand", "itemDrop", "itemDragMoved"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiTreeComponent, decorators: [{
             type: Component,
@@ -4159,7 +4159,7 @@ class InlineSaveAndCancelComponent extends BaseComponent {
         e.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: InlineSaveAndCancelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: InlineSaveAndCancelComponent, selector: "bsu-inline-save-and-cancel,[inlineSaveAndCancel]", outputs: { save: "save", cancel: "cancel" }, usesInheritance: true, ngImport: i0, template: "<button fd-button glyph=\"accept\" role=\"save\" (click)=\"onSave($event)\"></button>\n<button fd-button fdType=\"negative\" glyph=\"decline\" role=\"canecl form\" (click)=\"onCancel($event)\"></button>\n", styles: [":host{display:flex;justify-content:space-evenly;align-items:center;width:100%}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: InlineSaveAndCancelComponent, selector: "bsu-inline-save-and-cancel,[inlineSaveAndCancel]", outputs: { save: "save", cancel: "cancel" }, usesInheritance: true, ngImport: i0, template: "<button fd-button glyph=\"accept\" role=\"save\" (click)=\"onSave($event)\"></button>\n<button fd-button fdType=\"negative\" glyph=\"decline\" role=\"canecl form\" (click)=\"onCancel($event)\"></button>\n", styles: [":host{display:flex;justify-content:space-evenly;align-items:center;width:100%}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: InlineSaveAndCancelComponent, decorators: [{
             type: Component,
@@ -4267,7 +4267,7 @@ class FileViewerContentComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FileViewerContentComponent, deps: [{ token: i2.PictureFieldSourcePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: { fillWidth: "fillWidth", imageOnly: "imageOnly", isImageGallery: "isImageGallery", cardMode: "cardMode", showFooter: "showFooter", showContent: "showContent", width: "width", deviceSize: "deviceSize", cardContentHeight: "cardContentHeight", file: "file" }, outputs: { cantView: "cantView" }, host: { properties: { "style.height": "this._height" } }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"cardMode ? cardTpl : file.isImage || imageOnly ? showImage : blobViewer\"\n></ng-container>\n\n<ng-template #showImage>\n    <div class=\"column big-imgs-box\" [class.fill-width]=\"fillWidth\">\n        <div class=\"pics\">\n            <bsu-mask></bsu-mask>\n            <img imgLazy [imgLazy]=\"file.mediaUrl\" [src]=\"file.mediaUrl\" [style.width]=\"width\" />\n        </div>\n    </div>\n</ng-template>\n<ng-template #blobViewer>\n    @if(!hideContent){\n    <bsu-blob-viewer\n        [file]=\"file\"\n        [style.width]=\"width\"\n        fillEmptySpace\n        [disable]=\"deviceSize !== 's'\"\n        [decrement]=\"'25px'\"\n    ></bsu-blob-viewer>\n    }@else{ }\n</ng-template>\n<ng-template #cardTpl>\n    <fd-card class=\"media\">\n        <fd-card-content\n            style=\"text-align: center\"\n            [style.height]=\"cardContentHeight\"\n            [style.display]=\"hideContent ? 'none' : null\"\n        >\n            <ng-container\n                *ngTemplateOutlet=\"!showContent ? thumbnailTpl : file.isImage || imageOnly ? showImage : blobViewer\"\n            ></ng-container>\n        </fd-card-content>\n    </fd-card>\n</ng-template>\n<ng-template #thumbnailTpl>\n    <img imgLazy [imgLazy]=\"file.thumbnailUrl\" [src]=\"file.thumbnailUrl\" [style.width]=\"width\" />\n</ng-template>\n", styles: [":host{display:block;height:100%}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: { fillWidth: "fillWidth", imageOnly: "imageOnly", isImageGallery: "isImageGallery", cardMode: "cardMode", showFooter: "showFooter", showContent: "showContent", width: "width", deviceSize: "deviceSize", cardContentHeight: "cardContentHeight", file: "file" }, outputs: { cantView: "cantView" }, host: { properties: { "style.height": "this._height" } }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"cardMode ? cardTpl : file.isImage || imageOnly ? showImage : blobViewer\"\n></ng-container>\n\n<ng-template #showImage>\n    <div class=\"column big-imgs-box\" [class.fill-width]=\"fillWidth\">\n        <div class=\"pics\">\n            <bsu-mask></bsu-mask>\n            <img imgLazy [imgLazy]=\"file.mediaUrl\" [src]=\"file.mediaUrl\" [style.width]=\"width\" />\n        </div>\n    </div>\n</ng-template>\n<ng-template #blobViewer>\n    @if(!hideContent){\n    <bsu-blob-viewer\n        [file]=\"file\"\n        [style.width]=\"width\"\n        fillEmptySpace\n        [disable]=\"deviceSize !== 's'\"\n        [decrement]=\"'25px'\"\n    ></bsu-blob-viewer>\n    }@else{ }\n</ng-template>\n<ng-template #cardTpl>\n    <fd-card class=\"media\">\n        <fd-card-content\n            style=\"text-align: center\"\n            [style.height]=\"cardContentHeight\"\n            [style.display]=\"hideContent ? 'none' : null\"\n        >\n            <ng-container\n                *ngTemplateOutlet=\"!showContent ? thumbnailTpl : file.isImage || imageOnly ? showImage : blobViewer\"\n            ></ng-container>\n        </fd-card-content>\n    </fd-card>\n</ng-template>\n<ng-template #thumbnailTpl>\n    <img imgLazy [imgLazy]=\"file.thumbnailUrl\" [src]=\"file.thumbnailUrl\" [style.width]=\"width\" />\n</ng-template>\n", styles: [":host{display:block;height:100%}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FileViewerContentComponent, decorators: [{
             type: Component,
@@ -4409,7 +4409,7 @@ class FileViewerPopoverComponent extends BaseComponent {
         this.hideFullScreen = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FileViewerPopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: { files: "files", file: "file", deviceSize: "deviceSize", canDownload: "canDownload", disableRemove: "disableRemove", fdType: "fdType" }, outputs: { remove: "remove" }, usesInheritance: true, ngImport: i0, template: "<!-- <div class=\"box\" #divRef (mouseover)=\"divRef.classList.add('onside')\" (mouseout)=\"divRef.classList.remove('onside')\">\n<div class=\"box-content\">\n  <fd-icon [glyph]=\"'pdf-attachment'\"></fd-icon>\n</div>\n<div class=\"box-file-download\">\n  <div class=\"icon\">\n    <img\n      id=\":1wy\"\n      class=\"aSM\"\n      src=\"//ssl.gstatic.com/docs/doclist/images/mediatype/icon_2_archive_x16.png\"\n      title=\"Compressed Archive\"\n      />\n    </div>\n    <div class=\"filename-wrapper\">\n      <span class=\"filename\">build.rar</span>\n    </div>\n  </div>\n  <div class=\"download-wrapper\">\n    <button fd-button glyph=\"download\" fdType=\"transparent\"></button>\n    <button fd-button glyph=\"download\" fdType=\"transparent\"></button>\n  </div>\n</div> -->\n\n<div style=\"display: flex; align-items: center; column-gap: 1px\">\n    <button\n        fd-button\n        [fdPopoverTrigger]=\"deviceSize === 's' ? popoverMobile : popoverLarge\"\n        [label]=\"file.FileName || ''\"\n        [title]=\"file.FileName || ''\"\n        glyph=\"attachment\"\n        [fdMenu]=\"true\"\n        [fdType]=\"fdType\"\n        class=\"btn-actionsheet\"\n    ></button>\n    <fd-popover\n        #popoverMobile\n        [mobile]=\"true\"\n        [mobileConfig]=\"{ title: 'ShowFiles' | bbbTranslate, hasCloseButton: true }\"\n    >\n        <ng-template #popoverBodyContent>\n            <ng-container\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverMobile, mobile: true }\"\n            ></ng-container>\n        </ng-template>\n    </fd-popover>\n    <fd-popover #popoverLarge>\n        <fd-popover-body>\n            <ng-container\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverLarge, mobile: false }\"\n            ></ng-container>\n        </fd-popover-body>\n    </fd-popover>\n\n    @if (!disableRemove) {\n    <button fd-button glyph=\"delete\" (click)=\"remove.emit()\"></button>\n    }\n</div>\n\n<ng-template #popoverbodyTpl let-popover let-mobile=\"mobile\">\n    <div fd-popover-body-header>\n        <div fd-bar [cozy]=\"true\" id=\"popover-bar-header-3\">\n            <div fd-bar-left>\n                <fd-bar-element>{{ file.FileName }}</fd-bar-element>\n            </div>\n        </div>\n    </div>\n    <bsu-file-viewer-content\n        [file]=\"file\"\n        [width]=\"mobile ? '100vw' : '30vw'\"\n        [cardMode]=\"true\"\n        [showContent]=\"true\"\n        [showFooter]=\"true\"\n        [deviceSize]=\"deviceSize\"\n        [cardContentHeight]=\"mobile ? null : '320px'\"\n        (cantView)=\"hideFullScreen = true\"\n    ></bsu-file-viewer-content>\n    @if (canDownload) {\n    <div fd-popover-body-footer>\n        <div fd-bar barDesign=\"footer\">\n            <div fd-bar-right>\n                <fd-button-bar\n                    fdType=\"transparent\"\n                    glyph=\"download\"\n                    downloadFiles\n                    [files]=\"[file]\"\n                    (click)=\"popover.close()\"\n                ></fd-button-bar>\n                @if (!mobile && !hideFullScreen) {\n                <fd-button-bar\n                    fdType=\"transparent\"\n                    glyph=\"resize\"\n                    fullscreenFiles\n                    [files]=\"files?.length ? files : [file]\"\n                    (click)=\"popover.close()\"\n                ></fd-button-bar>\n                }\n            </div>\n        </div>\n    </div>\n    }\n</ng-template>\n", styles: [":host{display:block}.btn-actionsheet{width:100%!important;max-width:100%!important}.box{display:flex;flex-direction:column;width:175px;height:120px;position:relative;border:1px solid #ccc}.box .box-content{height:85px;text-align:center;display:flex;align-items:center;justify-content:center}.box .box-content fd-icon{font-size:1.825rem;color:#e5e5e5}.box .box-file-download{background-color:#f5f5f5;border-top:1px solid #e5e5e5;display:flex;gap:.285rem}.box .box-file-download .icon{align-items:center;float:left;display:-webkit-box;display:-webkit-flex;display:flex;height:32px;-webkit-justify-content:center;justify-content:center;width:32px}.box .box-file-download .filename-wrapper{display:flex;overflow:hidden}.box .box-file-download .filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777;font-size:12px;font-weight:700;line-height:16px;margin-top:8px;word-wrap:normal}.box .download-wrapper{display:none}.box.onside{background:#f5f5f5}.box.onside .box-content{display:none}.box.onside .box-file-download{border-top:none;height:85px}.box.onside .download-wrapper{display:flex;gap:.285rem;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "width", "deviceSize", "cardContentHeight", "file"], outputs: ["cantView"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: { files: "files", file: "file", deviceSize: "deviceSize", canDownload: "canDownload", disableRemove: "disableRemove", fdType: "fdType" }, outputs: { remove: "remove" }, usesInheritance: true, ngImport: i0, template: "<!-- <div class=\"box\" #divRef (mouseover)=\"divRef.classList.add('onside')\" (mouseout)=\"divRef.classList.remove('onside')\">\n<div class=\"box-content\">\n  <fd-icon [glyph]=\"'pdf-attachment'\"></fd-icon>\n</div>\n<div class=\"box-file-download\">\n  <div class=\"icon\">\n    <img\n      id=\":1wy\"\n      class=\"aSM\"\n      src=\"//ssl.gstatic.com/docs/doclist/images/mediatype/icon_2_archive_x16.png\"\n      title=\"Compressed Archive\"\n      />\n    </div>\n    <div class=\"filename-wrapper\">\n      <span class=\"filename\">build.rar</span>\n    </div>\n  </div>\n  <div class=\"download-wrapper\">\n    <button fd-button glyph=\"download\" fdType=\"transparent\"></button>\n    <button fd-button glyph=\"download\" fdType=\"transparent\"></button>\n  </div>\n</div> -->\n\n<div style=\"display: flex; align-items: center; column-gap: 1px\">\n    <button\n        fd-button\n        [fdPopoverTrigger]=\"deviceSize === 's' ? popoverMobile : popoverLarge\"\n        [label]=\"file.FileName || ''\"\n        [title]=\"file.FileName || ''\"\n        glyph=\"attachment\"\n        [fdMenu]=\"true\"\n        [fdType]=\"fdType\"\n        class=\"btn-actionsheet\"\n    ></button>\n    <fd-popover\n        #popoverMobile\n        [mobile]=\"true\"\n        [mobileConfig]=\"{ title: 'ShowFiles' | bbbTranslate, hasCloseButton: true }\"\n    >\n        <ng-template #popoverBodyContent>\n            <ng-container\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverMobile, mobile: true }\"\n            ></ng-container>\n        </ng-template>\n    </fd-popover>\n    <fd-popover #popoverLarge>\n        <fd-popover-body>\n            <ng-container\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverLarge, mobile: false }\"\n            ></ng-container>\n        </fd-popover-body>\n    </fd-popover>\n\n    @if (!disableRemove) {\n    <button fd-button glyph=\"delete\" (click)=\"remove.emit()\"></button>\n    }\n</div>\n\n<ng-template #popoverbodyTpl let-popover let-mobile=\"mobile\">\n    <div fd-popover-body-header>\n        <div fd-bar [cozy]=\"true\" id=\"popover-bar-header-3\">\n            <div fd-bar-left>\n                <fd-bar-element>{{ file.FileName }}</fd-bar-element>\n            </div>\n        </div>\n    </div>\n    <bsu-file-viewer-content\n        [file]=\"file\"\n        [width]=\"mobile ? '100vw' : '30vw'\"\n        [cardMode]=\"true\"\n        [showContent]=\"true\"\n        [showFooter]=\"true\"\n        [deviceSize]=\"deviceSize\"\n        [cardContentHeight]=\"mobile ? null : '320px'\"\n        (cantView)=\"hideFullScreen = true\"\n    ></bsu-file-viewer-content>\n    @if (canDownload) {\n    <div fd-popover-body-footer>\n        <div fd-bar barDesign=\"footer\">\n            <div fd-bar-right>\n                <fd-button-bar\n                    fdType=\"transparent\"\n                    glyph=\"download\"\n                    downloadFiles\n                    [files]=\"[file]\"\n                    (click)=\"popover.close()\"\n                ></fd-button-bar>\n                @if (!mobile && !hideFullScreen) {\n                <fd-button-bar\n                    fdType=\"transparent\"\n                    glyph=\"resize\"\n                    fullscreenFiles\n                    [files]=\"files?.length ? files : [file]\"\n                    (click)=\"popover.close()\"\n                ></fd-button-bar>\n                }\n            </div>\n        </div>\n    </div>\n    }\n</ng-template>\n", styles: [":host{display:block}.btn-actionsheet{width:100%!important;max-width:100%!important}.box{display:flex;flex-direction:column;width:175px;height:120px;position:relative;border:1px solid #ccc}.box .box-content{height:85px;text-align:center;display:flex;align-items:center;justify-content:center}.box .box-content fd-icon{font-size:1.825rem;color:#e5e5e5}.box .box-file-download{background-color:#f5f5f5;border-top:1px solid #e5e5e5;display:flex;gap:.285rem}.box .box-file-download .icon{align-items:center;float:left;display:-webkit-box;display:-webkit-flex;display:flex;height:32px;-webkit-justify-content:center;justify-content:center;width:32px}.box .box-file-download .filename-wrapper{display:flex;overflow:hidden}.box .box-file-download .filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777;font-size:12px;font-weight:700;line-height:16px;margin-top:8px;word-wrap:normal}.box .download-wrapper{display:none}.box.onside{background:#f5f5f5}.box.onside .box-content{display:none}.box.onside .box-file-download{border-top:none;height:85px}.box.onside .download-wrapper{display:flex;gap:.285rem;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "width", "deviceSize", "cardContentHeight", "file"], outputs: ["cantView"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FileViewerPopoverComponent, decorators: [{
             type: Component,
@@ -4461,7 +4461,7 @@ class ColumnRendererComponent extends BaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColumnRendererComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: { column: "column", mo: "mo", index: "index", editMode: "editMode", customRowHeight: "customRowHeight", controlUi: "controlUi", formLayoutShowLabel: "formLayoutShowLabel", isChecked: "isChecked", isNewInlineMo: "isNewInlineMo", containerDom: "containerDom", disableEllapsis: "disableEllapsis", rtl: "rtl", deviceName: "deviceName", deviceSize: "deviceSize", value: "value", icon: "icon" }, host: { properties: { "class.isMobile": "this._isSmall" } }, usesInheritance: true, ngImport: i0, template: "@if (column) {\n<ng-container *ngTemplateOutlet=\"editMode ? formControlTemplate : renderCellTemplate\"> </ng-container>\n}\n<ng-template #renderCellTemplate>\n    @switch (column.FieldTypeId) { @case (42) {\n    <ng-container *ngTemplateOutlet=\"renderCellImage\"></ng-container>\n    } @case (33) {\n    <ng-container *ngTemplateOutlet=\"renderCellFileInfo\"></ng-container>\n    } @case (31) {\n    <ng-container *ngTemplateOutlet=\"renderCellFileListKhati\"></ng-container>\n    } @case (11) {\n    <ng-container *ngTemplateOutlet=\"renderCellListTasavir\"></ng-container>\n    } @case (5) {\n    <ng-container\n        *ngTemplateOutlet=\"column.Extra?.ShowCheckInGrid ? renderCellChecbox : renderChecboxImage\"\n    ></ng-container>\n    } @default {\n    <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n    } }\n</ng-template>\n<ng-template #renderGeneral>\n    <div style=\"display: flex; width: 100%; height: 100%; align-items: center; justify-content: start\" [style.width]=\"\">\n        @if (icon) {\n        <img [attr.rtl]=\"rtl\" [src]=\"icon\" />\n        }\n        <!-- <fd-text\n    #fdText\n    *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\"\n    [maxLines]=\"1\"\n    [text]=\"value\"\n    [fd-inline-help]=\"value\"\n    [disabled]=\"!fdText._hasMore\"\n  ></fd-text> -->\n\n        <!-- <bsu-barsa-text-ellipsis\n  [style.width]=\"column.$Width\"\n  *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\"\n  [text]=\"value\"\n></bsu-barsa-text-ellipsis> -->\n        <!-- <div *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\" style=\"word-break:break-word\">\n{{ value }}\n</div> -->\n        @if (column.Extra?.IconDisplayTypeEnum !== 'Image') {\n        <div\n            [ellapsisText]=\"value\"\n            [class.ellapsis]=\"!disableEllapsis\"\n            (ellapsised)=\"onElapsised($event)\"\n            (click)=\"showMore && helpPopover.open()\"\n        >\n            {{ value }}\n        </div>\n        }\n        <fd-popover #helpPopover>\n            <fd-popover-control> </fd-popover-control>\n            <fd-popover-body class=\"help-popover-body\">\n                <div fd-popover-body-header>\n                    <div fd-bar>\n                        <div fd-bar-left>\n                            <fd-bar-element style=\"white-space: break-spaces\"\n                                >{{ column.Alias | bbbTranslate }}:</fd-bar-element\n                            >\n                        </div>\n                        <div fd-bar-right>\n                            <fd-bar-element\n                                ><button\n                                    fd-button\n                                    fdType=\"transparent\"\n                                    glyph=\"decline\"\n                                    (click)=\"helpPopover.close()\"\n                                ></button>\n                            </fd-bar-element>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"help-content\">{{ value }}</div>\n            </fd-popover-body>\n        </fd-popover>\n    </div>\n</ng-template>\n<ng-template #formControlTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            !controlUi || controlUi.FieldUi.originalXtype === 'Ui.ReadOnlyField'\n                ? renderCellTemplate\n                : layoutControlTemplate\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #layoutControlTemplate>\n    @if (controlUi) {\n    <bsu-layout-control\n        [inlineEdit]=\"true\"\n        [caption]=\"column.Caption\"\n        [config]=\"controlUi\"\n        [focusControl]=\"index === 0 && (isChecked || isNewInlineMo)\"\n        [showLabel]=\"formLayoutShowLabel\"\n    ></bsu-layout-control>\n    }\n</ng-template>\n<ng-template #renderCellListTasavir>\n    @if (mo[column.Name] && mo[column.Name].Images) {\n    <div style=\"display: flex; flex-wrap: wrap; gap: 0.15rem\">\n        @for (pic of mo[column.Name].Images; track pic) {\n        <img\n            fullscreen\n            fullscreenFiles\n            [files]=\"mo[column.Name].Images\"\n            [isImageGallery]=\"true\"\n            [deviceSize]=\"deviceSize\"\n            [src]=\"pic.FileId | picFieldSrc: 'BarsaPicture.Thumbnail':null:'':32:32\"\n            style=\"width: 3rem; height: 3rem\"\n        />\n        }\n    </div>\n    }\n</ng-template>\n<ng-template #renderCellFileListKhati>\n    @if (mo[column.Name]) {\n    <div class=\"file-viewer-attachments\">\n        @for (file of mo[column.Name].Files; track file) { @if (!file.IsDeleted) {\n        <bsu-file-viewer-popover\n            [style.width.px]=\"containerDom ? containerDom.offsetWidth : null\"\n            [file]=\"file\"\n            [files]=\"mo[column.Name].Files\"\n            [deviceSize]=\"deviceSize\"\n            [canDownload]=\"true\"\n            [disableRemove]=\"true\"\n            [fdType]=\"'transparent'\"\n        ></bsu-file-viewer-popover>\n        }\n        <!-- <fd-token *ngIf=\"!file.IsDeleted\" [readOnly]=\"true\">{{ file.FileName }}</fd-token> -->\n        }\n    </div>\n    }\n</ng-template>\n<ng-template #renderCellFileInfo>\n    @if (mo[column.Name]) {\n    <fd-avatar\n        [transparent]=\"true\"\n        [size]=\"deviceSize === 's' ? 's' : 'm'\"\n        [image]=\"mo[column.Name] | picFieldSrc: 'PictureFileInfo':null:column.FieldDefId\"\n    ></fd-avatar>\n    }\n</ng-template>\n<ng-template #renderCellChecbox>\n    <fd-icon [glyph]=\"mo[column.Name] === true ? 'accept' : 'less'\"></fd-icon>\n</ng-template>\n<ng-template #renderChecboxImage>\n    @if (column.Extra?.TrueImage === '') {\n    {{ value }}\n    } @if (column.Extra?.TrueImage !== '') {\n    <img [src]=\"mo[column.Name] ? column.Extra?.TrueImage : column.Extra?.FalseImage\" aling=\"middle\" />\n    }\n</ng-template>\n<ng-template #renderCellImage>\n    @if (mo[column.Name] && mo[column.Name]['Url']) {\n    <fd-avatar\n        [size]=\"column.FieldTypeId === '42' ? 'xs' : deviceSize === 's' ? 's' : 'm'\"\n        [transparent]=\"true\"\n        [image]=\"mo[column.Name]['Url']\"\n    ></fd-avatar>\n    }\n</ng-template>\n", styles: [":host{display:contents;overflow:hidden;padding:0}:host.isMobile span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;white-space:pre-wrap}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize"], outputs: ["ellapsised"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: { column: "column", mo: "mo", index: "index", editMode: "editMode", customRowHeight: "customRowHeight", controlUi: "controlUi", formLayoutShowLabel: "formLayoutShowLabel", isChecked: "isChecked", isNewInlineMo: "isNewInlineMo", containerDom: "containerDom", disableEllapsis: "disableEllapsis", rtl: "rtl", deviceName: "deviceName", deviceSize: "deviceSize", value: "value", icon: "icon" }, host: { properties: { "class.isMobile": "this._isSmall" } }, usesInheritance: true, ngImport: i0, template: "@if (column) {\n<ng-container *ngTemplateOutlet=\"editMode ? formControlTemplate : renderCellTemplate\"> </ng-container>\n}\n<ng-template #renderCellTemplate>\n    @switch (column.FieldTypeId) { @case (42) {\n    <ng-container *ngTemplateOutlet=\"renderCellImage\"></ng-container>\n    } @case (33) {\n    <ng-container *ngTemplateOutlet=\"renderCellFileInfo\"></ng-container>\n    } @case (31) {\n    <ng-container *ngTemplateOutlet=\"renderCellFileListKhati\"></ng-container>\n    } @case (11) {\n    <ng-container *ngTemplateOutlet=\"renderCellListTasavir\"></ng-container>\n    } @case (5) {\n    <ng-container\n        *ngTemplateOutlet=\"column.Extra?.ShowCheckInGrid ? renderCellChecbox : renderChecboxImage\"\n    ></ng-container>\n    } @default {\n    <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n    } }\n</ng-template>\n<ng-template #renderGeneral>\n    <div style=\"display: flex; width: 100%; height: 100%; align-items: center; justify-content: start\" [style.width]=\"\">\n        @if (icon) {\n        <img [attr.rtl]=\"rtl\" [src]=\"icon\" />\n        }\n        <!-- <fd-text\n    #fdText\n    *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\"\n    [maxLines]=\"1\"\n    [text]=\"value\"\n    [fd-inline-help]=\"value\"\n    [disabled]=\"!fdText._hasMore\"\n  ></fd-text> -->\n\n        <!-- <bsu-barsa-text-ellipsis\n  [style.width]=\"column.$Width\"\n  *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\"\n  [text]=\"value\"\n></bsu-barsa-text-ellipsis> -->\n        <!-- <div *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\" style=\"word-break:break-word\">\n{{ value }}\n</div> -->\n        @if (column.Extra?.IconDisplayTypeEnum !== 'Image') {\n        <div\n            [ellapsisText]=\"value\"\n            [class.ellapsis]=\"!disableEllapsis\"\n            (ellapsised)=\"onElapsised($event)\"\n            (click)=\"showMore && helpPopover.open()\"\n        >\n            {{ value }}\n        </div>\n        }\n        <fd-popover #helpPopover>\n            <fd-popover-control> </fd-popover-control>\n            <fd-popover-body class=\"help-popover-body\">\n                <div fd-popover-body-header>\n                    <div fd-bar>\n                        <div fd-bar-left>\n                            <fd-bar-element style=\"white-space: break-spaces\"\n                                >{{ column.Alias | bbbTranslate }}:</fd-bar-element\n                            >\n                        </div>\n                        <div fd-bar-right>\n                            <fd-bar-element\n                                ><button\n                                    fd-button\n                                    fdType=\"transparent\"\n                                    glyph=\"decline\"\n                                    (click)=\"helpPopover.close()\"\n                                ></button>\n                            </fd-bar-element>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"help-content\">{{ value }}</div>\n            </fd-popover-body>\n        </fd-popover>\n    </div>\n</ng-template>\n<ng-template #formControlTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            !controlUi || controlUi.FieldUi.originalXtype === 'Ui.ReadOnlyField'\n                ? renderCellTemplate\n                : layoutControlTemplate\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #layoutControlTemplate>\n    @if (controlUi) {\n    <bsu-layout-control\n        [inlineEdit]=\"true\"\n        [caption]=\"column.Caption\"\n        [config]=\"controlUi\"\n        [focusControl]=\"index === 0 && (isChecked || isNewInlineMo)\"\n        [showLabel]=\"formLayoutShowLabel\"\n    ></bsu-layout-control>\n    }\n</ng-template>\n<ng-template #renderCellListTasavir>\n    @if (mo[column.Name] && mo[column.Name].Images) {\n    <div style=\"display: flex; flex-wrap: wrap; gap: 0.15rem\">\n        @for (pic of mo[column.Name].Images; track pic) {\n        <img\n            fullscreen\n            fullscreenFiles\n            [files]=\"mo[column.Name].Images\"\n            [isImageGallery]=\"true\"\n            [deviceSize]=\"deviceSize\"\n            [src]=\"pic.FileId | picFieldSrc: 'BarsaPicture.Thumbnail':null:'':32:32\"\n            style=\"width: 3rem; height: 3rem\"\n        />\n        }\n    </div>\n    }\n</ng-template>\n<ng-template #renderCellFileListKhati>\n    @if (mo[column.Name]) {\n    <div class=\"file-viewer-attachments\">\n        @for (file of mo[column.Name].Files; track file) { @if (!file.IsDeleted) {\n        <bsu-file-viewer-popover\n            [style.width.px]=\"containerDom ? containerDom.offsetWidth : null\"\n            [file]=\"file\"\n            [files]=\"mo[column.Name].Files\"\n            [deviceSize]=\"deviceSize\"\n            [canDownload]=\"true\"\n            [disableRemove]=\"true\"\n            [fdType]=\"'transparent'\"\n        ></bsu-file-viewer-popover>\n        }\n        <!-- <fd-token *ngIf=\"!file.IsDeleted\" [readOnly]=\"true\">{{ file.FileName }}</fd-token> -->\n        }\n    </div>\n    }\n</ng-template>\n<ng-template #renderCellFileInfo>\n    @if (mo[column.Name]) {\n    <fd-avatar\n        [transparent]=\"true\"\n        [size]=\"deviceSize === 's' ? 's' : 'm'\"\n        [image]=\"mo[column.Name] | picFieldSrc: 'PictureFileInfo':null:column.FieldDefId\"\n    ></fd-avatar>\n    }\n</ng-template>\n<ng-template #renderCellChecbox>\n    <fd-icon [glyph]=\"mo[column.Name] === true ? 'accept' : 'less'\"></fd-icon>\n</ng-template>\n<ng-template #renderChecboxImage>\n    @if (column.Extra?.TrueImage === '') {\n    {{ value }}\n    } @if (column.Extra?.TrueImage !== '') {\n    <img [src]=\"mo[column.Name] ? column.Extra?.TrueImage : column.Extra?.FalseImage\" aling=\"middle\" />\n    }\n</ng-template>\n<ng-template #renderCellImage>\n    @if (mo[column.Name] && mo[column.Name]['Url']) {\n    <fd-avatar\n        [size]=\"column.FieldTypeId === '42' ? 'xs' : deviceSize === 's' ? 's' : 'm'\"\n        [transparent]=\"true\"\n        [image]=\"mo[column.Name]['Url']\"\n    ></fd-avatar>\n    }\n</ng-template>\n", styles: [":host{display:contents;overflow:hidden;padding:0}:host.isMobile span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;white-space:pre-wrap}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize"], outputs: ["ellapsised"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColumnRendererComponent, decorators: [{
             type: Component,
@@ -4555,7 +4555,7 @@ class ReportNewTopFormComponent extends BaseViewItemPropsComponent {
         this.formPanelCtrlr.Clear();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportNewTopFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportNewTopFormComponent, selector: "bsu-report-new-top-form", inputs: { selectedMo: "selectedMo" }, outputs: { add: "add", save: "save" }, providers: [FormPanelService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (layout$ | async; as layout94) {\n<bsu-ly-layout-container-of-root\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\n}\n<div>\n    <button\n        fd-button\n        [disabled]=\"!!selectedMo\"\n        [fdType]=\"'standard'\"\n        [label]=\"'New' | bbbTranslate\"\n        [glyph]=\"'pull-down'\"\n        (click)=\"onAdd()\"\n    ></button>\n    <button\n        fd-button\n        (click)=\"onSave()\"\n        [disabled]=\"!selectedMo\"\n        [fdType]=\"'standard'\"\n        [label]=\"'Save' | bbbTranslate\"\n        [glyph]=\"'save'\"\n    ></button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;align-items:flex-end}button{margin:.3rem 5px .5rem;max-width:170px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportNewTopFormComponent, selector: "bsu-report-new-top-form", inputs: { selectedMo: "selectedMo" }, outputs: { add: "add", save: "save" }, providers: [FormPanelService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (layout$ | async; as layout94) {\n<bsu-ly-layout-container-of-root\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\n}\n<div>\n    <button\n        fd-button\n        [disabled]=\"!!selectedMo\"\n        [fdType]=\"'standard'\"\n        [label]=\"'New' | bbbTranslate\"\n        [glyph]=\"'pull-down'\"\n        (click)=\"onAdd()\"\n    ></button>\n    <button\n        fd-button\n        (click)=\"onSave()\"\n        [disabled]=\"!selectedMo\"\n        [fdType]=\"'standard'\"\n        [label]=\"'Save' | bbbTranslate\"\n        [glyph]=\"'save'\"\n    ></button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;align-items:flex-end}button{margin:.3rem 5px .5rem;max-width:170px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportNewTopFormComponent, decorators: [{
             type: Component,
@@ -5038,7 +5038,7 @@ class CardItemComponent extends BaseViewItemPropsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CardItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\n    [cardType]=\"setting.CardType$Caption\"\n    class=\"docs-flex-item-margin\"\n    [class.openOnClick]=\"setting.openOnClick\"\n    [style.width]=\"cardWidth\"\n    [style.min-width]=\"minWidth\"\n    [style.max-width]=\"maxWidth\"\n>\n    <ng-container\n        *ngTemplateOutlet=\"\n            setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n            context: {\n                $implicit: mo,\n                index: this.index\n            }\n        \"\n    ></ng-container>\n\n    @if (!noContent || contextMenuItems) {\n    <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n                    context: {\n                        $implicit: mo,\n                        index: this.index\n                    }\n                \"\n            ></ng-container>\n        </div>\n        @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n        <div\n            ulvContextMenu\n            [allColumns]=\"allColumns\"\n            [footerMode]=\"true\"\n            [menuItems]=\"contextMenuItems\"\n            [styleIndex]=\"styleIndex\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [mo]=\"mo\"\n            (commandClick)=\"onUlvCommand()\"\n        ></div>\n        }\n    </fd-card-content>\n    }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n    >@if (column) {\n    <div\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\n            [value]=\"column | columnValue: mo | bbbTranslate\"\n            [icon]=\"column | columnIcon: mo\"\n            [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [isChecked]=\"isChecked\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [controlUi]=\"column.Caption | controlUi: layout94\"\n            (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n            (keyup.esc)=\"onEditFormPanelCancel($event)\"\n            (keydown.Tab)=\"onTabKeyDown($event, index)\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n    }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n    @if (!noContent) {\n    <fd-quick-view [id]=\"'id'\">\n        <fd-quick-view-group>\n            @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n            <fd-quick-view-subheader>\n                @if (setting.AvatarField || setting.Avatar) {\n                <fd-avatar\n                    alterIcon=\"alt|content|backup|default-icon\"\n                    [circle]=\"setting.CircleAvatar\"\n                    [image]=\"\n                        setting.AvatarField\n                            ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n                            : ''\n                    \"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [glyph]=\"\n                        setting.Avatar ||\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n                } @if (setting.TitleField) {\n                <fd-quick-view-subheader-title>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.TitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </fd-quick-view-subheader-title>\n                } @if (setting.SubtitleField) {\n                <fd-quick-view-subheader-subtitle>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </fd-quick-view-subheader-subtitle>\n                }\n            </fd-quick-view-subheader>\n            } @for (column of setting.FieldListMapped; track column) {\n            <fd-quick-view-group-item>\n                @if (column) {\n                <fd-quick-view-group-item-label>\n                    {{ column.Caption | bbbTranslate }}\n                </fd-quick-view-group-item-label>\n                <fd-quick-view-group-item-content>\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: column,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </fd-quick-view-group-item-content>\n                }\n            </fd-quick-view-group-item>\n            } @if (setting.DescriptionField) {\n            <fd-quick-view-group-item>\n                <fd-quick-view-group-item-content>\n                    @if (inlineEditMode && allowInlineEdit) {\n                    <fd-quick-view-group-item-label>\n                        {{ setting.DescriptionField?.Alias | bbbTranslate }}\n                    </fd-quick-view-group-item-label>\n                    }\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: setting.DescriptionField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </fd-quick-view-group-item-content>\n                @if (setting.ActionFieldNameField) {\n                <fd-quick-view-group-item-content\n                    class=\"action\"\n                    (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n                >\n                    <a fd-link>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: setting.ActionFieldNameField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </a>\n                </fd-quick-view-group-item-content>\n                }\n            </fd-quick-view-group-item>\n            }\n        </fd-quick-view-group>\n    </fd-quick-view>\n    }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n    <fd-layout-grid>\n        <div fdLayoutGridRow style=\"align-items: center\">\n            <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        avatar;\n                        context: {\n                            $implicit: setting.Avatar,\n                            visible: setting.AvatarField || setting.Avatar,\n                            circle: setting.CircleAvatar,\n                            avatarField: setting.AvatarField\n                        }\n                    \"\n                ></ng-container>\n            </div>\n\n            <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n                @if (setting.TitleField) {\n                <span style=\"font-weight: bold\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.TitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </span>\n                } @if (setting.SubtitleField) {\n                <span>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </span>\n                }\n            </div>\n\n            <div [fdLayoutGridCol]=\"12\">\n                @for (column of setting.FieldListMapped; track column) {\n                <div style=\"display: flex\">\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: column,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                }\n            </div>\n            @if (setting.DescriptionField) {\n            <div [fdLayoutGridCol]=\"12\">\n                @if (inlineEditMode && allowInlineEdit) {\n                <label>\n                    {{ setting.DescriptionField?.Alias | bbbTranslate }}\n                </label>\n                }\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        columnTemplate;\n                        context: {\n                            $implicit: setting.DescriptionField,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: index\n                        }\n                    \"\n                ></ng-container>\n            </div>\n            }\n        </div>\n    </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n    @if (visible) {\n    <fd-avatar\n        alterIcon=\"alt|content|backup|default-icon\"\n        [circle]=\"circle\"\n        [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n        [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n        [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n    >\n    </fd-avatar>\n    }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.ContentComponent\"\n        [mo]=\"mo\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [isChecked]=\"isChecked\"\n        [setting]=\"setting\"\n        [parameters]=\"setting.ContentComponent.Settings\"\n        [editMode]=\"inlineEditMode\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [index]=\"index\"\n        [allColumns]=\"allColumns\"\n    ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n    @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n    !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n    <fd-card-header>\n        <div\n            fd-card-title\n            [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n        >\n            <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n                @if (isCheckList) {\n                <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n                } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n                <div\n                    ulvContextMenu\n                    [allColumns]=\"allColumns\"\n                    [menuItems]=\"contextMenuItems\"\n                    [styleIndex]=\"styleIndex\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></div>\n                }\n            </div>\n            @if (canView) {\n            <button\n                fd-button\n                class=\"view-btn\"\n                (click)=\"onRowClick()\"\n                [glyph]=\"navigationArrow\"\n                fdType=\"transparent\"\n            ></button>\n            }\n        </div>\n    </fd-card-header>\n    }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.HeaderComponent\"\n        [mo]=\"mo\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [isChecked]=\"isChecked\"\n        [setting]=\"setting\"\n        [parameters]=\"setting.HeaderComponent.Settings\"\n        [editMode]=\"inlineEditMode\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [index]=\"index\"\n        [allColumns]=\"allColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [canView]=\"canView\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [navigationArrow]=\"navigationArrow\"\n        [isCheckList]=\"isCheckList\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i11.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i11.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i11.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i11.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i11.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i11.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i11.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i11.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i11.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }, { kind: "pipe", type: AvatarGridColPipe, name: "avatarGridCol" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\n    [cardType]=\"setting.CardType$Caption\"\n    class=\"docs-flex-item-margin\"\n    [class.openOnClick]=\"setting.openOnClick\"\n    [style.width]=\"cardWidth\"\n    [style.min-width]=\"minWidth\"\n    [style.max-width]=\"maxWidth\"\n>\n    <ng-container\n        *ngTemplateOutlet=\"\n            setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n            context: {\n                $implicit: mo,\n                index: this.index\n            }\n        \"\n    ></ng-container>\n\n    @if (!noContent || contextMenuItems) {\n    <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n                    context: {\n                        $implicit: mo,\n                        index: this.index\n                    }\n                \"\n            ></ng-container>\n        </div>\n        @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n        <div\n            ulvContextMenu\n            [allColumns]=\"allColumns\"\n            [footerMode]=\"true\"\n            [menuItems]=\"contextMenuItems\"\n            [styleIndex]=\"styleIndex\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [mo]=\"mo\"\n            (commandClick)=\"onUlvCommand()\"\n        ></div>\n        }\n    </fd-card-content>\n    }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n    >@if (column) {\n    <div\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\n            [value]=\"column | columnValue: mo | bbbTranslate\"\n            [icon]=\"column | columnIcon: mo\"\n            [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [isChecked]=\"isChecked\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [controlUi]=\"column.Caption | controlUi: layout94\"\n            (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n            (keyup.esc)=\"onEditFormPanelCancel($event)\"\n            (keydown.Tab)=\"onTabKeyDown($event, index)\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n    }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n    @if (!noContent) {\n    <fd-quick-view [id]=\"'id'\">\n        <fd-quick-view-group>\n            @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n            <fd-quick-view-subheader>\n                @if (setting.AvatarField || setting.Avatar) {\n                <fd-avatar\n                    alterIcon=\"alt|content|backup|default-icon\"\n                    [circle]=\"setting.CircleAvatar\"\n                    [image]=\"\n                        setting.AvatarField\n                            ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n                            : ''\n                    \"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [glyph]=\"\n                        setting.Avatar ||\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n                } @if (setting.TitleField) {\n                <fd-quick-view-subheader-title>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.TitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </fd-quick-view-subheader-title>\n                } @if (setting.SubtitleField) {\n                <fd-quick-view-subheader-subtitle>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </fd-quick-view-subheader-subtitle>\n                }\n            </fd-quick-view-subheader>\n            } @for (column of setting.FieldListMapped; track column) {\n            <fd-quick-view-group-item>\n                @if (column) {\n                <fd-quick-view-group-item-label>\n                    {{ column.Caption | bbbTranslate }}\n                </fd-quick-view-group-item-label>\n                <fd-quick-view-group-item-content>\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: column,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </fd-quick-view-group-item-content>\n                }\n            </fd-quick-view-group-item>\n            } @if (setting.DescriptionField) {\n            <fd-quick-view-group-item>\n                <fd-quick-view-group-item-content>\n                    @if (inlineEditMode && allowInlineEdit) {\n                    <fd-quick-view-group-item-label>\n                        {{ setting.DescriptionField?.Alias | bbbTranslate }}\n                    </fd-quick-view-group-item-label>\n                    }\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: setting.DescriptionField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </fd-quick-view-group-item-content>\n                @if (setting.ActionFieldNameField) {\n                <fd-quick-view-group-item-content\n                    class=\"action\"\n                    (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n                >\n                    <a fd-link>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                columnTemplate;\n                                context: {\n                                    $implicit: setting.ActionFieldNameField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    index: index\n                                }\n                            \"\n                        ></ng-container>\n                    </a>\n                </fd-quick-view-group-item-content>\n                }\n            </fd-quick-view-group-item>\n            }\n        </fd-quick-view-group>\n    </fd-quick-view>\n    }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n    <fd-layout-grid>\n        <div fdLayoutGridRow style=\"align-items: center\">\n            <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        avatar;\n                        context: {\n                            $implicit: setting.Avatar,\n                            visible: setting.AvatarField || setting.Avatar,\n                            circle: setting.CircleAvatar,\n                            avatarField: setting.AvatarField\n                        }\n                    \"\n                ></ng-container>\n            </div>\n\n            <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n                @if (setting.TitleField) {\n                <span style=\"font-weight: bold\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.TitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </span>\n                } @if (setting.SubtitleField) {\n                <span>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </span>\n                }\n            </div>\n\n            <div [fdLayoutGridCol]=\"12\">\n                @for (column of setting.FieldListMapped; track column) {\n                <div style=\"display: flex\">\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            columnTemplate;\n                            context: {\n                                $implicit: column,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                index: index\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                }\n            </div>\n            @if (setting.DescriptionField) {\n            <div [fdLayoutGridCol]=\"12\">\n                @if (inlineEditMode && allowInlineEdit) {\n                <label>\n                    {{ setting.DescriptionField?.Alias | bbbTranslate }}\n                </label>\n                }\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        columnTemplate;\n                        context: {\n                            $implicit: setting.DescriptionField,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: index\n                        }\n                    \"\n                ></ng-container>\n            </div>\n            }\n        </div>\n    </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n    @if (visible) {\n    <fd-avatar\n        alterIcon=\"alt|content|backup|default-icon\"\n        [circle]=\"circle\"\n        [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n        [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n        [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n    >\n    </fd-avatar>\n    }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.ContentComponent\"\n        [mo]=\"mo\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [isChecked]=\"isChecked\"\n        [setting]=\"setting\"\n        [parameters]=\"setting.ContentComponent.Settings\"\n        [editMode]=\"inlineEditMode\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [index]=\"index\"\n        [allColumns]=\"allColumns\"\n    ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n    @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n    !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n    <fd-card-header>\n        <div\n            fd-card-title\n            [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n        >\n            <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n                @if (isCheckList) {\n                <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n                } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n                <div\n                    ulvContextMenu\n                    [allColumns]=\"allColumns\"\n                    [menuItems]=\"contextMenuItems\"\n                    [styleIndex]=\"styleIndex\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></div>\n                }\n            </div>\n            @if (canView) {\n            <button\n                fd-button\n                class=\"view-btn\"\n                (click)=\"onRowClick()\"\n                [glyph]=\"navigationArrow\"\n                fdType=\"transparent\"\n            ></button>\n            }\n        </div>\n    </fd-card-header>\n    }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.HeaderComponent\"\n        [mo]=\"mo\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [isChecked]=\"isChecked\"\n        [setting]=\"setting\"\n        [parameters]=\"setting.HeaderComponent.Settings\"\n        [editMode]=\"inlineEditMode\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [index]=\"index\"\n        [allColumns]=\"allColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [canView]=\"canView\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [navigationArrow]=\"navigationArrow\"\n        [isCheckList]=\"isCheckList\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i11.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i11.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i11.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i11.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i11.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i11.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i11.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i11.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i11.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }, { kind: "pipe", type: AvatarGridColPipe, name: "avatarGridCol" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CardItemComponent, decorators: [{
             type: Component,
@@ -5131,7 +5131,7 @@ class UiCardViewComponent extends ReportViewBaseComponent {
         command();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewComponent, selector: "bsu-ui-card-view", usesInheritance: true, ngImport: i0, template: "<fd-layout-panel>\n    <fd-layout-panel-body [bleed]=\"true\">\n        @if (isCheckList) {\n        <table fd-table>\n            <thead fd-table-header>\n                <tr fd-table-row>\n                    <th fd-table-cell>\n                        <fd-checkbox\n                            name=\"allCheckbox\"\n                            [ngModel]=\"allChecked\"\n                            (ngModelChange)=\"onAllCheckbox($event)\"\n                            >{{ 'All' | bbbTranslate }}</fd-checkbox\n                        >\n                    </th>\n                </tr>\n            </thead>\n        </table>\n        }\n    </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n    [moDataList]=\"moDataList\"\n    [groupby]=\"groupby\"\n    [setting]=\"cardSetting\"\n    [openOnClick]=\"openOnClick\"\n    [inlineEditMode]=\"inlineEditMode\"\n    [allowInlineEdit]=\"allowInlineEdit\"\n    [rtl]=\"rtl\"\n    [deviceName]=\"deviceName\"\n    [deviceSize]=\"deviceSize\"\n    [allColumns]=\"allColumns\"\n    [contextMenuItems]=\"contextMenuItems\"\n    [canView]=\"canView\"\n    [formSetting]=\"formSetting\"\n    [conditionalFormats]=\"conditionalFormats\"\n    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n    [navigationArrow]=\"navigationArrow\"\n    [isCheckList]=\"isCheckList\"\n    (rowCheck)=\"onRowCheck($event)\"\n    (rowClick)=\"onRowClick($event)\"\n    (ulvCommand)=\"onUlvCommand($event)\"\n    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n    (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: ["fd-layout-panel{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewComponent, selector: "bsu-ui-card-view", usesInheritance: true, ngImport: i0, template: "<fd-layout-panel>\n    <fd-layout-panel-body [bleed]=\"true\">\n        @if (isCheckList) {\n        <table fd-table>\n            <thead fd-table-header>\n                <tr fd-table-row>\n                    <th fd-table-cell>\n                        <fd-checkbox\n                            name=\"allCheckbox\"\n                            [ngModel]=\"allChecked\"\n                            (ngModelChange)=\"onAllCheckbox($event)\"\n                            >{{ 'All' | bbbTranslate }}</fd-checkbox\n                        >\n                    </th>\n                </tr>\n            </thead>\n        </table>\n        }\n    </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n    [moDataList]=\"moDataList\"\n    [groupby]=\"groupby\"\n    [setting]=\"cardSetting\"\n    [openOnClick]=\"openOnClick\"\n    [inlineEditMode]=\"inlineEditMode\"\n    [allowInlineEdit]=\"allowInlineEdit\"\n    [rtl]=\"rtl\"\n    [deviceName]=\"deviceName\"\n    [deviceSize]=\"deviceSize\"\n    [allColumns]=\"allColumns\"\n    [contextMenuItems]=\"contextMenuItems\"\n    [canView]=\"canView\"\n    [formSetting]=\"formSetting\"\n    [conditionalFormats]=\"conditionalFormats\"\n    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n    [navigationArrow]=\"navigationArrow\"\n    [isCheckList]=\"isCheckList\"\n    (rowCheck)=\"onRowCheck($event)\"\n    (rowClick)=\"onRowClick($event)\"\n    (ulvCommand)=\"onUlvCommand($event)\"\n    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n    (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: ["fd-layout-panel{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewComponent, decorators: [{
             type: Component,
@@ -5147,7 +5147,7 @@ class ListItemComponent extends BaseViewItemPropsComponent {
         PreventDefaulEvent(e);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ListItemComponent, selector: "bsu-list-item", inputs: { setting: "setting", isDisplayType: "isDisplayType" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n    <li\n        fd-list-item\n        class=\"standard-list-row\"\n        [ngClass]=\"deviceSize\"\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n        [class.selected]=\"isChecked === true\"\n        [selected]=\"isChecked === true\"\n        (dblclick)=\"onRowClick()\"\n        (click)=\"onRowCheck()\"\n    >\n        <a\n            fd-list-link\n            [attr.rtl]=\"rtl\"\n            class=\"li-link\"\n            [class.checklist]=\"isCheckList\"\n            #aEl\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [hostEl]=\"aEl\"\n        >\n            @if (isCheckList) {\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (change)=\"onRowCheck2($event)\"></fd-checkbox>\n            } @if (setting.IconFont || setting.AvatarField) {\n            <span fd-list-thumbnail>\n                <fd-avatar\n                    alterIcon=\"alt|content|backup|default-icon\"\n                    [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n                    [circle]=\"true\"\n                    [image]=\"\n                        setting.AvatarField\n                            ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n                            : ''\n                    \"\n                    [size]=\"avatarSize\"\n                    [transparent]=\"true\"\n                    [glyph]=\"\n                        setting.IconFont ??\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n            </span>\n            }\n            <div fd-list-content>\n                <div fd-list-byline [twoCol]=\"true\">\n                    <div fd-list-title>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                renderColumn;\n                                context: {\n                                    $implicit: setting.TitleField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    conditionalFormats: conditionalFormats,\n                                    index: 0\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                    <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                renderColumn;\n                                context: {\n                                    $implicit: setting.StatusField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    conditionalFormats: conditionalFormats\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </div>\n                <div fd-list-byline>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderColumn;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                conditionalFormats: conditionalFormats\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n            </div>\n            @if (contextMenuItems.length) {\n            <bsu-ulv-context-menu\n                [menuItems]=\"contextMenuItems\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [mo]=\"mo\"\n                (commandClick)=\"onUlvCommand()\"\n            ></bsu-ulv-context-menu>\n            } @if (canView && !hideOpenIcon) {\n            <button (click)=\"onRowClick()\" fdType=\"transparent\" [glyph]=\"navigationArrow\" fd-button></button>\n            }\n        </a>\n    </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n    @if (!mo.parent || mo.parent?.expanded) {\n    <li\n        class=\"display\"\n        [ngClass]=\"deviceSize\"\n        fd-list-item\n        [interactive]=\"false\"\n        (dblclick)=\"onRowClick()\"\n        (click)=\"onRowCheck()\"\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n    >\n        <a\n            fd-list-link\n            [attr.rtl]=\"rtl\"\n            class=\"li-link\"\n            style=\"cursor: default\"\n            [class.checklist]=\"isCheckList\"\n            #aEl\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [hostEl]=\"aEl\"\n            style=\"column-gap: 3px\"\n        >\n            @if (setting.AvatarField) {\n            <img\n                [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n                style=\"width: 24px; height: 24px\"\n            />\n            } @if (setting.IconFont) {\n            <i fd-list-icon [glyph]=\"setting.IconFont\" [style.color]=\"setting.IconColor ? setting.IconColor : null\">\n            </i>\n            } @if (!setting.IconFont && mo.$State === 'New' && !isChecked) {\n            <i fd-list-icon glyph=\"favorite\"></i>\n            } @if (!setting.IconFont && inlineEditMode && isChecked) {\n            <i fd-list-icon glyph=\"edit\"></i>\n            } @if (isCheckList) {\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (change)=\"onRowCheck2($event)\"></fd-checkbox>\n            }\n            <span fd-list-title>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        renderColumn;\n                        context: {\n                            $implicit: setting.TitleField,\n                            conditionalFormats: conditionalFormats,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: 0\n                        }\n                    \"\n                ></ng-container>\n            </span>\n            <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\" [class.flex1]=\"contextMenuItems.length === 0\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        renderColumn;\n                        context: {\n                            $implicit: setting.SubtitleField,\n                            conditionalFormats: conditionalFormats,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: index\n                        }\n                    \"\n                ></ng-container>\n                @if (canView && !hideOpenIcon) {\n                <button fd-button (click)=\"onRowClick()\" [glyph]=\"navigationArrow\" fdType=\"transparent\"></button>\n                } @if (contextMenuItems.length) {\n                <bsu-ulv-context-menu\n                    [menuItems]=\"contextMenuItems\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [styleIndex]=\"styleIndex\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></bsu-ulv-context-menu>\n                }\n            </span>\n        </a>\n    </li>\n    }\n</ng-template>\n<ng-template\n    #renderColumn\n    let-column\n    let-mo=\"mo\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-index=\"index\"\n    let-layout94=\"layout94\"\n>\n    @if (column) {\n    <div\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\n            [disableEllapsis]=\"true\"\n            [value]=\"column | columnValue: mo | bbbTranslate\"\n            [icon]=\"column | columnIcon: mo\"\n            [editMode]=\"inlineEditMode && allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [controlUi]=\"column.Caption | controlUi: layout94\"\n            (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n            (keyup.esc)=\"onEditFormPanelCancel($event)\"\n            (keydown.Tab)=\"onTabKeyDown($event, index)\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n    }\n</ng-template>\n", styles: [":host li.s{height:auto}:host .flex1{flex:1;display:flex;justify-content:start;flex-direction:row-reverse}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { 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: "17.3.5", type: ListItemComponent, selector: "bsu-list-item", inputs: { setting: "setting", isDisplayType: "isDisplayType" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n    <li\n        fd-list-item\n        class=\"standard-list-row\"\n        [ngClass]=\"deviceSize\"\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n        [class.selected]=\"isChecked === true\"\n        [selected]=\"isChecked === true\"\n        (dblclick)=\"onRowClick()\"\n        (click)=\"onRowCheck()\"\n    >\n        <a\n            fd-list-link\n            [attr.rtl]=\"rtl\"\n            class=\"li-link\"\n            [class.checklist]=\"isCheckList\"\n            #aEl\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [hostEl]=\"aEl\"\n        >\n            @if (isCheckList) {\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (change)=\"onRowCheck2($event)\"></fd-checkbox>\n            } @if (setting.IconFont || setting.AvatarField) {\n            <span fd-list-thumbnail>\n                <fd-avatar\n                    alterIcon=\"alt|content|backup|default-icon\"\n                    [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n                    [circle]=\"true\"\n                    [image]=\"\n                        setting.AvatarField\n                            ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n                            : ''\n                    \"\n                    [size]=\"avatarSize\"\n                    [transparent]=\"true\"\n                    [glyph]=\"\n                        setting.IconFont ??\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n            </span>\n            }\n            <div fd-list-content>\n                <div fd-list-byline [twoCol]=\"true\">\n                    <div fd-list-title>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                renderColumn;\n                                context: {\n                                    $implicit: setting.TitleField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    conditionalFormats: conditionalFormats,\n                                    index: 0\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                    <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                renderColumn;\n                                context: {\n                                    $implicit: setting.StatusField,\n                                    layout94: layout$ | async,\n                                    mo: mo,\n                                    conditionalFormats: conditionalFormats\n                                }\n                            \"\n                        ></ng-container>\n                    </div>\n                </div>\n                <div fd-list-byline>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderColumn;\n                            context: {\n                                $implicit: setting.SubtitleField,\n                                layout94: layout$ | async,\n                                mo: mo,\n                                conditionalFormats: conditionalFormats\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n            </div>\n            @if (contextMenuItems.length) {\n            <bsu-ulv-context-menu\n                [menuItems]=\"contextMenuItems\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [mo]=\"mo\"\n                (commandClick)=\"onUlvCommand()\"\n            ></bsu-ulv-context-menu>\n            } @if (canView && !hideOpenIcon) {\n            <button (click)=\"onRowClick()\" fdType=\"transparent\" [glyph]=\"navigationArrow\" fd-button></button>\n            }\n        </a>\n    </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n    @if (!mo.parent || mo.parent?.expanded) {\n    <li\n        class=\"display\"\n        [ngClass]=\"deviceSize\"\n        fd-list-item\n        [interactive]=\"false\"\n        (dblclick)=\"onRowClick()\"\n        (click)=\"onRowCheck()\"\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n    >\n        <a\n            fd-list-link\n            [attr.rtl]=\"rtl\"\n            class=\"li-link\"\n            style=\"cursor: default\"\n            [class.checklist]=\"isCheckList\"\n            #aEl\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [hostEl]=\"aEl\"\n            style=\"column-gap: 3px\"\n        >\n            @if (setting.AvatarField) {\n            <img\n                [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n                style=\"width: 24px; height: 24px\"\n            />\n            } @if (setting.IconFont) {\n            <i fd-list-icon [glyph]=\"setting.IconFont\" [style.color]=\"setting.IconColor ? setting.IconColor : null\">\n            </i>\n            } @if (!setting.IconFont && mo.$State === 'New' && !isChecked) {\n            <i fd-list-icon glyph=\"favorite\"></i>\n            } @if (!setting.IconFont && inlineEditMode && isChecked) {\n            <i fd-list-icon glyph=\"edit\"></i>\n            } @if (isCheckList) {\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (change)=\"onRowCheck2($event)\"></fd-checkbox>\n            }\n            <span fd-list-title>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        renderColumn;\n                        context: {\n                            $implicit: setting.TitleField,\n                            conditionalFormats: conditionalFormats,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: 0\n                        }\n                    \"\n                ></ng-container>\n            </span>\n            <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\" [class.flex1]=\"contextMenuItems.length === 0\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        renderColumn;\n                        context: {\n                            $implicit: setting.SubtitleField,\n                            conditionalFormats: conditionalFormats,\n                            layout94: layout$ | async,\n                            mo: mo,\n                            index: index\n                        }\n                    \"\n                ></ng-container>\n                @if (canView && !hideOpenIcon) {\n                <button fd-button (click)=\"onRowClick()\" [glyph]=\"navigationArrow\" fdType=\"transparent\"></button>\n                } @if (contextMenuItems.length) {\n                <bsu-ulv-context-menu\n                    [menuItems]=\"contextMenuItems\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [styleIndex]=\"styleIndex\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></bsu-ulv-context-menu>\n                }\n            </span>\n        </a>\n    </li>\n    }\n</ng-template>\n<ng-template\n    #renderColumn\n    let-column\n    let-mo=\"mo\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-index=\"index\"\n    let-layout94=\"layout94\"\n>\n    @if (column) {\n    <div\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [styleIndex]=\"styleIndex\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\n            [disableEllapsis]=\"true\"\n            [value]=\"column | columnValue: mo | bbbTranslate\"\n            [icon]=\"column | columnIcon: mo\"\n            [editMode]=\"inlineEditMode && allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [controlUi]=\"column.Caption | controlUi: layout94\"\n            (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n            (keyup.esc)=\"onEditFormPanelCancel($event)\"\n            (keydown.Tab)=\"onTabKeyDown($event, index)\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n    }\n</ng-template>\n", styles: [":host li.s{height:auto}:host .flex1{flex:1;display:flex;justify-content:start;flex-direction:row-reverse}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.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", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { 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: "17.3.5", ngImport: i0, type: ListItemComponent, decorators: [{
             type: Component,
@@ -5202,7 +5202,7 @@ class UiListViewComponent extends ReportViewBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiListViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiListViewComponent, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupModeTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupModeTemplate>\n    <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n    <!-- <fd-menu [appendTo]=\"_el\"\n  #menu [mobile]=\"deviceSize === 's'\" >\n</fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n    <div class=\"popup-mode\">\n        <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n    </div>\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n    <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n        <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n    </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n    <fd-popover #popover fillControlMode=\"equal\">\n        <fd-popover-control class=\"popup-mode\">\n            <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ng-container\n                *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n            ></ng-container>\n        </fd-popover-body>\n    </fd-popover>\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n    <button\n        class=\"drop-down\"\n        fd-button\n        [label]=\"selectedMo ? (selectedMo.$Caption | bbbTranslate) : (title | bbbTranslate)\"\n        [fdMenu]=\"true\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        @if (selectedCount > 0 && isCheckList) {\n        <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\n        }\n    </button>\n</ng-template>\n<ng-template #tokensTpl>\n    @if (isCheckList && hasSelected) {\n    <div style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n        @for (mo of moDataList; track mo; let index = $index) { @if (mo.$IsChecked) {\n        <fd-token fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n            columns[0].Caption | rval: mo:columns:true\n        }}</fd-token>\n        } }\n    </div>\n    }\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n    <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n        <fd-layout-panel-header>\n            <fd-layout-panel-head>\n                <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n                @if (selectedCount > 0) {\n                <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\n                }\n            </fd-layout-panel-head>\n            <fd-layout-panel-actions>\n                @if (deviceSize !== 's') {\n                <button\n                    style=\"margin-top: 5px\"\n                    fd-button\n                    glyph=\"decline\"\n                    fdType=\"transparent\"\n                    (click)=\"popover.close()\"\n                ></button>\n                }\n            </fd-layout-panel-actions>\n        </fd-layout-panel-header>\n        @if (isCheckList && moDataList.length) {\n        <fd-layout-panel-filters>\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n                    'All' | bbbTranslate\n                }}</a>\n                <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n                <a\n                    (click)=\"onClearCheckbox()\"\n                    fd-toolbar-item\n                    class=\"clearCheckAll\"\n                    fd-link\n                    [aria-label]=\"'Clear' | bbbTranslate\"\n                    >{{ 'Clear' | bbbTranslate }}</a\n                >\n            </fd-toolbar>\n        </fd-layout-panel-filters>\n        }\n\n        <fd-layout-panel-body [bleed]=\"true\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    isDisplayType ? displayListTemplate : standardListTemplate;\n                    context: {\n                        $implicit: moDataList,\n                        isCheckList: isCheckList,\n                        groupby: groupby,\n                        conditionalFormats: conditionalFormats,\n                        deviceName: deviceName,\n                        viewSetting: viewSetting,\n                        allColumns: allColumns,\n                        access: access,\n                        rtl: rtl,\n                        popover: popover\n                    }\n                \"\n            >\n            </ng-container>\n        </fd-layout-panel-body>\n    </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n    #displayListTemplate\n    let-moDataList\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-allColumns=\"allColumns\"\n    let-viewSetting=\"viewSetting\"\n    let-access=\"access\"\n    let-rtl=\"rtl\"\n>\n    @if (moDataList && moDataList.length > 0) {\n    <ul fd-list class=\"display-list fd-list--navigation\" ellipsify>\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index; let last = $last) { @if\n        (!mo.parent || mo.parent?.expanded) {\n        <ng-container\n            *ngTemplateOutlet=\"\n                itemTemplate;\n                context: {\n                    $implicit: mo,\n                    index: index,\n                    last: last,\n                    columns: columns,\n                    moDataList: moDataList,\n                    moDataListCount: moDataList.length\n                }\n            \"\n        ></ng-container>\n        } }\n    </ul>\n    } @else {\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\n    }\n</ng-template>\n<!--standard list-->\n<ng-template\n    #standardListTemplate\n    let-moDataList\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-allColumns=\"allColumns\"\n    let-deviceName=\"deviceName\"\n    let-access=\"access\"\n    let-viewSetting=\"viewSetting\"\n    let-rtl=\"rtl\"\n    let-last=\"last\"\n>\n    @if (moDataList && moDataList.length > 0) {\n    <ul class=\"fd-list--navigation\" [class.fd-list--byline]=\"!isDisplayType\" fd-list [byline]=\"true\" ellipsify>\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index) { @if (!mo.parent ||\n        mo.parent?.expanded) {\n        <ng-container\n            *ngTemplateOutlet=\"\n                itemTemplate;\n                context: {\n                    $implicit: mo,\n                    index: index,\n                    last: last,\n                    columns: columns,\n                    moDataList: moDataList,\n                    moDataListCount: moDataList.length\n                }\n            \"\n        ></ng-container>\n        } }\n    </ul>\n    } @else {\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\n    }\n</ng-template>\n\n<!--noData-->\n<ng-template\n    #itemTemplate\n    let-mo\n    let-index=\"index\"\n    let-last=\"last\"\n    let-columns=\"columns\"\n    let-moDataListCount=\"moDataListCount\"\n    let-moDataList=\"moDataList\"\n>\n    @if (mo.group || mo.group === '') {\n    <li\n        fd-list-group-header\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n        [attr.level]=\"mo.level\"\n        [class.root-group]=\"mo.level === 0\"\n    >\n        <fd-icon\n            [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n            class=\"cell-expand\"\n            (click)=\"onExpandClick(mo)\"\n        ></fd-icon>\n        <span fd-list-title>{{ mo.group }}</span>\n    </li>\n    } @else {\n    <ng-container\n        *ngTemplateOutlet=\"\n            hasRowOlgo ? dynamicItemTemplate : defaultItem;\n            context: {\n                $implicit: mo,\n                index: index,\n                columns: columns,\n                moDataList: moDataList,\n                moDataListCount: moDataList.length\n            }\n        \"\n    ></ng-container>\n    <ng-template\n        #defaultItem\n        let-mo\n        let-index=\"index\"\n        let-columns=\"columns\"\n        let-moDataListCount=\"moDataListCount\"\n        let-moDataList=\"moDataList\"\n    >\n        @if (!hasRowOlgo) {\n        <bsu-list-item\n            [isDisplayType]=\"isDisplayType\"\n            [mo]=\"mo\"\n            [isChecked]=\"mo.$IsChecked\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"listSetting\"\n            [editMode]=\"inlineEditMode\"\n            [rtl]=\"rtl\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [formSetting]=\"formSetting\"\n            [allColumns]=\"allColumns\"\n            [contentDensity]=\"contentDensity\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            (rowCheck)=\"onRowCheck($event)\"\n            (rowClick)=\"onRowClick($event)\"\n            (ulvCommand)=\"onUlvCommand($event)\"\n            (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n            (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        >\n        </bsu-list-item>\n        } @else {\n        <bnrc-dynamic-item-component\n            [component]=\"viewSetting.RowOlgo\"\n            [mo]=\"mo\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [moDataList]=\"moDataList\"\n            [showDetailsInRow]=\"showDetailsInRow\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [detailsColumns]=\"detailsColumns\"\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n            [cartableMo]=\"mo.RelatedMo\"\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n            [detailsComponent]=\"detailsComponent\"\n            [isChecked]=\"mo.$IsChecked\"\n            [visibility]=\"mo.$Visibility\"\n            [expanded]=\"mo.$Expanded\"\n            [level]=\"mo.$Level\"\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\n            [moDataListCount]=\"moDataListCount\"\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\n            [typeDefId]=\"typeDefId\"\n            [extraRelation]=\"extraRelation\"\n            [formSetting]=\"formSetting\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"viewSetting\"\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [access]=\"access\"\n            [inlineEditMode]=\"inlineEditMode\"\n            [allowInlineEdit]=\"allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [allColumns]=\"allColumns\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n            (events)=\"onOlgoEvents($event)\"\n        >\n        </bnrc-dynamic-item-component>\n        }\n    </ng-template>\n    <ng-template\n        #dynamicItemTemplate\n        let-mo\n        let-index=\"index\"\n        let-columns=\"columns\"\n        let-moDataListCount=\"moDataListCount\"\n        let-moDataList=\"moDataList\"\n    >\n        <bnrc-dynamic-item-component\n            [component]=\"viewSetting.RowOlgo\"\n            [mo]=\"mo\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [moDataList]=\"moDataList\"\n            [showDetailsInRow]=\"showDetailsInRow\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [detailsColumns]=\"detailsColumns\"\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n            [cartableMo]=\"mo.RelatedMo\"\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n            [detailsComponent]=\"detailsComponent\"\n            [isChecked]=\"mo.$IsChecked\"\n            [visibility]=\"mo.$Visibility\"\n            [expanded]=\"mo.$Expanded\"\n            [level]=\"mo.$Level\"\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\n            [moDataListCount]=\"moDataListCount\"\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\n            [typeDefId]=\"typeDefId\"\n            [extraRelation]=\"extraRelation\"\n            [formSetting]=\"formSetting\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"viewSetting\"\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [access]=\"access\"\n            [inlineEditMode]=\"inlineEditMode\"\n            [allowInlineEdit]=\"allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [allColumns]=\"allColumns\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n            (events)=\"onOlgoEvents($event)\"\n        >\n        </bnrc-dynamic-item-component>\n    </ng-template>\n    }\n</ng-template>\n", styles: [":host{display:block}.fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7$3.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7$3.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7$3.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiListViewComponent, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupModeTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupModeTemplate>\n    <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n    <!-- <fd-menu [appendTo]=\"_el\"\n  #menu [mobile]=\"deviceSize === 's'\" >\n</fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n    <div class=\"popup-mode\">\n        <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n    </div>\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n    <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n        <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n    </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n    <fd-popover #popover fillControlMode=\"equal\">\n        <fd-popover-control class=\"popup-mode\">\n            <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ng-container\n                *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n            ></ng-container>\n        </fd-popover-body>\n    </fd-popover>\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n    <button\n        class=\"drop-down\"\n        fd-button\n        [label]=\"selectedMo ? (selectedMo.$Caption | bbbTranslate) : (title | bbbTranslate)\"\n        [fdMenu]=\"true\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        @if (selectedCount > 0 && isCheckList) {\n        <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\n        }\n    </button>\n</ng-template>\n<ng-template #tokensTpl>\n    @if (isCheckList && hasSelected) {\n    <div style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n        @for (mo of moDataList; track mo; let index = $index) { @if (mo.$IsChecked) {\n        <fd-token fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n            columns[0].Caption | rval: mo:columns:true\n        }}</fd-token>\n        } }\n    </div>\n    }\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n    <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n        <fd-layout-panel-header>\n            <fd-layout-panel-head>\n                <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n                @if (selectedCount > 0) {\n                <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\n                }\n            </fd-layout-panel-head>\n            <fd-layout-panel-actions>\n                @if (deviceSize !== 's') {\n                <button\n                    style=\"margin-top: 5px\"\n                    fd-button\n                    glyph=\"decline\"\n                    fdType=\"transparent\"\n                    (click)=\"popover.close()\"\n                ></button>\n                }\n            </fd-layout-panel-actions>\n        </fd-layout-panel-header>\n        @if (isCheckList && moDataList.length) {\n        <fd-layout-panel-filters>\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n                    'All' | bbbTranslate\n                }}</a>\n                <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n                <a\n                    (click)=\"onClearCheckbox()\"\n                    fd-toolbar-item\n                    class=\"clearCheckAll\"\n                    fd-link\n                    [aria-label]=\"'Clear' | bbbTranslate\"\n                    >{{ 'Clear' | bbbTranslate }}</a\n                >\n            </fd-toolbar>\n        </fd-layout-panel-filters>\n        }\n\n        <fd-layout-panel-body [bleed]=\"true\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    isDisplayType ? displayListTemplate : standardListTemplate;\n                    context: {\n                        $implicit: moDataList,\n                        isCheckList: isCheckList,\n                        groupby: groupby,\n                        conditionalFormats: conditionalFormats,\n                        deviceName: deviceName,\n                        viewSetting: viewSetting,\n                        allColumns: allColumns,\n                        access: access,\n                        rtl: rtl,\n                        popover: popover\n                    }\n                \"\n            >\n            </ng-container>\n        </fd-layout-panel-body>\n    </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n    #displayListTemplate\n    let-moDataList\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-allColumns=\"allColumns\"\n    let-viewSetting=\"viewSetting\"\n    let-access=\"access\"\n    let-rtl=\"rtl\"\n>\n    @if (moDataList && moDataList.length > 0) {\n    <ul fd-list class=\"display-list fd-list--navigation\" ellipsify>\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index; let last = $last) { @if\n        (!mo.parent || mo.parent?.expanded) {\n        <ng-container\n            *ngTemplateOutlet=\"\n                itemTemplate;\n                context: {\n                    $implicit: mo,\n                    index: index,\n                    last: last,\n                    columns: columns,\n                    moDataList: moDataList,\n                    moDataListCount: moDataList.length\n                }\n            \"\n        ></ng-container>\n        } }\n    </ul>\n    } @else {\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\n    }\n</ng-template>\n<!--standard list-->\n<ng-template\n    #standardListTemplate\n    let-moDataList\n    let-isCheckList=\"isCheckList\"\n    let-groupby=\"groupby\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-allColumns=\"allColumns\"\n    let-deviceName=\"deviceName\"\n    let-access=\"access\"\n    let-viewSetting=\"viewSetting\"\n    let-rtl=\"rtl\"\n    let-last=\"last\"\n>\n    @if (moDataList && moDataList.length > 0) {\n    <ul class=\"fd-list--navigation\" [class.fd-list--byline]=\"!isDisplayType\" fd-list [byline]=\"true\" ellipsify>\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index) { @if (!mo.parent ||\n        mo.parent?.expanded) {\n        <ng-container\n            *ngTemplateOutlet=\"\n                itemTemplate;\n                context: {\n                    $implicit: mo,\n                    index: index,\n                    last: last,\n                    columns: columns,\n                    moDataList: moDataList,\n                    moDataListCount: moDataList.length\n                }\n            \"\n        ></ng-container>\n        } }\n    </ul>\n    } @else {\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\n    }\n</ng-template>\n\n<!--noData-->\n<ng-template\n    #itemTemplate\n    let-mo\n    let-index=\"index\"\n    let-last=\"last\"\n    let-columns=\"columns\"\n    let-moDataListCount=\"moDataListCount\"\n    let-moDataList=\"moDataList\"\n>\n    @if (mo.group || mo.group === '') {\n    <li\n        fd-list-group-header\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n        [attr.level]=\"mo.level\"\n        [class.root-group]=\"mo.level === 0\"\n    >\n        <fd-icon\n            [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n            class=\"cell-expand\"\n            (click)=\"onExpandClick(mo)\"\n        ></fd-icon>\n        <span fd-list-title>{{ mo.group }}</span>\n    </li>\n    } @else {\n    <ng-container\n        *ngTemplateOutlet=\"\n            hasRowOlgo ? dynamicItemTemplate : defaultItem;\n            context: {\n                $implicit: mo,\n                index: index,\n                columns: columns,\n                moDataList: moDataList,\n                moDataListCount: moDataList.length\n            }\n        \"\n    ></ng-container>\n    <ng-template\n        #defaultItem\n        let-mo\n        let-index=\"index\"\n        let-columns=\"columns\"\n        let-moDataListCount=\"moDataListCount\"\n        let-moDataList=\"moDataList\"\n    >\n        @if (!hasRowOlgo) {\n        <bsu-list-item\n            [isDisplayType]=\"isDisplayType\"\n            [mo]=\"mo\"\n            [isChecked]=\"mo.$IsChecked\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"listSetting\"\n            [editMode]=\"inlineEditMode\"\n            [rtl]=\"rtl\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [formSetting]=\"formSetting\"\n            [allColumns]=\"allColumns\"\n            [contentDensity]=\"contentDensity\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            (rowCheck)=\"onRowCheck($event)\"\n            (rowClick)=\"onRowClick($event)\"\n            (ulvCommand)=\"onUlvCommand($event)\"\n            (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n            (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        >\n        </bsu-list-item>\n        } @else {\n        <bnrc-dynamic-item-component\n            [component]=\"viewSetting.RowOlgo\"\n            [mo]=\"mo\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [moDataList]=\"moDataList\"\n            [showDetailsInRow]=\"showDetailsInRow\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [detailsColumns]=\"detailsColumns\"\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n            [cartableMo]=\"mo.RelatedMo\"\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n            [detailsComponent]=\"detailsComponent\"\n            [isChecked]=\"mo.$IsChecked\"\n            [visibility]=\"mo.$Visibility\"\n            [expanded]=\"mo.$Expanded\"\n            [level]=\"mo.$Level\"\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\n            [moDataListCount]=\"moDataListCount\"\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\n            [typeDefId]=\"typeDefId\"\n            [extraRelation]=\"extraRelation\"\n            [formSetting]=\"formSetting\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"viewSetting\"\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [access]=\"access\"\n            [inlineEditMode]=\"inlineEditMode\"\n            [allowInlineEdit]=\"allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [allColumns]=\"allColumns\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n            (events)=\"onOlgoEvents($event)\"\n        >\n        </bnrc-dynamic-item-component>\n        }\n    </ng-template>\n    <ng-template\n        #dynamicItemTemplate\n        let-mo\n        let-index=\"index\"\n        let-columns=\"columns\"\n        let-moDataListCount=\"moDataListCount\"\n        let-moDataList=\"moDataList\"\n    >\n        <bnrc-dynamic-item-component\n            [component]=\"viewSetting.RowOlgo\"\n            [mo]=\"mo\"\n            [styleIndex]=\"mo.$StyleIndex\"\n            [moDataList]=\"moDataList\"\n            [showDetailsInRow]=\"showDetailsInRow\"\n            [hideOpenIcon]=\"hideOpenIcon\"\n            [detailsColumns]=\"detailsColumns\"\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n            [cartableMo]=\"mo.RelatedMo\"\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n            [detailsComponent]=\"detailsComponent\"\n            [isChecked]=\"mo.$IsChecked\"\n            [visibility]=\"mo.$Visibility\"\n            [expanded]=\"mo.$Expanded\"\n            [level]=\"mo.$Level\"\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\n            [moDataListCount]=\"moDataListCount\"\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\n            [typeDefId]=\"typeDefId\"\n            [extraRelation]=\"extraRelation\"\n            [formSetting]=\"formSetting\"\n            [index]=\"index\"\n            [last]=\"last\"\n            [setting]=\"viewSetting\"\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\n            [access]=\"access\"\n            [inlineEditMode]=\"inlineEditMode\"\n            [allowInlineEdit]=\"allowInlineEdit\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [allColumns]=\"allColumns\"\n            [contextMenuItems]=\"contextMenuItems\"\n            [canView]=\"canView\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [navigationArrow]=\"navigationArrow\"\n            [isCheckList]=\"isCheckList\"\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n            (events)=\"onOlgoEvents($event)\"\n        >\n        </bnrc-dynamic-item-component>\n    </ng-template>\n    }\n</ng-template>\n", styles: [":host{display:block}.fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7$3.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7$3.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7$3.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiListViewComponent, decorators: [{
             type: Component,
@@ -5336,7 +5336,7 @@ class BarsaTableHeaderComponent extends BaseComponent {
         return `${column.Name}${index}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTableHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", showRowNumber: "showRowNumber", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", fitToContent: "fitToContent", fitToContainer: "fitToContainer", fitToColumn: "fitToColumn", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings" }, viewQueries: [{ propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        @if (!hideHeader) { @if (rowIndicator) {\n        <th fd-table-cell fd-table-status-indicator></th>\n        } @if (showRowNumber) {\n        <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n        } @if (isCheckList) {\n        <th fd-table-cell>\n            <fd-checkbox\n                name=\"allCheckbox\"\n                [ngModel]=\"allChecked\"\n                (ngModelChange)=\"onAllCheckbox($event)\"\n            ></fd-checkbox>\n        </th>\n        } @if (!isCheckList && !showRowNumber) {\n        <th fd-table-cell class=\"single-select\"></th>\n        } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) { @if (startIndex\n        <= i) {\n        <th\n            #thRef\n            [columnIndex]=\"i\"\n            fd-table-cell\n            [style.width]=\"\n                inlineEditMode\n                    ? column.FieldTypeId === 5\n                        ? column.$Width2\n                        : last\n                        ? '100%'\n                        : '210px'\n                    : last && column.$Width !== '100%'\n                    ? null\n                    : column.FieldTypeId === 38 ||\n                      column.FieldTypeId === 42 ||\n                      ((column.FieldTypeId === 6 || column.FieldTypeId === 5) &&\n                          column.Extra?.IconDisplayTypeEnum === 'Image')\n                    ? '40px'\n                    : column.$Width2 || column.$Width\n            \"\n            [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n            resizable\n            [rtl]=\"rtl\"\n            [disableResize]=\"\n                disableResize ||\n                last ||\n                column.Extra?.IconDisplayTypeEnum === 'Image' ||\n                column.FieldTypeId === 38 ||\n                column.FieldTypeId === 42 ||\n                ((column.FieldTypeId === 6 || column.FieldTypeId === 5) &&\n                    column.Extra?.IconDisplayTypeEnum === 'Image')\n            \"\n            (widthChange)=\"onColumnWidthChange(column)\"\n            (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n            [disableResponsive]=\"disableResponsive\"\n            [tableWidth]=\"tableWidth\"\n            [columnsWidth]=\"columnsWidth\"\n            [attr.columnName]=\"column.Name\"\n            [attr.index]=\"i\"\n            [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n            [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n        >\n            @if(!disableHeaderContextMenu){\n            <fd-popover #menu>\n                <fd-popover-control>\n                    <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n                </fd-popover-control>\n                <fd-popover-body>\n                    <ul fd-list>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                >\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n                                <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                >\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToContent.emit(column)\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToColumn.emit()\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n                                <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n                            </a>\n                        </li>\n                        <!-- <li fd-list-item>\n                          <a fd-list-link (click)=\"onFilter(column, menu)\">\n                            <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                            <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                          </a>\n                        </li> -->\n                    </ul>\n                </fd-popover-body>\n            </fd-popover>\n            } @else{\n            <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n            }\n        </th>\n        } } @if (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode) {\n        <th\n            class=\"col-header col-context-menu\"\n            fd-table-cell\n            [fitContent]=\"disableOverflowContextMenu\"\n            [style.width.px]=\"contextMenuWidth\"\n        ></th>\n        } @if (showDetailsInRow && !inlineEditMode) {\n        <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\" fd-table-cell></th>\n        } @if (showViewButton) {\n        <th class=\"col-header col-view\" [style.width.px]=\"26.5 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\n        } }\n    </tr>\n</thead>\n<ng-template #headerValue let-column>\n    <div style=\"display: flex\">\n        <!-- FieldTypeId 38 means it is auto row number field-->\n        @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\n        <img [src]=\"column.Icon\" />\n        } @else {\n        {{ column.Caption | bbbTranslate }}\n        }\n    </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "directive", type: i3$1.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", showRowNumber: "showRowNumber", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", fitToContent: "fitToContent", fitToContainer: "fitToContainer", fitToColumn: "fitToColumn", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings" }, viewQueries: [{ propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        @if (!hideHeader) { @if (rowIndicator) {\n        <th fd-table-cell fd-table-status-indicator></th>\n        } @if (showRowNumber) {\n        <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n        } @if (isCheckList) {\n        <th fd-table-cell>\n            <fd-checkbox\n                name=\"allCheckbox\"\n                [ngModel]=\"allChecked\"\n                (ngModelChange)=\"onAllCheckbox($event)\"\n            ></fd-checkbox>\n        </th>\n        } @if (!isCheckList && !showRowNumber) {\n        <th fd-table-cell class=\"single-select\"></th>\n        } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) { @if (startIndex\n        <= i) {\n        <th\n            #thRef\n            [columnIndex]=\"i\"\n            fd-table-cell\n            [style.width]=\"\n                inlineEditMode\n                    ? column.FieldTypeId === 5\n                        ? column.$Width2\n                        : last\n                        ? '100%'\n                        : '210px'\n                    : last && column.$Width !== '100%'\n                    ? null\n                    : column.FieldTypeId === 38 ||\n                      column.FieldTypeId === 42 ||\n                      ((column.FieldTypeId === 6 || column.FieldTypeId === 5) &&\n                          column.Extra?.IconDisplayTypeEnum === 'Image')\n                    ? '40px'\n                    : column.$Width2 || column.$Width\n            \"\n            [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n            resizable\n            [rtl]=\"rtl\"\n            [disableResize]=\"\n                disableResize ||\n                last ||\n                column.Extra?.IconDisplayTypeEnum === 'Image' ||\n                column.FieldTypeId === 38 ||\n                column.FieldTypeId === 42 ||\n                ((column.FieldTypeId === 6 || column.FieldTypeId === 5) &&\n                    column.Extra?.IconDisplayTypeEnum === 'Image')\n            \"\n            (widthChange)=\"onColumnWidthChange(column)\"\n            (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n            [disableResponsive]=\"disableResponsive\"\n            [tableWidth]=\"tableWidth\"\n            [columnsWidth]=\"columnsWidth\"\n            [attr.columnName]=\"column.Name\"\n            [attr.index]=\"i\"\n            [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n            [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n        >\n            @if(!disableHeaderContextMenu){\n            <fd-popover #menu>\n                <fd-popover-control>\n                    <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n                </fd-popover-control>\n                <fd-popover-body>\n                    <ul fd-list>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                >\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n                                <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                >\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToContent.emit(column)\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"fitToColumn.emit()\" bodyClick>\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                            </a>\n                        </li>\n                        <li fd-list-item>\n                            <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n                                <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n                                <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n                            </a>\n                        </li>\n                        <!-- <li fd-list-item>\n                          <a fd-list-link (click)=\"onFilter(column, menu)\">\n                            <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                            <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                          </a>\n                        </li> -->\n                    </ul>\n                </fd-popover-body>\n            </fd-popover>\n            } @else{\n            <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n            }\n        </th>\n        } } @if (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode) {\n        <th\n            class=\"col-header col-context-menu\"\n            fd-table-cell\n            [fitContent]=\"disableOverflowContextMenu\"\n            [style.width.px]=\"contextMenuWidth\"\n        ></th>\n        } @if (showDetailsInRow && !inlineEditMode) {\n        <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\" fd-table-cell></th>\n        } @if (showViewButton) {\n        <th class=\"col-header col-view\" [style.width.px]=\"26.5 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\n        } }\n    </tr>\n</thead>\n<ng-template #headerValue let-column>\n    <div style=\"display: flex\">\n        <!-- FieldTypeId 38 means it is auto row number field-->\n        @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\n        <img [src]=\"column.Icon\" />\n        } @else {\n        {{ column.Caption | bbbTranslate }}\n        }\n    </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "directive", type: i3$1.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTableHeaderComponent, decorators: [{
             type: Component,
@@ -5493,7 +5493,7 @@ class BarsaTableRowComponent extends BaseViewItemPropsComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTableRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", detailsComponent: "detailsComponent", detailsColumns: "detailsColumns", detailsText: "detailsText", columnComponents: "columnComponents", actionList: "actionList" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n    [class.row-error]=\"hasError\"\n    [class.showdetails-on]=\"!detailsCollapsed\"\n    #trEl\n    fd-table-row\n    [activable]=\"false\"\n    [hoverable]=\"true\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n    [style.background-color]=\"isOdd ? 'var(--sapList_Hover_Background)' : null\"\n>\n    @if (mo.$Group || mo.$Group === '') {\n    <td\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n        fd-table-cell\n        style=\"font-weight: bold; font-size: 1rem\"\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n        class=\"row-group\"\n        [class.mobile-mode]=\"secondaryColumns?.length\"\n        [attr.level]=\"level\"\n        [class.root-group]=\"level === 0\"\n    >\n        <button\n            fd-button\n            [fdType]=\"'transparent'\"\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n            class=\"cell-expand\"\n            (click)=\"onExpandClick()\"\n        ></button>\n        {{ mo.$Group }}\n    </td>\n    } @else {\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    @if (isCheckList) {\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n        @if (workflowState?.state === 'Pending') {\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n        </div>\n        } @if (checkboxComponent?.Selector) {\n        <bnrc-dynamic-item-component\n            [component]=\"checkboxComponent\"\n            [mo]=\"mo\"\n            [isChecked]=\"isChecked\"\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\n            [setting]=\"setting\"\n            [parameters]=\"checkboxComponent.Parameters\"\n            [editMode]=\"inlineEditMode\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [value]=\"isChecked\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [allColumns]=\"allColumns\"\n            [typeDefId]=\"typeDefId\"\n            (events)=\"onRowCheck()\"\n        ></bnrc-dynamic-item-component>\n        } @if (!checkboxComponent?.Selector) {\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n        }\n    </td>\n    } @if (!isCheckList && !showRowNumber) {\n    <td\n        fd-table-cell\n        class=\"single-select\"\n        (click)=\"!isCheckList && onRowCheck()\"\n        style=\"padding: 0; text-align: center\"\n    >\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n        } @if (saving) {\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n        } @if (saved) {\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\n        <fd-icon glyph=\"favorite\"></fd-icon>\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\n        <fd-icon glyph=\"edit\"></fd-icon>\n        } }\n    </td>\n    }\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n    @for (column of columns; track column; let columnIndex = $index) { @if ((rowIndicator && columnIndex > 0) ||\n    !rowIndicator) {\n    <td\n        [attr.dbName]=\"column.Name\"\n        #tdEl\n        fd-table-cell\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [hostEl]=\"tdEl\"\n        [styleIndex]=\"styleIndex\"\n        [dbName]=\"column.Name\"\n        [focusable]=\"false\"\n        (click)=\"onColumnClick()\"\n        (dblclick)=\"onRowClick()\"\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\n    >\n        <ng-container\n            *ngTemplateOutlet=\"\n                columnTemplate;\n                context: {\n                    $implicit: column,\n                    mo: mo,\n                    index: columnIndex,\n                    inlineEditMode: inlineEditMode,\n                    layout94: layout$ | async\n                }\n            \"\n        ></ng-container>\n    </td>\n    } } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n    <td class=\"col-context-menu\" fd-table-cell>\n        <bsu-ulv-context-menu\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [mo]=\"mo\"\n            [index]=\"index\"\n            (commandClick)=\"onUlvCommand()\"\n            [deviceName]=\"deviceName\"\n            [menuItems]=\"contextMenuItems\"\n            [allColumns]=\"allColumns\"\n        ></bsu-ulv-context-menu>\n    </td>\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n        @if (detailsComponent?.Selector || cartableParams?.moId) {\n        <button\n            fd-button\n            [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onRowDetails()\"\n        ></button>\n        }\n    </td>\n    } @if (actionList?.length && !inlineEditMode) {\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n        @for (a of actionList; track a) {\n        <button\n            fd-button\n            [glyph]=\"a.glyph\"\n            [navigation]=\"a.navigation\"\n            [fdType]=\"'transparent'\"\n            [role]=\"a.role\"\n            bodyClick\n            [disableBodyClick]=\"!a.closeOnClick\"\n            (click)=\"a.handler({mo, index})\"\n        ></button>\n        }\n    </td>\n    } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n    #trEl\n    fd-table-row\n    [secondary]=\"true\"\n    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    @if (!isCheckList) {\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n    }\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n        <div style=\"display: flex; flex-direction: column\">\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n            <p\n                #pEl\n                fd-table-text\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"pEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n            >\n                <label fd-form-label>{{ column.Caption }} :</label>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        columnTemplate;\n                        context: {\n                            $implicit: column,\n                            mo: mo,\n                            index: columnIndex,\n                            inlineEditMode: inlineEditMode,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </p>\n            }\n        </div>\n    </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr [class.detailCollapsed]=\"detailsCollapsed\" fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n} @if (!detailsCollapsed && detailsComponent?.Selector) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        @if (detailsComponent && detailsComponent.Selector) {\n        <bnrc-dynamic-item-component\n            [component]=\"detailsComponent\"\n            [mo]=\"mo\"\n            [isChecked]=\"isChecked\"\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\n            [setting]=\"detailsComponentSetting\"\n            [parameters]=\"detailsComponent.Settings\"\n            [editMode]=\"inlineEditMode\"\n            [formSetting]=\"formSetting\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [allColumns]=\"allColumns\"\n            [typeDefId]=\"typeDefId\"\n        ></bnrc-dynamic-item-component>\n        }\n    </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            detailsFormItems;\n            context: {\n                $implicit: detailsColumns,\n                mo: mo,\n                inlineEditMode: inlineEditMode,\n                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\n        <div fd-form-item>\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </div>\n        }\n    </div>\n</ng-template>\n@if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        @if (bruleActionMessage.MessageType === 2) {\n        <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n            {{ bruleActionMessage.MessageExpression }}\n        </fd-message-strip>\n        }\n    </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n}\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [allColumns]=\"allColumns\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [disableEllapsis]=\"secondaryColumns?.length\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    @if (rowIndicator) {\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n    </bsu-barsa-column-indicator>\n    }\n</ng-template>\n<ng-template #rowNumberTemplate>\n    @if (showRowNumber) {\n    <bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\">\n    </bsu-barsa-column-rownumber>\n    }\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}: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}td{vertical-align:middle}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}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.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", "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: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "directive", type: i3$1.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", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis"] }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.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: "17.3.5", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", detailsComponent: "detailsComponent", detailsColumns: "detailsColumns", detailsText: "detailsText", columnComponents: "columnComponents", actionList: "actionList" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n    [class.row-error]=\"hasError\"\n    [class.showdetails-on]=\"!detailsCollapsed\"\n    #trEl\n    fd-table-row\n    [activable]=\"false\"\n    [hoverable]=\"true\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n    [style.background-color]=\"isOdd ? 'var(--sapList_Hover_Background)' : null\"\n>\n    @if (mo.$Group || mo.$Group === '') {\n    <td\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n        fd-table-cell\n        style=\"font-weight: bold; font-size: 1rem\"\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n        class=\"row-group\"\n        [class.mobile-mode]=\"secondaryColumns?.length\"\n        [attr.level]=\"level\"\n        [class.root-group]=\"level === 0\"\n    >\n        <button\n            fd-button\n            [fdType]=\"'transparent'\"\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n            class=\"cell-expand\"\n            (click)=\"onExpandClick()\"\n        ></button>\n        {{ mo.$Group }}\n    </td>\n    } @else {\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    @if (isCheckList) {\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n        @if (workflowState?.state === 'Pending') {\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n        </div>\n        } @if (checkboxComponent?.Selector) {\n        <bnrc-dynamic-item-component\n            [component]=\"checkboxComponent\"\n            [mo]=\"mo\"\n            [isChecked]=\"isChecked\"\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\n            [setting]=\"setting\"\n            [parameters]=\"checkboxComponent.Parameters\"\n            [editMode]=\"inlineEditMode\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [value]=\"isChecked\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [allColumns]=\"allColumns\"\n            [typeDefId]=\"typeDefId\"\n            (events)=\"onRowCheck()\"\n        ></bnrc-dynamic-item-component>\n        } @if (!checkboxComponent?.Selector) {\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n        }\n    </td>\n    } @if (!isCheckList && !showRowNumber) {\n    <td\n        fd-table-cell\n        class=\"single-select\"\n        (click)=\"!isCheckList && onRowCheck()\"\n        style=\"padding: 0; text-align: center\"\n    >\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n        } @if (saving) {\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n        } @if (saved) {\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\n        <fd-icon glyph=\"favorite\"></fd-icon>\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\n        <fd-icon glyph=\"edit\"></fd-icon>\n        } }\n    </td>\n    }\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n    @for (column of columns; track column; let columnIndex = $index) { @if ((rowIndicator && columnIndex > 0) ||\n    !rowIndicator) {\n    <td\n        [attr.dbName]=\"column.Name\"\n        #tdEl\n        fd-table-cell\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [hostEl]=\"tdEl\"\n        [styleIndex]=\"styleIndex\"\n        [dbName]=\"column.Name\"\n        [focusable]=\"false\"\n        (click)=\"onColumnClick()\"\n        (dblclick)=\"onRowClick()\"\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\n    >\n        <ng-container\n            *ngTemplateOutlet=\"\n                columnTemplate;\n                context: {\n                    $implicit: column,\n                    mo: mo,\n                    index: columnIndex,\n                    inlineEditMode: inlineEditMode,\n                    layout94: layout$ | async\n                }\n            \"\n        ></ng-container>\n    </td>\n    } } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n    <td class=\"col-context-menu\" fd-table-cell>\n        <bsu-ulv-context-menu\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n            [conditionalFormats]=\"conditionalFormats\"\n            [styleIndex]=\"styleIndex\"\n            [mo]=\"mo\"\n            [index]=\"index\"\n            (commandClick)=\"onUlvCommand()\"\n            [deviceName]=\"deviceName\"\n            [menuItems]=\"contextMenuItems\"\n            [allColumns]=\"allColumns\"\n        ></bsu-ulv-context-menu>\n    </td>\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n        @if (detailsComponent?.Selector || cartableParams?.moId) {\n        <button\n            fd-button\n            [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onRowDetails()\"\n        ></button>\n        }\n    </td>\n    } @if (actionList?.length && !inlineEditMode) {\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n        @for (a of actionList; track a) {\n        <button\n            fd-button\n            [glyph]=\"a.glyph\"\n            [navigation]=\"a.navigation\"\n            [fdType]=\"'transparent'\"\n            [role]=\"a.role\"\n            bodyClick\n            [disableBodyClick]=\"!a.closeOnClick\"\n            (click)=\"a.handler({mo, index})\"\n        ></button>\n        }\n    </td>\n    } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n    #trEl\n    fd-table-row\n    [secondary]=\"true\"\n    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    @if (!isCheckList) {\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n    }\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n        <div style=\"display: flex; flex-direction: column\">\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n            <p\n                #pEl\n                fd-table-text\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"pEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n            >\n                <label fd-form-label>{{ column.Caption }} :</label>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        columnTemplate;\n                        context: {\n                            $implicit: column,\n                            mo: mo,\n                            index: columnIndex,\n                            inlineEditMode: inlineEditMode,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </p>\n            }\n        </div>\n    </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr [class.detailCollapsed]=\"detailsCollapsed\" fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n} @if (!detailsCollapsed && detailsComponent?.Selector) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        @if (detailsComponent && detailsComponent.Selector) {\n        <bnrc-dynamic-item-component\n            [component]=\"detailsComponent\"\n            [mo]=\"mo\"\n            [isChecked]=\"isChecked\"\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\n            [setting]=\"detailsComponentSetting\"\n            [parameters]=\"detailsComponent.Settings\"\n            [editMode]=\"inlineEditMode\"\n            [formSetting]=\"formSetting\"\n            [rtl]=\"rtl\"\n            [deviceName]=\"deviceName\"\n            [deviceSize]=\"deviceSize\"\n            [index]=\"index\"\n            [allColumns]=\"allColumns\"\n            [typeDefId]=\"typeDefId\"\n        ></bnrc-dynamic-item-component>\n        }\n    </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            detailsFormItems;\n            context: {\n                $implicit: detailsColumns,\n                mo: mo,\n                inlineEditMode: inlineEditMode,\n                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\n        <div fd-form-item>\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </div>\n        }\n    </div>\n</ng-template>\n@if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        @if (bruleActionMessage.MessageType === 2) {\n        <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n            {{ bruleActionMessage.MessageExpression }}\n        </fd-message-strip>\n        }\n    </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n}\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [allColumns]=\"allColumns\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [disableEllapsis]=\"secondaryColumns?.length\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    @if (rowIndicator) {\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n    </bsu-barsa-column-indicator>\n    }\n</ng-template>\n<ng-template #rowNumberTemplate>\n    @if (showRowNumber) {\n    <bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\">\n    </bsu-barsa-column-rownumber>\n    }\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}: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}td{vertical-align:middle}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}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.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", "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: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.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", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "directive", type: i3$1.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", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis"] }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.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: "17.3.5", ngImport: i0, type: BarsaTableRowComponent, decorators: [{
             type: Component,
@@ -5684,7 +5684,7 @@ class NotificationItemComponent extends BaseComponent {
         this._deviceSize = this.deviceSize;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NotificationItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NotificationItemComponent, selector: "bsu-notification-item", inputs: { option: "option", notificationItem: "notificationItem", showCloseButton: "showCloseButton", deviceSize: "deviceSize" }, outputs: { viewed: "viewed", remove: "remove", actionClick: "actionClick", showEvent: "showEvent", closeEvent: "closeEvent" }, host: { properties: { "class": "this._deviceSize" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"notificationItem ? notificationItemTemplate : optionTemplate\"> </ng-container>\n\n<ng-template #optionTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            bodyTemplate;\n            context: {\n                choiceDefStatus: null,\n                isNew: false,\n                loading: false,\n                icon: option.icon,\n                statusCaption: '',\n                unread: true,\n                title: option.title,\n                content: option.msg,\n                userCaption: option.NotificationItem?.CreatorUser$Caption,\n                dateCaption: option.NotificationItem?.CreationDate$Caption,\n                overflowButtons: true,\n                uiActions: option.NotificationItem?.UiActions,\n                hideShowButton: option.NotificationItem?.HideShowButton,\n                tag: option.NotificationItem?.Tag,\n                hideDeleteButton: true,\n                mo: option.mo\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #notificationItemTemplate>\n    <fd-notification>\n        <ng-container\n            *ngTemplateOutlet=\"\n                bodyTemplate;\n                context: {\n                    choiceDefStatus: notificationItem.$ChoiceDefStatus,\n                    isNew: notificationItem.$NewNotification,\n                    loading: notificationItem.$NotificatoinLoading,\n                    icon: notificationItem.Icon,\n                    statusCaption: notificationItem.Status$Caption,\n                    unread: notificationItem.Unread,\n                    title: notificationItem.Title,\n                    content: notificationItem.$SafeContent,\n                    userCaption: notificationItem.IMessage?.CreatorUser$Caption,\n                    dateCaption: notificationItem.IMessage?.CreationDate$Caption,\n                    overflowButtons: true,\n                    uiActions: notificationItem.UiActions,\n                    tag: notificationItem.Tag,\n                    hideShowButton: notificationItem.HideShowButton,\n                    hideDeleteButton: notificationItem.HideDeleteButton,\n                    mo: notificationItem\n                }\n            \"\n        ></ng-container>\n    </fd-notification>\n</ng-template>\n\n<ng-template\n    #bodyTemplate\n    let-choiceDefStatus=\"choiceDefStatus\"\n    let-isNew=\"isNew\"\n    let-loading=\"loading\"\n    let-icon=\"icon\"\n    let-statusCaption=\"statusCaption\"\n    let-unread=\"unread\"\n    let-title=\"title\"\n    let-content=\"content\"\n    let-userCaption=\"userCaption\"\n    let-dateCaption=\"dateCaption\"\n    let-overflowButtons=\"overflowButtons\"\n    let-uiActions=\"uiActions\"\n    let-hideShowButton=\"hideShowButton\"\n    let-hideDeleteButton=\"hideDeleteButton\"\n    let-mo=\"mo\"\n    let-tag=\"tag\"\n>\n    <fd-notification-body>\n        @if (choiceDefStatus?.error) {\n        <fd-message-strip type=\"error\" style=\"margin: 0.5rem\">\n            {{ choiceDefStatus.error.Text }}\n        </fd-message-strip>\n        } @if (loading || isNew || choiceDefStatus?.loading) {\n        <bsu-mask [top]=\"'10px'\"></bsu-mask>\n        }\n        <fd-avatar\n            [transparent]=\"true\"\n            [circle]=\"true\"\n            size=\"xs\"\n            [glyph]=\"!icon ? 'bell' : null\"\n            [image]=\"icon ? icon : null\"\n        ></fd-avatar>\n        <fd-notification-content style=\"overflow: hidden\">\n            <fd-notification-header>\n                <div fd-notification-indicator [type]=\"statusCaption\"></div>\n                <h2 fd-notification-title [unread]=\"unread\">{{ title }}</h2>\n            </fd-notification-header>\n            <p #content fd-notification-paragraph [innerHTML]=\"content\"></p>\n            <fd-notification-footer>\n                <span fd-notification-footer-content>{{ userCaption }}</span>\n                <span fd-notification-separator></span>\n                <span fd-notification-footer-content>{{ dateCaption }}</span>\n            </fd-notification-footer>\n        </fd-notification-content>\n        <fd-notification-actions>\n            @if (overflowButtons) {\n            <fd-action-sheet #sheet>\n                <fd-action-sheet-control>\n                    @if (uiActions?.length) {\n                    <button\n                        role=\"menu\"\n                        [ariaLabel]=\"'More' | bbbTranslate\"\n                        [title]=\"'More' | bbbTranslate\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"overflow\"\n                    ></button>\n                    }\n                </fd-action-sheet-control>\n                <fd-action-sheet-body>\n                    @for (btn of uiActions; track btn) {\n                    <li\n                        fd-action-sheet-item\n                        [glyph]=\"btn.Icon\"\n                        [label]=\"btn.Title | bbbTranslate\"\n                        (click)=\"sheet.close(); actionClick.emit({ item: mo, btn: this.btn }); closeEvent.emit()\"\n                    ></li>\n                    }\n                </fd-action-sheet-body>\n            </fd-action-sheet>\n            } @else { @for (btn of uiActions; track btn) {\n            <button\n                fd-button\n                [glyph]=\"btn.Icon\"\n                [fdType]=\"btn.Status\"\n                [label]=\"btn.Title | bbbTranslate\"\n                [title]=\"btn.Title | bbbTranslate\"\n                fdCompact\n                (click)=\"actionClick.emit({ item: mo, btn: this.btn }); closeEvent.emit()\"\n            ></button>\n            } } @if (hideShowButton === false && mo.RelatedMo) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'Show' | bbbTranslate\"\n                [title]=\"'Show' | bbbTranslate\"\n                glyph=\"show\"\n                (click)=\"showEvent.emit({tag,  mo: mo.RelatedMo, nama: mo.RelatedMoNama });closeEvent.emit()\"\n            ></button>\n            } @if (hideDeleteButton === false) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'Delete' | bbbTranslate\"\n                [title]=\"'Delete' | bbbTranslate\"\n                glyph=\"decline\"\n                (click)=\"remove.emit({ items: [mo], silent: false }); closeEvent.emit()\"\n            ></button>\n            } @if (showCloseButton) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'close' | bbbTranslate\"\n                [title]=\"'close' | bbbTranslate\"\n                glyph=\"decline\"\n                (click)=\"closeEvent.emit()\"\n            ></button>\n            }\n        </fd-notification-actions>\n    </fd-notification-body>\n</ng-template>\n", styles: ["fd-notification-content{min-width:320px}fd-notification-content p{max-height:3rem}:host.s fd-notification-content{min-width:auto!important}fd-notification-actions{max-width:200px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$5.ActionSheetComponent, selector: "fd-action-sheet", inputs: ["mobile", "placement", "noArrow", "isOpen", "keyboardSupport", "triggers"], outputs: ["focusEscapeList", "isOpenChange"] }, { kind: "component", type: i2$5.ActionSheetControlComponent, selector: "fd-action-sheet-control", outputs: ["clicked"] }, { kind: "component", type: i2$5.ActionSheetItemComponent, selector: "[fd-action-sheet-item]", inputs: ["label", "glyph", "glyphFont", "negative", "isCloseButton", "disabled"], outputs: ["keyDown"] }, { kind: "component", type: i2$5.ActionSheetBodyComponent, selector: "fd-action-sheet-body", inputs: ["actionSheetBodyId", "mobile", "ariaLabel", "ariaLabelledby"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i7$5.NotificationComponent, selector: "fd-notification", inputs: ["width", "mobile"] }, { kind: "component", type: i7$5.NotificationHeaderComponent, selector: "fd-notification-header", inputs: ["uniqueId"] }, { kind: "component", type: i7$5.NotificationFooterComponent, selector: "fd-notification-footer" }, { kind: "component", type: i7$5.NotificationBodyComponent, selector: "fd-notification-body" }, { kind: "component", type: i7$5.NotificationActionsComponent, selector: "fd-notification-actions" }, { kind: "component", type: i7$5.NotificationContentComponent, selector: "fd-notification-content" }, { kind: "directive", type: i7$5.NotificationTitleDirective, selector: "[fdNotificationTitle], [fd-notification-title]", inputs: ["unread"] }, { kind: "directive", type: i7$5.NotificationIndicatorDirective, selector: "[fdNotificationIndicator], [fd-notification-indicator]", inputs: ["type", "class"] }, { kind: "directive", type: i7$5.NotificationParagraphDirective, selector: "[fdNotificationParagraph], [fd-notification-paragraph]" }, { kind: "directive", type: i7$5.NotificationFooterContentDirective, selector: "[fdNotificationFooterContent], [fd-notification-footer-content]" }, { kind: "directive", type: i7$5.NotificationSeparatorDirective, selector: "[fdNotificationSeparator], [fd-notification-separator]" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NotificationItemComponent, selector: "bsu-notification-item", inputs: { option: "option", notificationItem: "notificationItem", showCloseButton: "showCloseButton", deviceSize: "deviceSize" }, outputs: { viewed: "viewed", remove: "remove", actionClick: "actionClick", showEvent: "showEvent", closeEvent: "closeEvent" }, host: { properties: { "class": "this._deviceSize" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"notificationItem ? notificationItemTemplate : optionTemplate\"> </ng-container>\n\n<ng-template #optionTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            bodyTemplate;\n            context: {\n                choiceDefStatus: null,\n                isNew: false,\n                loading: false,\n                icon: option.icon,\n                statusCaption: '',\n                unread: true,\n                title: option.title,\n                content: option.msg,\n                userCaption: option.NotificationItem?.CreatorUser$Caption,\n                dateCaption: option.NotificationItem?.CreationDate$Caption,\n                overflowButtons: true,\n                uiActions: option.NotificationItem?.UiActions,\n                hideShowButton: option.NotificationItem?.HideShowButton,\n                tag: option.NotificationItem?.Tag,\n                hideDeleteButton: true,\n                mo: option.mo\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #notificationItemTemplate>\n    <fd-notification>\n        <ng-container\n            *ngTemplateOutlet=\"\n                bodyTemplate;\n                context: {\n                    choiceDefStatus: notificationItem.$ChoiceDefStatus,\n                    isNew: notificationItem.$NewNotification,\n                    loading: notificationItem.$NotificatoinLoading,\n                    icon: notificationItem.Icon,\n                    statusCaption: notificationItem.Status$Caption,\n                    unread: notificationItem.Unread,\n                    title: notificationItem.Title,\n                    content: notificationItem.$SafeContent,\n                    userCaption: notificationItem.IMessage?.CreatorUser$Caption,\n                    dateCaption: notificationItem.IMessage?.CreationDate$Caption,\n                    overflowButtons: true,\n                    uiActions: notificationItem.UiActions,\n                    tag: notificationItem.Tag,\n                    hideShowButton: notificationItem.HideShowButton,\n                    hideDeleteButton: notificationItem.HideDeleteButton,\n                    mo: notificationItem\n                }\n            \"\n        ></ng-container>\n    </fd-notification>\n</ng-template>\n\n<ng-template\n    #bodyTemplate\n    let-choiceDefStatus=\"choiceDefStatus\"\n    let-isNew=\"isNew\"\n    let-loading=\"loading\"\n    let-icon=\"icon\"\n    let-statusCaption=\"statusCaption\"\n    let-unread=\"unread\"\n    let-title=\"title\"\n    let-content=\"content\"\n    let-userCaption=\"userCaption\"\n    let-dateCaption=\"dateCaption\"\n    let-overflowButtons=\"overflowButtons\"\n    let-uiActions=\"uiActions\"\n    let-hideShowButton=\"hideShowButton\"\n    let-hideDeleteButton=\"hideDeleteButton\"\n    let-mo=\"mo\"\n    let-tag=\"tag\"\n>\n    <fd-notification-body>\n        @if (choiceDefStatus?.error) {\n        <fd-message-strip type=\"error\" style=\"margin: 0.5rem\">\n            {{ choiceDefStatus.error.Text }}\n        </fd-message-strip>\n        } @if (loading || isNew || choiceDefStatus?.loading) {\n        <bsu-mask [top]=\"'10px'\"></bsu-mask>\n        }\n        <fd-avatar\n            [transparent]=\"true\"\n            [circle]=\"true\"\n            size=\"xs\"\n            [glyph]=\"!icon ? 'bell' : null\"\n            [image]=\"icon ? icon : null\"\n        ></fd-avatar>\n        <fd-notification-content style=\"overflow: hidden\">\n            <fd-notification-header>\n                <div fd-notification-indicator [type]=\"statusCaption\"></div>\n                <h2 fd-notification-title [unread]=\"unread\">{{ title }}</h2>\n            </fd-notification-header>\n            <p #content fd-notification-paragraph [innerHTML]=\"content\"></p>\n            <fd-notification-footer>\n                <span fd-notification-footer-content>{{ userCaption }}</span>\n                <span fd-notification-separator></span>\n                <span fd-notification-footer-content>{{ dateCaption }}</span>\n            </fd-notification-footer>\n        </fd-notification-content>\n        <fd-notification-actions>\n            @if (overflowButtons) {\n            <fd-action-sheet #sheet>\n                <fd-action-sheet-control>\n                    @if (uiActions?.length) {\n                    <button\n                        role=\"menu\"\n                        [ariaLabel]=\"'More' | bbbTranslate\"\n                        [title]=\"'More' | bbbTranslate\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"overflow\"\n                    ></button>\n                    }\n                </fd-action-sheet-control>\n                <fd-action-sheet-body>\n                    @for (btn of uiActions; track btn) {\n                    <li\n                        fd-action-sheet-item\n                        [glyph]=\"btn.Icon\"\n                        [label]=\"btn.Title | bbbTranslate\"\n                        (click)=\"sheet.close(); actionClick.emit({ item: mo, btn: this.btn }); closeEvent.emit()\"\n                    ></li>\n                    }\n                </fd-action-sheet-body>\n            </fd-action-sheet>\n            } @else { @for (btn of uiActions; track btn) {\n            <button\n                fd-button\n                [glyph]=\"btn.Icon\"\n                [fdType]=\"btn.Status\"\n                [label]=\"btn.Title | bbbTranslate\"\n                [title]=\"btn.Title | bbbTranslate\"\n                fdCompact\n                (click)=\"actionClick.emit({ item: mo, btn: this.btn }); closeEvent.emit()\"\n            ></button>\n            } } @if (hideShowButton === false && mo.RelatedMo) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'Show' | bbbTranslate\"\n                [title]=\"'Show' | bbbTranslate\"\n                glyph=\"show\"\n                (click)=\"showEvent.emit({tag,  mo: mo.RelatedMo, nama: mo.RelatedMoNama });closeEvent.emit()\"\n            ></button>\n            } @if (hideDeleteButton === false) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'Delete' | bbbTranslate\"\n                [title]=\"'Delete' | bbbTranslate\"\n                glyph=\"decline\"\n                (click)=\"remove.emit({ items: [mo], silent: false }); closeEvent.emit()\"\n            ></button>\n            } @if (showCloseButton) {\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'close' | bbbTranslate\"\n                [title]=\"'close' | bbbTranslate\"\n                glyph=\"decline\"\n                (click)=\"closeEvent.emit()\"\n            ></button>\n            }\n        </fd-notification-actions>\n    </fd-notification-body>\n</ng-template>\n", styles: ["fd-notification-content{min-width:320px}fd-notification-content p{max-height:3rem}:host.s fd-notification-content{min-width:auto!important}fd-notification-actions{max-width:200px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$5.ActionSheetComponent, selector: "fd-action-sheet", inputs: ["mobile", "placement", "noArrow", "isOpen", "keyboardSupport", "triggers"], outputs: ["focusEscapeList", "isOpenChange"] }, { kind: "component", type: i2$5.ActionSheetControlComponent, selector: "fd-action-sheet-control", outputs: ["clicked"] }, { kind: "component", type: i2$5.ActionSheetItemComponent, selector: "[fd-action-sheet-item]", inputs: ["label", "glyph", "glyphFont", "negative", "isCloseButton", "disabled"], outputs: ["keyDown"] }, { kind: "component", type: i2$5.ActionSheetBodyComponent, selector: "fd-action-sheet-body", inputs: ["actionSheetBodyId", "mobile", "ariaLabel", "ariaLabelledby"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i7$5.NotificationComponent, selector: "fd-notification", inputs: ["width", "mobile"] }, { kind: "component", type: i7$5.NotificationHeaderComponent, selector: "fd-notification-header", inputs: ["uniqueId"] }, { kind: "component", type: i7$5.NotificationFooterComponent, selector: "fd-notification-footer" }, { kind: "component", type: i7$5.NotificationBodyComponent, selector: "fd-notification-body" }, { kind: "component", type: i7$5.NotificationActionsComponent, selector: "fd-notification-actions" }, { kind: "component", type: i7$5.NotificationContentComponent, selector: "fd-notification-content" }, { kind: "directive", type: i7$5.NotificationTitleDirective, selector: "[fdNotificationTitle], [fd-notification-title]", inputs: ["unread"] }, { kind: "directive", type: i7$5.NotificationIndicatorDirective, selector: "[fdNotificationIndicator], [fd-notification-indicator]", inputs: ["type", "class"] }, { kind: "directive", type: i7$5.NotificationParagraphDirective, selector: "[fdNotificationParagraph], [fd-notification-paragraph]" }, { kind: "directive", type: i7$5.NotificationFooterContentDirective, selector: "[fdNotificationFooterContent], [fd-notification-footer-content]" }, { kind: "directive", type: i7$5.NotificationSeparatorDirective, selector: "[fdNotificationSeparator], [fd-notification-separator]" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NotificationItemComponent, decorators: [{
             type: Component,
@@ -5900,7 +5900,7 @@ class UiDateRangeExComponent extends FieldBaseComponent {
                 useFactory: getDateService,
                 deps: [LogService]
             }
-        ], viewQueries: [{ propertyName: "dateRangePicker", first: true, predicate: ["dateRangePicker"], descendants: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (value?.DateRangeType === 'SpecificRange') {\n<div class=\"input-container\">\n    <ui5-daterange-picker\n        id=\"mydaterange-picker1\"\n        (mouseover)=\"onOpenPopover()\"\n        (mouseleave)=\"popover.close()\"\n        #dateRangePicker\n        (change)=\"onDateRangeChange()\"\n        format-pattern=\"yyyy/MM/dd\"\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n        [primaryCalendarType]=\"Setting.CalendarType !== 'Gregorian' ? 'Persian' : Setting.CalendarType\"\n    >\n    </ui5-daterange-picker>\n    <button\n        class=\"btn-drop-down\"\n        fd-button\n        [fdType]=\"'standard'\"\n        [glyph]=\"'slim-arrow-down'\"\n        (click)=\"popover.open()\"\n    ></button>\n</div>\n} @else {\n<!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\n<fd-input-group\n    placement=\"after\"\n    glyph=\"slim-arrow-down\"\n    glyphAriaLabel=\"Select Date Range\"\n    [button]=\"true\"\n    [ngModel]=\"valueStr\"\n    (addOnButtonClicked)=\"popover.open()\"\n>\n</fd-input-group>\n}\n<ng-template #input>\n    <!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\n\n    <fd-input-group\n        placement=\"after\"\n        glyph=\"slim-arrow-down\"\n        glyphAriaLabel=\"Select Date Range\"\n        [button]=\"true\"\n        [ngModel]=\"valueStr\"\n        (addOnButtonClicked)=\"popover.open()\"\n    >\n    </fd-input-group>\n</ng-template>\n\n<!-- <button fd-button>\n<fd-select (valueChange)=\"onDateRangeTypeChange($event)\">\n  <fd-option *ngFor=\"let option of dateRanges\" [value]=\"option\">{{ option | bbbTranslate }}</fd-option>\n</fd-select>\n</button> -->\n\n<fd-popover\n    #popover\n    style=\"display: block\"\n    [fillControlMode]=\"'at-least'\"\n    placement=\"bottom-start\"\n    [(isOpen)]=\"isOpenPopover\"\n>\n    <fd-popover-body>\n        <ul fd-list>\n            @for (option of dateRanges; track option) {\n            <li fd-list-item (click)=\"popover.close(); onDateRangeTypeChange(option)\">\n                <a fd-list-link>\n                    <span fd-list-title>{{ option | bbbTranslate }}</span>\n                </a>\n            </li>\n            }\n        </ul>\n    </fd-popover-body>\n</fd-popover>\n", styles: [":host{display:block}:host input{border-top-left-radius:0;border-left:none;border-bottom-left-radius:0}:host .input-container{width:100%;display:flex;align-items:center}:host .input-container ui5-daterange-picker{padding:3px 0;min-width:2rem;width:100%;flex-grow:1}.btn-drop-down{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { 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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "dateRangePicker", first: true, predicate: ["dateRangePicker"], descendants: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (value?.DateRangeType === 'SpecificRange') {\n<div class=\"input-container\">\n    <ui5-daterange-picker\n        id=\"mydaterange-picker1\"\n        (mouseover)=\"onOpenPopover()\"\n        (mouseleave)=\"popover.close()\"\n        #dateRangePicker\n        (change)=\"onDateRangeChange()\"\n        format-pattern=\"yyyy/MM/dd\"\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n        [primaryCalendarType]=\"Setting.CalendarType !== 'Gregorian' ? 'Persian' : Setting.CalendarType\"\n    >\n    </ui5-daterange-picker>\n    <button\n        class=\"btn-drop-down\"\n        fd-button\n        [fdType]=\"'standard'\"\n        [glyph]=\"'slim-arrow-down'\"\n        (click)=\"popover.open()\"\n    ></button>\n</div>\n} @else {\n<!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\n<fd-input-group\n    placement=\"after\"\n    glyph=\"slim-arrow-down\"\n    glyphAriaLabel=\"Select Date Range\"\n    [button]=\"true\"\n    [ngModel]=\"valueStr\"\n    (addOnButtonClicked)=\"popover.open()\"\n>\n</fd-input-group>\n}\n<ng-template #input>\n    <!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\n\n    <fd-input-group\n        placement=\"after\"\n        glyph=\"slim-arrow-down\"\n        glyphAriaLabel=\"Select Date Range\"\n        [button]=\"true\"\n        [ngModel]=\"valueStr\"\n        (addOnButtonClicked)=\"popover.open()\"\n    >\n    </fd-input-group>\n</ng-template>\n\n<!-- <button fd-button>\n<fd-select (valueChange)=\"onDateRangeTypeChange($event)\">\n  <fd-option *ngFor=\"let option of dateRanges\" [value]=\"option\">{{ option | bbbTranslate }}</fd-option>\n</fd-select>\n</button> -->\n\n<fd-popover\n    #popover\n    style=\"display: block\"\n    [fillControlMode]=\"'at-least'\"\n    placement=\"bottom-start\"\n    [(isOpen)]=\"isOpenPopover\"\n>\n    <fd-popover-body>\n        <ul fd-list>\n            @for (option of dateRanges; track option) {\n            <li fd-list-item (click)=\"popover.close(); onDateRangeTypeChange(option)\">\n                <a fd-list-link>\n                    <span fd-list-title>{{ option | bbbTranslate }}</span>\n                </a>\n            </li>\n            }\n        </ul>\n    </fd-popover-body>\n</fd-popover>\n", styles: [":host{display:block}:host input{border-top-left-radius:0;border-left:none;border-bottom-left-radius:0}:host .input-container{width:100%;display:flex;align-items:center}:host .input-container ui5-daterange-picker{padding:3px 0;min-width:2rem;width:100%;flex-grow:1}.btn-drop-down{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiDateRangeExComponent, decorators: [{
             type: Component,
@@ -5984,7 +5984,7 @@ class ReportSearchPanelSaveComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchPanelSaveComponent, deps: [{ token: i1$4.UntypedFormBuilder }, { token: i1$1.DialogRef }, { token: i2.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportSearchPanelSaveComponent, selector: "bsu-report-search-panel-save", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <h1 fd-title>{{ 'Save' | bbbTranslate }}</h1>\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\" [disabled]=\"saveing\"></button>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        @if (saveing) {\n        <bsu-mask></bsu-mask>\n        }\n        <div fd-form-item [formGroup]=\"appGroupForm\" [class.saveing-form]=\"saveing\">\n            <label fd-form-label [required]=\"true\">{{ 'Title' | bbbTranslate }}</label>\n            <fd-form-input-message-group>\n                <fd-input-group\n                    class=\"form-control\"\n                    formControlName=\"title\"\n                    form-control\n                    [button]=\"true\"\n                    [(ngModel)]=\"title\"\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\n                >\n                </fd-input-group>\n                <fd-checkbox\n                    formControlName=\"setAsDefault\"\n                    [label]=\"'SetasDefault' | bbbTranslate\"\n                    [(ngModel)]=\"isDefault\"\n                ></fd-checkbox>\n                <fd-checkbox\n                    formControlName=\"publicFilter\"\n                    [label]=\"'Public' | bbbTranslate\"\n                    [(ngModel)]=\"isPublic\"\n                ></fd-checkbox>\n                <fd-checkbox\n                    formControlName=\"applyAutomatically\"\n                    [label]=\"'ApplyAutomatically' | bbbTranslate\"\n                    [(ngModel)]=\"applyAutomatically\"\n                ></fd-checkbox>\n                @if (submitted && appGroupForm.controls.title.errors) {\n                <fd-form-message type=\"error\">\n                    {{ RequiredText }}\n                </fd-form-message>\n                }\n            </fd-form-input-message-group>\n        </div>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\" [disabled]=\"saveing\">\n        </fd-button-bar>\n        <fd-button-bar\n            [disabled]=\"saveing\"\n            [label]=\"'Cancel' | bbbTranslate\"\n            fdInitialFocus\n            fdType=\"transparent\"\n            (click)=\"this.dialogRef.close()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportSearchPanelSaveComponent, selector: "bsu-report-search-panel-save", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <h1 fd-title>{{ 'Save' | bbbTranslate }}</h1>\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\" [disabled]=\"saveing\"></button>\n    </fd-dialog-header>\n\n    <fd-dialog-body>\n        @if (saveing) {\n        <bsu-mask></bsu-mask>\n        }\n        <div fd-form-item [formGroup]=\"appGroupForm\" [class.saveing-form]=\"saveing\">\n            <label fd-form-label [required]=\"true\">{{ 'Title' | bbbTranslate }}</label>\n            <fd-form-input-message-group>\n                <fd-input-group\n                    class=\"form-control\"\n                    formControlName=\"title\"\n                    form-control\n                    [button]=\"true\"\n                    [(ngModel)]=\"title\"\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\n                >\n                </fd-input-group>\n                <fd-checkbox\n                    formControlName=\"setAsDefault\"\n                    [label]=\"'SetasDefault' | bbbTranslate\"\n                    [(ngModel)]=\"isDefault\"\n                ></fd-checkbox>\n                <fd-checkbox\n                    formControlName=\"publicFilter\"\n                    [label]=\"'Public' | bbbTranslate\"\n                    [(ngModel)]=\"isPublic\"\n                ></fd-checkbox>\n                <fd-checkbox\n                    formControlName=\"applyAutomatically\"\n                    [label]=\"'ApplyAutomatically' | bbbTranslate\"\n                    [(ngModel)]=\"applyAutomatically\"\n                ></fd-checkbox>\n                @if (submitted && appGroupForm.controls.title.errors) {\n                <fd-form-message type=\"error\">\n                    {{ RequiredText }}\n                </fd-form-message>\n                }\n            </fd-form-input-message-group>\n        </div>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\" [disabled]=\"saveing\">\n        </fd-button-bar>\n        <fd-button-bar\n            [disabled]=\"saveing\"\n            [label]=\"'Cancel' | bbbTranslate\"\n            fdInitialFocus\n            fdType=\"transparent\"\n            (click)=\"this.dialogRef.close()\"\n        >\n        </fd-button-bar>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchPanelSaveComponent, decorators: [{
             type: Component,
@@ -6063,7 +6063,7 @@ class ReportSearchFieldsHiddenSettingsComponent extends BaseComponent {
         this._dialogRef.close(this.girdColumnsComppnent.columns);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchFieldsHiddenSettingsComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: ReportSearchFieldsHiddenSettingsComponent, selector: "bsu-report-search-fields-hidden-settings", viewQueries: [{ propertyName: "girdColumnsComppnent", first: true, predicate: UiGridColumnsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Fields' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-columns [columns]=\"fields\" #columnFilter></bsu-ui-grid-columns>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: ReportSearchFieldsHiddenSettingsComponent, selector: "bsu-report-search-fields-hidden-settings", viewQueries: [{ propertyName: "girdColumnsComppnent", first: true, predicate: UiGridColumnsComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <ng-template fdkTemplate=\"header\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>\r\n                    <h4 fd-title [headerSize]=\"4\">\r\n                        {{ 'Fields' | bbbTranslate }}\r\n                    </h4>\r\n                </fd-bar-element>\r\n            </div>\r\n            <div fd-bar-right>\r\n                <fd-bar-element>\r\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\r\n                </fd-bar-element>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body class=\"setting-wrapper\">\r\n        <bsu-ui-grid-columns [columns]=\"fields\" #columnFilter></bsu-ui-grid-columns>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n        <fd-dialog-footer-button>\r\n            <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\r\n        </fd-dialog-footer-button>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchFieldsHiddenSettingsComponent, decorators: [{
             type: Component,
@@ -6141,7 +6141,7 @@ class ReportSearchFieldsManageComponent extends BaseComponent {
         row.IsDeleted = true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchFieldsManageComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportSearchFieldsManageComponent, selector: "bsu-report-search-fields-manage", viewQueries: [{ propertyName: "radioButtonsComponent", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">\n                        {{ 'ManageSearchPanel' | bbbTranslate }}\n                    </h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n        @if (saveing) {\n        <bsu-mask></bsu-mask>\n        }\n        <table fd-table [class.saveing-form]=\"saveing\">\n            <thead fd-table-header>\n                <tr fd-table-row>\n                    <th fd-table-cell>{{ 'View' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'Share' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'Default' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'ApplyAutomatically' | bbbTranslate }}</th>\n                    <th fd-table-cell></th>\n                </tr>\n            </thead>\n\n            <tbody fd-table-body [noBorderX]=\"true\">\n                @for (row of allSearchPanelSettings; track row; let i = $index) { @if (!row.IsDeleted) {\n                <tr fd-table-row>\n                    <td fd-table-cell>\n                        @if (row.IsPrimary) {\n                        <strong>{{ row.Title }}</strong>\n                        } @if (!row.IsPrimary) {\n                        <input fd-form-control [(ngModel)]=\"row.Title\" />\n                        }\n                    </td>\n                    <td fd-table-cell>\n                        {{ row.IsPublic ? ('Public' | bbbTranslate) : '' }}\n                    </td>\n                    <td fd-table-cell>\n                        <fd-radio-button\n                            [name]=\"'radio' + i\"\n                            [value]=\"row.Title\"\n                            [selectedValue]=\"row.IsDefault ? row.Title : null\"\n                            (click)=\"onDefault(row)\"\n                        >\n                        </fd-radio-button>\n                    </td>\n                    <td fd-table-cell>\n                        @if (!row.IsPrimary) {\n                        <fd-checkbox [(ngModel)]=\"row.ApplyAutomatically\"></fd-checkbox>\n                        }\n                    </td>\n                    <td fd-table-cell [fitContent]=\"true\">\n                        @if (!row.IsPrimary) {\n                        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onDelete(row)\"></button>\n                        }\n                    </td>\n                </tr>\n                } }\n            </tbody>\n        </table>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"emphasized\"\n                (click)=\"onOkClick()\"\n                [label]=\"'OK' | bbbTranslate\"\n                [disabled]=\"saveing\"\n            ></button>\n        </fd-dialog-footer-button>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                (click)=\"onCancelSettings()\"\n                [label]=\"'Cancel' | bbbTranslate\"\n                [disabled]=\"saveing\"\n            ></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i3$5.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ReportSearchFieldsManageComponent, selector: "bsu-report-search-fields-manage", viewQueries: [{ propertyName: "radioButtonsComponent", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <ng-template fdkTemplate=\"header\">\n            <div fd-bar-left>\n                <fd-bar-element>\n                    <h4 fd-title [headerSize]=\"4\">\n                        {{ 'ManageSearchPanel' | bbbTranslate }}\n                    </h4>\n                </fd-bar-element>\n            </div>\n            <div fd-bar-right>\n                <fd-bar-element>\n                    <button fd-button [label]=\"'Reset' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\n                </fd-bar-element>\n            </div>\n        </ng-template>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n        @if (saveing) {\n        <bsu-mask></bsu-mask>\n        }\n        <table fd-table [class.saveing-form]=\"saveing\">\n            <thead fd-table-header>\n                <tr fd-table-row>\n                    <th fd-table-cell>{{ 'View' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'Share' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'Default' | bbbTranslate }}</th>\n                    <th fd-table-cell>{{ 'ApplyAutomatically' | bbbTranslate }}</th>\n                    <th fd-table-cell></th>\n                </tr>\n            </thead>\n\n            <tbody fd-table-body [noBorderX]=\"true\">\n                @for (row of allSearchPanelSettings; track row; let i = $index) { @if (!row.IsDeleted) {\n                <tr fd-table-row>\n                    <td fd-table-cell>\n                        @if (row.IsPrimary) {\n                        <strong>{{ row.Title }}</strong>\n                        } @if (!row.IsPrimary) {\n                        <input fd-form-control [(ngModel)]=\"row.Title\" />\n                        }\n                    </td>\n                    <td fd-table-cell>\n                        {{ row.IsPublic ? ('Public' | bbbTranslate) : '' }}\n                    </td>\n                    <td fd-table-cell>\n                        <fd-radio-button\n                            [name]=\"'radio' + i\"\n                            [value]=\"row.Title\"\n                            [selectedValue]=\"row.IsDefault ? row.Title : null\"\n                            (click)=\"onDefault(row)\"\n                        >\n                        </fd-radio-button>\n                    </td>\n                    <td fd-table-cell>\n                        @if (!row.IsPrimary) {\n                        <fd-checkbox [(ngModel)]=\"row.ApplyAutomatically\"></fd-checkbox>\n                        }\n                    </td>\n                    <td fd-table-cell [fitContent]=\"true\">\n                        @if (!row.IsPrimary) {\n                        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onDelete(row)\"></button>\n                        }\n                    </td>\n                </tr>\n                } }\n            </tbody>\n        </table>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                fdType=\"emphasized\"\n                (click)=\"onOkClick()\"\n                [label]=\"'OK' | bbbTranslate\"\n                [disabled]=\"saveing\"\n            ></button>\n        </fd-dialog-footer-button>\n        <fd-dialog-footer-button>\n            <button\n                fd-button\n                (click)=\"onCancelSettings()\"\n                [label]=\"'Cancel' | bbbTranslate\"\n                [disabled]=\"saveing\"\n            ></button>\n        </fd-dialog-footer-button>\n    </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.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", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i3$5.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ReportSearchFieldsManageComponent, decorators: [{
             type: Component,
@@ -6306,10 +6306,13 @@ class BreadcrumbComponent extends BaseComponent {
             this._router.navigate(['/']);
             return;
         }
-        const lengthOfBreadCrumb = this.allBreadCrumb.length - 1;
-        for (let i = lengthOfBreadCrumb; i > index; i--) {
-            this._router.navigate(['../'], { relativeTo: this.allBreadCrumb[i].route });
+        // const lengthOfBreadCrumb = this.allBreadCrumb.length - 1;
+        let url = '';
+        for (let i = 0; i <= index; i++) {
+            url += this.allBreadCrumb[i].url;
+            // this._router.navigate(['../'], { relativeTo: this.allBreadCrumb[i].route });
         }
+        this._router.navigateByUrl(url);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i2$6.Router }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: { breadCrumb: "breadCrumb", allBreadCrumb: "allBreadCrumb", isLast: "isLast", index: "index" }, usesInheritance: true, ngImport: i0, template: "@if (!isLast) {\n<a fd-link (click)=\"onBreadcrumb()\">{{ breadCrumb.label | bbbTranslate }}</a>\n} @if (isLast) {\n<span>{{ breadCrumb.label | bbbTranslate }}</span>\n}\n", styles: [""], dependencies: [{ kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -6449,7 +6452,7 @@ class BarsaUlvMainComponent extends BaseComponent {
         this.selectSearchPanelSettings.emit(selectedSearchPanelSettingsId);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaUlvMainComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: { viewerControl: "viewerControl", loading: "loading", viewerLoading: "viewerLoading", isReportPage: "isReportPage", deviceSize: "deviceSize", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", layoutInfo: "layoutInfo" }, outputs: { closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        isReportPage ? reportPageTemplate : reportTemplate;\n        context: {\n            $implicit: viewerControl,\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n        }\n    \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n    <fd-dynamic-page\n        formClose\n        mobile\n        [attr.isMobile]=\"isMobile ? true : null\"\n        [isMobile]=\"isMobile\"\n        [size]=\"deviceSize | dynamicPageSize\"\n        [attr.tabMode]=\"tabMode\"\n        [autoResponsive]=\"false\"\n        [class.notitle]=\"\n            (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n            (sideContentMode && !hideSearchPanel && !title)\n        \"\n    >\n        <fd-dynamic-page-header\n            [title]=\"\n                (title | bbbTranslate)\n                    ? (title | bbbTranslate)\n                    : isMobile && breadCrumbs.length\n                    ? breadCrumbs[breadCrumbs.length - 1].label\n                    : ''\n            \"\n            class=\"p-b0\"\n        >\n            @if (!isMobile) {\n            <fd-breadcrumb>\n                @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n                let i = $index; let last = $last) { @if (last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } } }\n            </fd-breadcrumb>\n            }\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n                <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n                <!-- added this because in mobile landscape toolbar disapper -->\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n                <fd-toolbar\n                    class=\"global-actions\"\n                    fdType=\"transparent\"\n                    [clearBorder]=\"true\"\n                    [shouldOverflow]=\"deviceSize === 's'\"\n                >\n                    @if (isAnonymous === false && canSaveGridSetting) {\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n                        <fd-popover-control>\n                            <div style=\"display: flex; align-items: center\">\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n                                    {{\n                                        selectedSearchPanelSettings?.IsStandard\n                                            ? ''\n                                            : selectedSearchPanelSettings?.Title\n                                    }}\n                                    @if (searchPanelMoChanged) {\n                                    <strong>*</strong>\n                                    }\n                                </h3>\n                                <button\n                                    fd-button\n                                    glyph=\"slim-arrow-down\"\n                                    fdType=\"transparent\"\n                                    [fdContentDensity]=\"contentDensity\"\n                                ></button>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body mobile>\n                            <div fd-popover-body-header>\n                                <div fd-bar [fdCozy]>\n                                    <div fd-bar-left>\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n                                    </div>\n                                </div>\n                            </div>\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n                                @for (option of allSearchPanelSettings; track option) {\n                                <li\n                                    fd-list-item\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n                                >\n                                    <span fd-list-title>{{ option.Title }}</span>\n                                </li>\n                                }\n                            </ul>\n                            <div fd-popover-body-footer>\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n                                    @if (selectedSearchPanelSettings) {\n                                    <div fd-bar-right>\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n                                        <fd-button-bar\n                                            [label]=\"'Save' | bbbTranslate\"\n                                            fdType=\"emphasized\"\n                                            (click)=\"onFilterSave(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                        } @if (searchPanelMoChanged) {\n                                        <fd-button-bar\n                                            [label]=\"'SaveAs' | bbbTranslate\"\n                                            [fdType]=\"\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n                                            \"\n                                            (click)=\"onFilterSaveAs(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                        }\n                                        <fd-button-bar\n                                            [label]=\"'Manage' | bbbTranslate\"\n                                            fdkInitialFocus\n                                            fdType=\"transparent\"\n                                            (click)=\"onManageFilters(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                    </div>\n                                    }\n                                </div>\n                            </div>\n                        </fd-popover-body>\n                    </fd-popover>\n                    } @if (deviceSize !== 's') {\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\n                    } @if (isMobile) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdOverflowPriority=\"never\"\n                        (click)=\"onShowSearchpanelDialog()\"\n                        [glyph]=\"'filter'\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdOverflowPriority=\"never\"\n                        fdType=\"emphasized\"\n                        [label]=\"'Search' | bbbTranslate\"\n                        (click)=\"onSearch()\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        fdOverflowPriority=\"low\"\n                        [label]=\"'Filters' | bbbTranslate\"\n                        (click)=\"onShowFilterFieldsSetting()\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        fdOverflowPriority=\"low\"\n                        [label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClearSearch()\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n                        (click)=\"onHideSearchPanelClick()\"\n                        fdOverflowPriority=\"low\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    }\n                </fd-toolbar>\n                }\n            </fd-dynamic-page-global-actions>\n            <fd-dynamic-page-layout-actions>\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n                    </button>\n                </fd-toolbar>\n            </fd-dynamic-page-layout-actions>\n        </fd-dynamic-page-header>\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n            @if (!isMobile) {\n            <bsu-search-panel\n                [hideButtons]=\"true\"\n                [searchPanelUi]=\"searchPanelUi\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n            }\n        </fd-dynamic-page-subheader>\n        } @if (!tabMode) {\n\n        <fd-dynamic-page-content>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\n                    context: { noRenderPageing: true }\n                \"\n            ></ng-container>\n        </fd-dynamic-page-content>\n\n        } @if (pagingSetting?.TotalPages) {\n        <fd-dynamic-page-footer>\n            <!-- page footer content goes here -->\n            <div fd-bar [barDesign]=\"'footer'\">\n                <div fd-bar-middle>\n                    <ng-container\n                        [renderUlvPaging]=\"context\"\n                        [pagingSetting]=\"pagingSetting\"\n                        (pageChange)=\"onPageChange($event)\"\n                    ></ng-container>\n                </div>\n            </div>\n        </fd-dynamic-page-footer>\n        }\n    </fd-dynamic-page>\n    @if (tabMode) {\n    <ng-container\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n    ></ng-container>\n    }\n</ng-template>\n<ng-template #reportTemplate>\n    @if (loading) {\n    <bsu-mask size=\"s\"></bsu-mask>\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n    }\n    <ng-container\n        *ngTemplateOutlet=\"\n            sideContentMode ? sideContentTemplate : viewerTemplate;\n            context: { simpleReport: 'simpleReport' }\n        \"\n    >\n    </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n    <fd-dynamic-side-content\n        [class.rtl]=\"rtl\"\n        [size]=\"deviceSize | sapSize\"\n        fillEmptySpace\n        [disable]=\"true\"\n        [setMinHeight]=\"true\"\n    >\n        <fd-dynamic-side-content-side>\n            <ng-container\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n            ></ng-container>\n        </fd-dynamic-side-content-side>\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n            <ng-container *ngTemplateOutlet=\"viewerTemplate\"></ng-container>\n        </fd-dynamic-side-content-main>\n    </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n    #searchpanelTemplate\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n    let-hideButtons=\"hideButtons\"\n>\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n    <bsu-search-panel\n        [searchPanelUi]=\"searchPanelUi\"\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n        [hideButtons]=\"hideButtons\"\n        (moChanged)=\"onSearchPanelMoChanged()\"\n    ></bsu-search-panel>\n    } } @else {\n    <fd-card class=\"searchpanel-card\">\n        <fd-card-header>\n            <h2 fd-card-title>\n                <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n            </h2>\n        </fd-card-header>\n        <fd-card-content style=\"flex-grow: 0\">\n            @if (!hideSearchPanel && searchPanelUi) {\n            <bsu-search-panel\n                [searchPanelUi]=\"searchPanelUi\"\n                [hideButtons]=\"true\"\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n            }\n        </fd-card-content>\n        <fd-card-footer style=\"border-bottom: none\">\n            <button\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"emphasized\"\n                [label]=\"'Search' | bbbTranslate\"\n                (click)=\"onSearch()\"\n                [fdContentDensity]=\"contentDensity\"\n            ></button>\n            <button\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n                (click)=\"onClearSearch()\"\n                [fdOverflowGroup]=\"1\"\n                [fdContentDensity]=\"contentDensity\"\n            ></button>\n        </fd-card-footer>\n    </fd-card>\n    }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n    <div\n        class=\"viewer-container\"\n        fillEmptySpace\n        [disable]=\"isReportPage || !fillPage\"\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n        [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n        [style.min-height]=\"isReportPage ? '100%' : null\"\n        [style.position]=\"viewerLoading ? 'relative' : null\"\n    >\n        @if (viewerLoading) {\n        <bsu-mask size=\"m\"></bsu-mask>\n        } @if (viewerControl) {\n        <ng-container\n            [renderUlvViewer]=\"viewerControl\"\n            [layoutInfo]=\"layoutInfo\"\n            [isReportPage]=\"isReportPage\"\n        ></ng-container>\n        }\n    </div>\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n    <ng-container\n        [renderUlvPaging]=\"context\"\n        [pagingSetting]=\"pagingSetting\"\n        (pageChange)=\"onPageChange($event)\"\n    ></ng-container>\n    }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n        </fd-dialog-header>\n        <fd-dialog-body>\n            <bsu-search-panel\n                [hideButtons]=\"true\"\n                [searchPanelUi]=\"searchPanelUi\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fdkInitialFocus\n                    fdType=\"emphasized\"\n                    (click)=\"dialog.dismiss(); onSearch()\"\n                    [label]=\"'Search' | bbbTranslate\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    (click)=\"dialog.dismiss('Close button')\"\n                    [label]=\"'Cancel' | bbbTranslate\"\n                ></button>\n            </fd-dialog-footer-button>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBaseColor);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i5$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: { viewerControl: "viewerControl", loading: "loading", viewerLoading: "viewerLoading", isReportPage: "isReportPage", deviceSize: "deviceSize", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", layoutInfo: "layoutInfo" }, outputs: { closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        isReportPage ? reportPageTemplate : reportTemplate;\n        context: {\n            $implicit: viewerControl,\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n        }\n    \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n    <fd-dynamic-page\n        formClose\n        mobile\n        [attr.isMobile]=\"isMobile ? true : null\"\n        [isMobile]=\"isMobile\"\n        [size]=\"deviceSize | dynamicPageSize\"\n        [attr.tabMode]=\"tabMode\"\n        [autoResponsive]=\"false\"\n        [class.notitle]=\"\n            (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n            (sideContentMode && !hideSearchPanel && !title)\n        \"\n    >\n        <fd-dynamic-page-header\n            [title]=\"\n                (title | bbbTranslate)\n                    ? (title | bbbTranslate)\n                    : isMobile && breadCrumbs.length\n                    ? breadCrumbs[breadCrumbs.length - 1].label\n                    : ''\n            \"\n            class=\"p-b0\"\n        >\n            @if (!isMobile) {\n            <fd-breadcrumb>\n                @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n                let i = $index; let last = $last) { @if (last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } } }\n            </fd-breadcrumb>\n            }\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n                <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n                <!-- added this because in mobile landscape toolbar disapper -->\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n                <fd-toolbar\n                    class=\"global-actions\"\n                    fdType=\"transparent\"\n                    [clearBorder]=\"true\"\n                    [shouldOverflow]=\"deviceSize === 's'\"\n                >\n                    @if (isAnonymous === false && canSaveGridSetting) {\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n                        <fd-popover-control>\n                            <div style=\"display: flex; align-items: center\">\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n                                    {{\n                                        selectedSearchPanelSettings?.IsStandard\n                                            ? ''\n                                            : selectedSearchPanelSettings?.Title\n                                    }}\n                                    @if (searchPanelMoChanged) {\n                                    <strong>*</strong>\n                                    }\n                                </h3>\n                                <button\n                                    fd-button\n                                    glyph=\"slim-arrow-down\"\n                                    fdType=\"transparent\"\n                                    [fdContentDensity]=\"contentDensity\"\n                                ></button>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body mobile>\n                            <div fd-popover-body-header>\n                                <div fd-bar [fdCozy]>\n                                    <div fd-bar-left>\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n                                    </div>\n                                </div>\n                            </div>\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n                                @for (option of allSearchPanelSettings; track option) {\n                                <li\n                                    fd-list-item\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n                                >\n                                    <span fd-list-title>{{ option.Title }}</span>\n                                </li>\n                                }\n                            </ul>\n                            <div fd-popover-body-footer>\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n                                    @if (selectedSearchPanelSettings) {\n                                    <div fd-bar-right>\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n                                        <fd-button-bar\n                                            [label]=\"'Save' | bbbTranslate\"\n                                            fdType=\"emphasized\"\n                                            (click)=\"onFilterSave(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                        } @if (searchPanelMoChanged) {\n                                        <fd-button-bar\n                                            [label]=\"'SaveAs' | bbbTranslate\"\n                                            [fdType]=\"\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n                                            \"\n                                            (click)=\"onFilterSaveAs(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                        }\n                                        <fd-button-bar\n                                            [label]=\"'Manage' | bbbTranslate\"\n                                            fdkInitialFocus\n                                            fdType=\"transparent\"\n                                            (click)=\"onManageFilters(popover)\"\n                                        >\n                                        </fd-button-bar>\n                                    </div>\n                                    }\n                                </div>\n                            </div>\n                        </fd-popover-body>\n                    </fd-popover>\n                    } @if (deviceSize !== 's') {\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\n                    } @if (isMobile) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdOverflowPriority=\"never\"\n                        (click)=\"onShowSearchpanelDialog()\"\n                        [glyph]=\"'filter'\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdOverflowPriority=\"never\"\n                        fdType=\"emphasized\"\n                        [label]=\"'Search' | bbbTranslate\"\n                        (click)=\"onSearch()\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        fdOverflowPriority=\"low\"\n                        [label]=\"'Filters' | bbbTranslate\"\n                        (click)=\"onShowFilterFieldsSetting()\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        fdOverflowPriority=\"low\"\n                        [label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClearSearch()\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    } @if (!isMobile && !sideContentMode) {\n                    <button\n                        fd-button\n                        fd-toolbar-item\n                        fdType=\"transparent\"\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n                        (click)=\"onHideSearchPanelClick()\"\n                        fdOverflowPriority=\"low\"\n                        [fdOverflowGroup]=\"1\"\n                        [fdContentDensity]=\"contentDensity\"\n                    ></button>\n                    }\n                </fd-toolbar>\n                }\n            </fd-dynamic-page-global-actions>\n            <fd-dynamic-page-layout-actions>\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n                    </button>\n                </fd-toolbar>\n            </fd-dynamic-page-layout-actions>\n        </fd-dynamic-page-header>\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n            @if (!isMobile) {\n            <bsu-search-panel\n                [hideButtons]=\"true\"\n                [searchPanelUi]=\"searchPanelUi\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n            }\n        </fd-dynamic-page-subheader>\n        } @if (!tabMode) {\n\n        <fd-dynamic-page-content>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\n                    context: { noRenderPageing: true }\n                \"\n            ></ng-container>\n        </fd-dynamic-page-content>\n\n        } @if (pagingSetting?.TotalPages) {\n        <fd-dynamic-page-footer>\n            <!-- page footer content goes here -->\n            <div fd-bar [barDesign]=\"'footer'\">\n                <div fd-bar-middle>\n                    <ng-container\n                        [renderUlvPaging]=\"context\"\n                        [pagingSetting]=\"pagingSetting\"\n                        (pageChange)=\"onPageChange($event)\"\n                    ></ng-container>\n                </div>\n            </div>\n        </fd-dynamic-page-footer>\n        }\n    </fd-dynamic-page>\n    @if (tabMode) {\n    <ng-container\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n    ></ng-container>\n    }\n</ng-template>\n<ng-template #reportTemplate>\n    @if (loading) {\n    <bsu-mask size=\"s\"></bsu-mask>\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n    }\n    <ng-container\n        *ngTemplateOutlet=\"\n            sideContentMode ? sideContentTemplate : viewerTemplate;\n            context: { simpleReport: 'simpleReport' }\n        \"\n    >\n    </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n    <fd-dynamic-side-content\n        [class.rtl]=\"rtl\"\n        [size]=\"deviceSize | sapSize\"\n        fillEmptySpace\n        [disable]=\"true\"\n        [setMinHeight]=\"true\"\n    >\n        <fd-dynamic-side-content-side>\n            <ng-container\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n            ></ng-container>\n        </fd-dynamic-side-content-side>\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n            <ng-container *ngTemplateOutlet=\"viewerTemplate\"></ng-container>\n        </fd-dynamic-side-content-main>\n    </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n    #searchpanelTemplate\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n    let-hideButtons=\"hideButtons\"\n>\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n    <bsu-search-panel\n        [searchPanelUi]=\"searchPanelUi\"\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n        [hideButtons]=\"hideButtons\"\n        (moChanged)=\"onSearchPanelMoChanged()\"\n    ></bsu-search-panel>\n    } } @else {\n    <fd-card class=\"searchpanel-card\">\n        <fd-card-header>\n            <h2 fd-card-title>\n                <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n            </h2>\n        </fd-card-header>\n        <fd-card-content style=\"flex-grow: 0\">\n            @if (!hideSearchPanel && searchPanelUi) {\n            <bsu-search-panel\n                [searchPanelUi]=\"searchPanelUi\"\n                [hideButtons]=\"true\"\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n            }\n        </fd-card-content>\n        <fd-card-footer style=\"border-bottom: none\">\n            <button\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"emphasized\"\n                [label]=\"'Search' | bbbTranslate\"\n                (click)=\"onSearch()\"\n                [fdContentDensity]=\"contentDensity\"\n            ></button>\n            <button\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n                (click)=\"onClearSearch()\"\n                [fdOverflowGroup]=\"1\"\n                [fdContentDensity]=\"contentDensity\"\n            ></button>\n        </fd-card-footer>\n    </fd-card>\n    }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n    <div\n        class=\"viewer-container\"\n        fillEmptySpace\n        [disable]=\"isReportPage || !fillPage\"\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n        [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n        [style.min-height]=\"isReportPage ? '100%' : null\"\n        [style.position]=\"viewerLoading ? 'relative' : null\"\n    >\n        @if (viewerLoading) {\n        <bsu-mask size=\"m\"></bsu-mask>\n        } @if (viewerControl) {\n        <ng-container\n            [renderUlvViewer]=\"viewerControl\"\n            [layoutInfo]=\"layoutInfo\"\n            [isReportPage]=\"isReportPage\"\n        ></ng-container>\n        }\n    </div>\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n    <ng-container\n        [renderUlvPaging]=\"context\"\n        [pagingSetting]=\"pagingSetting\"\n        (pageChange)=\"onPageChange($event)\"\n    ></ng-container>\n    }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n        </fd-dialog-header>\n        <fd-dialog-body>\n            <bsu-search-panel\n                [hideButtons]=\"true\"\n                [searchPanelUi]=\"searchPanelUi\"\n                (moChanged)=\"onSearchPanelMoChanged()\"\n            ></bsu-search-panel>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fdkInitialFocus\n                    fdType=\"emphasized\"\n                    (click)=\"dialog.dismiss(); onSearch()\"\n                    [label]=\"'Search' | bbbTranslate\"\n                ></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n            </fd-dialog-footer-button>\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    (click)=\"dialog.dismiss('Close button')\"\n                    [label]=\"'Cancel' | bbbTranslate\"\n                ></button>\n            </fd-dialog-footer-button>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBaseColor);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i5$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaUlvMainComponent, decorators: [{
             type: Component,
@@ -6842,7 +6845,7 @@ class UiColorUiComponent extends FieldBaseComponent {
         this.selectedColor = $event;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiColorUiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiColorUiComponent, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "@if (readonly$ | async) {\n<div class=\"read-only\">\n    <div [style.background-color]=\"value ? value : null\"></div>\n    <span>{{ value }}</span>\n    <button\n        fd-button\n        [cdkCopyToClipboard]=\"value\"\n        [fdType]=\"'transparent'\"\n        [glyph]=\"'copy'\"\n        aria-label=\"copy\"\n        title=\"copy\"\n    ></button>\n</div>\n} @else {\n<fd-popover #popover>\n    <fd-popover-control style=\"margin: 0.25rem 0\">\n        <button fd-button [fdMenu]=\"true\" fdType=\"transparent\">\n            <span [style.background-color]=\"value\" style=\"width: 16px; height: 16px; border-radius: 50%\"></span>\n        </button>\n    </fd-popover-control>\n    <fd-popover-body>\n        @if (!isVisibleSwatches) {\n        <color-chrome [color]=\"value\" className=\"color-box\" (colorChange)=\"onColorChang($event)\"></color-chrome>\n        } @if (isVisibleSwatches) {\n        <color-swatches [color]=\"value\" (colorChange)=\"onColorChang($event)\"></color-swatches>\n        }\n        <fd-toolbar style=\"background-color: white\">\n            <button\n                fd-toolbar-item\n                fd-button\n                [label]=\"'Cancel' | bbbTranslate\"\n                (click)=\"onCancel(popover)\"\n                [compact]=\"true\"\n            ></button>\n            <button\n                fd-toolbar-item\n                fd-button\n                [label]=\"'Ok' | bbbTranslate\"\n                (click)=\"onApply(popover)\"\n                [compact]=\"true\"\n            ></button>\n            <fd-toolbar-spacer></fd-toolbar-spacer>\n            <button fd-toolbar-item fd-button [label]=\"switchText\" (click)=\"onSwatchClick()\" [compact]=\"true\"></button>\n        </fd-toolbar>\n    </fd-popover-body>\n</fd-popover>\n}\n", styles: [":host{display:block;margin:.25rem 0}.read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$3.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i5$5.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i6$3.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiColorUiComponent, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "@if (readonly$ | async) {\n<div class=\"read-only\">\n    <div [style.background-color]=\"value ? value : null\"></div>\n    <span>{{ value }}</span>\n    <button\n        fd-button\n        [cdkCopyToClipboard]=\"value\"\n        [fdType]=\"'transparent'\"\n        [glyph]=\"'copy'\"\n        aria-label=\"copy\"\n        title=\"copy\"\n    ></button>\n</div>\n} @else {\n<fd-popover #popover>\n    <fd-popover-control style=\"margin: 0.25rem 0\">\n        <button fd-button [fdMenu]=\"true\" fdType=\"transparent\">\n            <span [style.background-color]=\"value\" style=\"width: 16px; height: 16px; border-radius: 50%\"></span>\n        </button>\n    </fd-popover-control>\n    <fd-popover-body>\n        @if (!isVisibleSwatches) {\n        <color-chrome [color]=\"value\" className=\"color-box\" (colorChange)=\"onColorChang($event)\"></color-chrome>\n        } @if (isVisibleSwatches) {\n        <color-swatches [color]=\"value\" (colorChange)=\"onColorChang($event)\"></color-swatches>\n        }\n        <fd-toolbar style=\"background-color: white\">\n            <button\n                fd-toolbar-item\n                fd-button\n                [label]=\"'Cancel' | bbbTranslate\"\n                (click)=\"onCancel(popover)\"\n                [compact]=\"true\"\n            ></button>\n            <button\n                fd-toolbar-item\n                fd-button\n                [label]=\"'Ok' | bbbTranslate\"\n                (click)=\"onApply(popover)\"\n                [compact]=\"true\"\n            ></button>\n            <fd-toolbar-spacer></fd-toolbar-spacer>\n            <button fd-toolbar-item fd-button [label]=\"switchText\" (click)=\"onSwatchClick()\" [compact]=\"true\"></button>\n        </fd-toolbar>\n    </fd-popover-body>\n</fd-popover>\n}\n", styles: [":host{display:block;margin:.25rem 0}.read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$3.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i5$5.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i6$3.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiColorUiComponent, decorators: [{
             type: Component,
@@ -7681,7 +7684,7 @@ class UiPdfViewerComponent extends DeviceInfoFieldBaseComponent {
         BarsaApi.Ul.LoadingMask.Mask(this._el.nativeElement);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPdfViewerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPdfViewerComponent, selector: "bsu-ui-pdf-viewer", host: { properties: { "style.min-height": "this._minheight" } }, providers: [UploadService], viewQueries: [{ propertyName: "_pdfViewerOnDemand", first: true, predicate: ["pdfViewerOnDemand"], descendants: true }, { propertyName: "_dialogTpl", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\n    @switch (parameters?.ShowMode) { @case ('2') {\n    <div>\n        <ng-container *ngTemplateOutlet=\"toolbar; context: { dialogMode: true }\"></ng-container>\n    </div>\n    } @default {\n    <div>\n        <ng-container *ngTemplateOutlet=\"toolbar\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\n    </div>\n    } }\n</ng-container>\n\n<ng-template #toolbar let-dialogMode=\"dialogMode\">\n    @if ((disableOrReadonly$ | async) !== true) {\n    <fd-toolbar [class.dialogMode]=\"dialogMode\" [transparent]=\"true\" [shouldOverflow]=\"true\">\n        <fd-file-uploader\n            #uploader\n            [style.display]=\"'none'\"\n            fd-toolbar-item\n            [id]=\"id\"\n            [name]=\"'pdf_' + id\"\n            [placeholder]=\"'AttachFile' | bbbTranslate\"\n            [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n            [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n            [accept]=\"validExtension\"\n            [(ngModel)]=\"files\"\n            [multiple]=\"false\"\n            (selectedFilesChanged)=\"onFileSelection($event)\"\n            [contentDensity]=\"(contentDensity$ | async)!!\"\n        ></fd-file-uploader>\n        @if (!parameters?.HideDelete) {\n        <button\n            [disabled]=\"!(canDelete && value)\"\n            fd-button\n            fd-toolbar-item\n            class=\"delete\"\n            glyph=\"delete\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onDelete()\"\n        ></button>\n        } @if (!parameters?.HideAttach) {\n        <button\n            fd-button\n            fd-toolbar-item\n            glyph=\"attachment\"\n            [fdType]=\"'transparent'\"\n            [disabled]=\"!canUpload\"\n            (click)=\"uploader.open()\"\n        ></button>\n        } @if (canEdit) {\n        <button fd-toolbar-item fd-button glyph=\"edit\" [fdType]=\"'transparent'\" (click)=\"onEdit()\"></button>\n        } @if (useWordEditor) {\n        <button\n            fd-toolbar-item\n            fd-button\n            glyph=\"doc-attachment\"\n            [fdType]=\"'transparent'\"\n            [label]=\"'Edit' | bbbTranslate\"\n            (click)=\"onEditInWord()\"\n        ></button>\n        } @if (officeOnline) {\n        <button\n            fd-toolbar-item\n            fd-button\n            glyph=\"doc-attachment\"\n            [fdType]=\"'transparent'\"\n            [label]=\"'OfficeOnline' | bbbTranslate\"\n            (click)=\"onOfficeOnline($event)\"\n        ></button>\n        } @if (dialogMode) {\n        <button\n            fd-toolbar-item\n            fd-button\n            [glyph]=\"'show'\"\n            [attr.fdOverflowPriority]=\"'low'\"\n            [fdType]=\"'transparent'\"\n            [label]=\"!dialogMode ? '' : ('View' | bbbTranslate)\"\n            (click)=\"onOpenPreviewInDialog()\"\n            bodyClick\n        ></button>\n        } @if (canDownload) {\n        <button\n            fd-toolbar-item\n            fd-button\n            [attr.fdOverflowPriority]=\"'low'\"\n            [glyph]=\"'download'\"\n            [label]=\"!dialogMode ? '' : ('Download' | bbbTranslate)\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onDownload()\"\n            bodyClick\n        ></button>\n        } @if (!parameters?.HideRefresh) {\n        <button\n            [attr.fdOverflowPriority]=\"'low'\"\n            fd-toolbar-item\n            fd-button\n            [glyph]=\"dialogMode ? null : 'refresh'\"\n            [label]=\"!dialogMode ? '' : ('Refresh' | bbbTranslate)\"\n            [fdType]=\"'transparent'\"\n            bodyClick\n            (click)=\"onRefresh()\"\n        ></button>\n        }\n        <fd-busy-indicator\n            fd-toolbar-item\n            [loading]=\"(uploadingState$ | async)?.uploading === true\"\n        ></fd-busy-indicator>\n    </fd-toolbar>\n    }\n</ng-template>\n<ng-template #preview>\n    @if (isMobile) {\n    <div\n        [style.border]=\"!blobUrl ? '.0625rem solid var(--sapGroup_TitleBorderColor)' : null\"\n        style=\"height: calc(70vh - 40px); position: relative\"\n    >\n        <ng2-pdfjs-viewer\n            fillEmptySpace\n            [containerDom]=\"formContainer\"\n            [dontUseTopBound]=\"true\"\n            #pdfViewerOnDemand\n            [externalWindow]=\"false\"\n            [downloadFileName]=\"blobUrl\"\n            [openFile]=\"false\"\n            [viewBookmark]=\"false\"\n            [showSpinner]=\"true\"\n            [download]=\"true\"\n        ></ng2-pdfjs-viewer>\n    </div>\n    } @else { @if (hasPdf) {\n    <object\n        fillEmptySpace\n        [containerDom]=\"formContainer\"\n        [dontUseTopBound]=\"true\"\n        style=\"flex-grow: 1\"\n        [attr.data]=\"valueUrl\"\n        type=\"application/pdf\"\n        width=\"100%\"\n        [style.height]=\"formHeight - 30 > 0 ? formHeight - 30 + 'px' : '100vh'\"\n        [attr.html]=\"fallbackLink\"\n    ></object>\n    } @else { @if (singleControl && value && !value.IsDeleted) {\n    <div style=\"display: flex\">\n        @if (singleFileThumbnailUrl) {\n        <img [src]=\"singleFileThumbnailUrl\" />\n        }\n        <fd-object-identifier>\n            {{ value.FileName }}\n        </fd-object-identifier>\n    </div>\n    } @else {\n    <div fillEmptySpace [containerDom]=\"formContainer\" [dontUseTopBound]=\"true\" class=\"hatchBackground\"></div>\n    } } }\n</ng-template>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTpl>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" class=\"vertical\">\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h3 fd-title>edit in word</h3>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDialogClose()\"></fd-button-bar>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}:host fd-toolbar.dialogMode ::ng-deep .fd-toolbar{border-bottom:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}:host ::ng-deep .fd-file-uploader input{display:none}.single-control{height:50px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i11$1.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i3$2.PdfJsViewerComponent, selector: "ng2-pdfjs-viewer", inputs: ["viewerId", "viewerFolder", "externalWindow", "target", "showSpinner", "downloadFileName", "openFile", "download", "startDownload", "viewBookmark", "print", "startPrint", "fullScreen", "find", "zoom", "nameddest", "pagemode", "lastPage", "rotatecw", "rotateccw", "cursor", "scroll", "spread", "locale", "useOnlyCssZoom", "errorOverride", "errorAppend", "errorMessage", "diagnosticLogs", "externalWindowOptions", "page", "pdfSrc"], outputs: ["onBeforePrint", "onAfterPrint", "onDocumentLoad", "onPageChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPdfViewerComponent, selector: "bsu-ui-pdf-viewer", host: { properties: { "style.min-height": "this._minheight" } }, providers: [UploadService], viewQueries: [{ propertyName: "_pdfViewerOnDemand", first: true, predicate: ["pdfViewerOnDemand"], descendants: true }, { propertyName: "_dialogTpl", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\n    @switch (parameters?.ShowMode) { @case ('2') {\n    <div>\n        <ng-container *ngTemplateOutlet=\"toolbar; context: { dialogMode: true }\"></ng-container>\n    </div>\n    } @default {\n    <div>\n        <ng-container *ngTemplateOutlet=\"toolbar\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\n    </div>\n    } }\n</ng-container>\n\n<ng-template #toolbar let-dialogMode=\"dialogMode\">\n    @if ((disableOrReadonly$ | async) !== true) {\n    <fd-toolbar [class.dialogMode]=\"dialogMode\" [transparent]=\"true\" [shouldOverflow]=\"true\">\n        <fd-file-uploader\n            #uploader\n            [style.display]=\"'none'\"\n            fd-toolbar-item\n            [id]=\"id\"\n            [name]=\"'pdf_' + id\"\n            [placeholder]=\"'AttachFile' | bbbTranslate\"\n            [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n            [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n            [accept]=\"validExtension\"\n            [(ngModel)]=\"files\"\n            [multiple]=\"false\"\n            (selectedFilesChanged)=\"onFileSelection($event)\"\n            [contentDensity]=\"(contentDensity$ | async)!!\"\n        ></fd-file-uploader>\n        @if (!parameters?.HideDelete) {\n        <button\n            [disabled]=\"!(canDelete && value)\"\n            fd-button\n            fd-toolbar-item\n            class=\"delete\"\n            glyph=\"delete\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onDelete()\"\n        ></button>\n        } @if (!parameters?.HideAttach) {\n        <button\n            fd-button\n            fd-toolbar-item\n            glyph=\"attachment\"\n            [fdType]=\"'transparent'\"\n            [disabled]=\"!canUpload\"\n            (click)=\"uploader.open()\"\n        ></button>\n        } @if (canEdit) {\n        <button fd-toolbar-item fd-button glyph=\"edit\" [fdType]=\"'transparent'\" (click)=\"onEdit()\"></button>\n        } @if (useWordEditor) {\n        <button\n            fd-toolbar-item\n            fd-button\n            glyph=\"doc-attachment\"\n            [fdType]=\"'transparent'\"\n            [label]=\"'Edit' | bbbTranslate\"\n            (click)=\"onEditInWord()\"\n        ></button>\n        } @if (officeOnline) {\n        <button\n            fd-toolbar-item\n            fd-button\n            glyph=\"doc-attachment\"\n            [fdType]=\"'transparent'\"\n            [label]=\"'OfficeOnline' | bbbTranslate\"\n            (click)=\"onOfficeOnline($event)\"\n        ></button>\n        } @if (dialogMode) {\n        <button\n            fd-toolbar-item\n            fd-button\n            [glyph]=\"'show'\"\n            [attr.fdOverflowPriority]=\"'low'\"\n            [fdType]=\"'transparent'\"\n            [label]=\"!dialogMode ? '' : ('View' | bbbTranslate)\"\n            (click)=\"onOpenPreviewInDialog()\"\n            bodyClick\n        ></button>\n        } @if (canDownload) {\n        <button\n            fd-toolbar-item\n            fd-button\n            [attr.fdOverflowPriority]=\"'low'\"\n            [glyph]=\"'download'\"\n            [label]=\"!dialogMode ? '' : ('Download' | bbbTranslate)\"\n            [fdType]=\"'transparent'\"\n            (click)=\"onDownload()\"\n            bodyClick\n        ></button>\n        } @if (!parameters?.HideRefresh) {\n        <button\n            [attr.fdOverflowPriority]=\"'low'\"\n            fd-toolbar-item\n            fd-button\n            [glyph]=\"dialogMode ? null : 'refresh'\"\n            [label]=\"!dialogMode ? '' : ('Refresh' | bbbTranslate)\"\n            [fdType]=\"'transparent'\"\n            bodyClick\n            (click)=\"onRefresh()\"\n        ></button>\n        }\n        <fd-busy-indicator\n            fd-toolbar-item\n            [loading]=\"(uploadingState$ | async)?.uploading === true\"\n        ></fd-busy-indicator>\n    </fd-toolbar>\n    }\n</ng-template>\n<ng-template #preview>\n    @if (isMobile) {\n    <div\n        [style.border]=\"!blobUrl ? '.0625rem solid var(--sapGroup_TitleBorderColor)' : null\"\n        style=\"height: calc(70vh - 40px); position: relative\"\n    >\n        <ng2-pdfjs-viewer\n            fillEmptySpace\n            [containerDom]=\"formContainer\"\n            [dontUseTopBound]=\"true\"\n            #pdfViewerOnDemand\n            [externalWindow]=\"false\"\n            [downloadFileName]=\"blobUrl\"\n            [openFile]=\"false\"\n            [viewBookmark]=\"false\"\n            [showSpinner]=\"true\"\n            [download]=\"true\"\n        ></ng2-pdfjs-viewer>\n    </div>\n    } @else { @if (hasPdf) {\n    <object\n        fillEmptySpace\n        [containerDom]=\"formContainer\"\n        [dontUseTopBound]=\"true\"\n        style=\"flex-grow: 1\"\n        [attr.data]=\"valueUrl\"\n        type=\"application/pdf\"\n        width=\"100%\"\n        [style.height]=\"formHeight - 30 > 0 ? formHeight - 30 + 'px' : '100vh'\"\n        [attr.html]=\"fallbackLink\"\n    ></object>\n    } @else { @if (singleControl && value && !value.IsDeleted) {\n    <div style=\"display: flex\">\n        @if (singleFileThumbnailUrl) {\n        <img [src]=\"singleFileThumbnailUrl\" />\n        }\n        <fd-object-identifier>\n            {{ value.FileName }}\n        </fd-object-identifier>\n    </div>\n    } @else {\n    <div fillEmptySpace [containerDom]=\"formContainer\" [dontUseTopBound]=\"true\" class=\"hatchBackground\"></div>\n    } } }\n</ng-template>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTpl>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" class=\"vertical\">\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h3 fd-title>edit in word</h3>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDialogClose()\"></fd-button-bar>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}:host fd-toolbar.dialogMode ::ng-deep .fd-toolbar{border-bottom:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}:host ::ng-deep .fd-file-uploader input{display:none}.single-control{height:50px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i11$1.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i3$2.PdfJsViewerComponent, selector: "ng2-pdfjs-viewer", inputs: ["viewerId", "viewerFolder", "externalWindow", "target", "showSpinner", "downloadFileName", "openFile", "download", "startDownload", "viewBookmark", "print", "startPrint", "fullScreen", "find", "zoom", "nameddest", "pagemode", "lastPage", "rotatecw", "rotateccw", "cursor", "scroll", "spread", "locale", "useOnlyCssZoom", "errorOverride", "errorAppend", "errorMessage", "diagnosticLogs", "externalWindowOptions", "page", "pdfSrc"], outputs: ["onBeforePrint", "onAfterPrint", "onDocumentLoad", "onPageChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPdfViewerComponent, decorators: [{
             type: Component,
@@ -7813,7 +7816,7 @@ class UiFileLinearListBoxComponent extends DeviceInfoFieldBaseComponent {
         this._fileCountSource.next(value.filter((c) => !c.IsDeleted).length);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiFileLinearListBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiFileLinearListBoxComponent, selector: "bsu-ui-file-linear-list-box", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "fileUploadComponent", first: true, predicate: FileUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (value) {\n<div class=\"token-container\">\n    <div class=\"token-wrapper\">\n        @for (file of value; track trackById($index, file)) { @if (!file.IsDeleted) {\n        <fd-popover>\n            <fd-popover-control>\n                <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\n                    >{{ file.FileName }}\n                    @if (file.IsNew) { @if (valueExtra$ | async; as valueExtra) { @if (valueExtra[file.Id].UploadState\n                    !== 'Complete') {\n                    <span\n                        fd-object-status\n                        [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                        [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                        [title]=\"valueExtra[file.Id]?.UploadState\"\n                        [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                    ></span>\n                    } @if (valueExtra[file.Id].Progress) {\n                    <fd-object-number\n                        [number]=\"valueExtra[file.Id].Progress || 0\"\n                        unit=\"%\"\n                        status=\"informative\"\n                    ></fd-object-number>\n                    } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\n                    } } }\n                </fd-token>\n            </fd-popover-control>\n            <fd-popover-body>\n                @if (valueExtra$ | async; as valueExtra) { @if ( valueExtra[file.Id].UploadState !== 'Error' ||\n                valueExtra[file.Id].UploadState === 'Complete' ) {\n                <ul fd-list>\n                    <li fd-list-item>\n                        <a fd-list-link (click)=\"onDownloadFile(file)\">\n                            <i fd-list-icon glyph=\"download\"></i>\n                            <span fd-list-title>\n                                {{ 'Download' | bbbTranslate }}\n                            </span>\n                            <fd-busy-indicator [loading]=\"fileDownloading\" [size]=\"'s'\"></fd-busy-indicator>\n                        </a>\n                    </li>\n                </ul>\n                } }\n            </fd-popover-body>\n        </fd-popover>\n        } }\n        <div style=\"display: flex\">\n            @if (loading) {\n            <div style=\"position: relative; width: 3rem\">\n                <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\n            </div>\n            } @if (value | canUploadFile: maxFileCount:(disable$ | async)!!:(readonly$ | async)!!) {\n            <fd-file-uploader\n                class=\"file-linear-upload\"\n                fd-toolbar-item\n                [id]=\"id\"\n                [name]=\"'linear_' + id\"\n                [placeholder]=\"'AttachFile' | bbbTranslate\"\n                [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n                [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n                [accept]=\"validExtension\"\n                [multiple]=\"maxFileCount > 1 || Setting.IsMultiSelect\"\n                (selectedFilesChanged)=\"onFileSelection($event)\"\n                [contentDensity]=\"(contentDensity$ | async)!!\"\n            ></fd-file-uploader>\n            }\n        </div>\n    </div>\n</div>\n}\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host.isMobile ::ng-deep fd-token>span{-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-wrap;height:auto;text-align:right}:host.isMobile ::ng-deep body[dir=ltr] fd-token>span{text-align:left}.token-container{background:transparent;padding:3px;display:flex}.token-wrapper{align-items:center;flex-grow:1;display:flex;flex-wrap:wrap}.token-wrapper fd-token,.token-wrapper .file-linear-upload{padding:4px}\n"], dependencies: [{ kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i7.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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CanUploadFilePipe, name: "canUploadFile" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiFileLinearListBoxComponent, selector: "bsu-ui-file-linear-list-box", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "fileUploadComponent", first: true, predicate: FileUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (value) {\n<div class=\"token-container\">\n    <div class=\"token-wrapper\">\n        @for (file of value; track trackById($index, file)) { @if (!file.IsDeleted) {\n        <fd-popover>\n            <fd-popover-control>\n                <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\n                    >{{ file.FileName }}\n                    @if (file.IsNew) { @if (valueExtra$ | async; as valueExtra) { @if (valueExtra[file.Id].UploadState\n                    !== 'Complete') {\n                    <span\n                        fd-object-status\n                        [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                        [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                        [title]=\"valueExtra[file.Id]?.UploadState\"\n                        [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                    ></span>\n                    } @if (valueExtra[file.Id].Progress) {\n                    <fd-object-number\n                        [number]=\"valueExtra[file.Id].Progress || 0\"\n                        unit=\"%\"\n                        status=\"informative\"\n                    ></fd-object-number>\n                    } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\n                    } } }\n                </fd-token>\n            </fd-popover-control>\n            <fd-popover-body>\n                @if (valueExtra$ | async; as valueExtra) { @if ( valueExtra[file.Id].UploadState !== 'Error' ||\n                valueExtra[file.Id].UploadState === 'Complete' ) {\n                <ul fd-list>\n                    <li fd-list-item>\n                        <a fd-list-link (click)=\"onDownloadFile(file)\">\n                            <i fd-list-icon glyph=\"download\"></i>\n                            <span fd-list-title>\n                                {{ 'Download' | bbbTranslate }}\n                            </span>\n                            <fd-busy-indicator [loading]=\"fileDownloading\" [size]=\"'s'\"></fd-busy-indicator>\n                        </a>\n                    </li>\n                </ul>\n                } }\n            </fd-popover-body>\n        </fd-popover>\n        } }\n        <div style=\"display: flex\">\n            @if (loading) {\n            <div style=\"position: relative; width: 3rem\">\n                <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\n            </div>\n            } @if (value | canUploadFile: maxFileCount:(disable$ | async)!!:(readonly$ | async)!!) {\n            <fd-file-uploader\n                class=\"file-linear-upload\"\n                fd-toolbar-item\n                [id]=\"id\"\n                [name]=\"'linear_' + id\"\n                [placeholder]=\"'AttachFile' | bbbTranslate\"\n                [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n                [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n                [accept]=\"validExtension\"\n                [multiple]=\"maxFileCount > 1 || Setting.IsMultiSelect\"\n                (selectedFilesChanged)=\"onFileSelection($event)\"\n                [contentDensity]=\"(contentDensity$ | async)!!\"\n            ></fd-file-uploader>\n            }\n        </div>\n    </div>\n</div>\n}\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host.isMobile ::ng-deep fd-token>span{-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-wrap;height:auto;text-align:right}:host.isMobile ::ng-deep body[dir=ltr] fd-token>span{text-align:left}.token-container{background:transparent;padding:3px;display:flex}.token-wrapper{align-items:center;flex-grow:1;display:flex;flex-wrap:wrap}.token-wrapper fd-token,.token-wrapper .file-linear-upload{padding:4px}\n"], dependencies: [{ kind: "component", type: i1$5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i7.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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CanUploadFilePipe, name: "canUploadFile" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiFileLinearListBoxComponent, decorators: [{
             type: Component,
@@ -7839,7 +7842,7 @@ class BarsaListFileLinearComponent extends UiFileLinearListBoxComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaListFileLinearComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaListFileLinearComponent, selector: "bsu-barsa-list-file-linear", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "@if (parameters.ModeValue === '1') {\n<ul fd-list class=\"file-viewer-attachments\">\n    @for (file of value; track file) { @if (!file.IsDeleted) {\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\n        @if (file.inEdit) {\n        <input\n            style=\"width: 90%\"\n            fd-form-control\n            [(ngModel)]=\"file.FileName\"\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\n            (keydown.enter)=\"onHandleRenameFile(file)\"\n        />\n        } @if (!file.inEdit) {\n        <span fd-list-title>\n            {{ file.FileName }}\n        </span>\n        }\n        <span fd-list-secondary>\n            <button\n                ariaLabel=\"Edit Or Save\"\n                fdType=\"transparent\"\n                class=\"fd-button--compact\"\n                fd-button\n                fdCompact\n                [glyph]=\"file.inEdit ? 'save' : 'edit'\"\n                (click)=\"onHandleRenameFile(file)\"\n            ></button>\n            @if (!file.inEdit) {\n            <button\n                ariaLabel=\"Remove\"\n                fdType=\"transparent\"\n                title=\"Remove\"\n                fd-button\n                glyph=\"delete\"\n                (click)=\"onFileDeleted(file.Id)\"\n            ></button>\n            }\n        </span>\n    </li>\n    } } @if (valueExtra$ | async; as valueExtra) { @for (file of valueExtra | keyvalue; track file) { @if\n    (file.value.UploadState === 'Uploading') {\n    <li style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\n        @if (file.value.Progress) {\n        <fd-progress-indicator state=\"informative\" [valueNow]=\"file.value.Progress\"></fd-progress-indicator>\n        }\n    </li>\n    } } }\n</ul>\n} @if (parameters.ModeValue === '2') {\n<ul fd-list [byline]=\"true\">\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\n    <li fd-list-item>\n        <div fd-list-content style=\"text-align: center\">\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\n        </div>\n    </li>\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\n    <li fd-list-item>\n        <span fd-list-thumbnail>\n            @if (valueExtra[file.Id].IsIcon) {\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\n            } @else {\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\n            }\n        </span>\n        <!-- for byline, fd-list-content is mandatory -->\n        <div fd-list-content>\n            <div fd-list-title>{{ file.FileName }}</div>\n            <div fd-list-byline [twoCol]=\"true\">\n                <div fd-list-byline-left></div>\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                        @if (file.IsNew) {\n                        <span\n                            fd-toolbar-item\n                            fd-object-status\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                        ></span>\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                        <fd-slider\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\n                            [name]=\"'filerLinear_' + id\"\n                            fd-toolbar-item\n                            [id]=\"id\"\n                            [min]=\"0\"\n                            [max]=\"100\"\n                            [step]=\"1\"\n                        >\n                        </fd-slider>\n                        } }\n                    </fd-toolbar>\n                </div>\n            </div>\n        </div>\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\n        }\n    </li>\n    } } }\n</ul>\n} @if ((disableOrReadonly$ | async) !== true) {\n<fd-toolbar\n    style=\"display: block\"\n    [style.height.px]=\"parameters.ModeValue === '1' ? 0 : null\"\n    [fdType]=\"'transparent'\"\n    [clearBorder]=\"true\"\n>\n    <fd-file-uploader\n        fd-toolbar-item\n        [class.hide-file-uploader]=\"parameters?.HideAttachButton\"\n        [id]=\"id\"\n        [name]=\"id\"\n        [placeholder]=\"'AttachFile' | bbbTranslate\"\n        [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n        [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n        [accept]=\"Setting.ValidExtensions || ''\"\n        [multiple]=\"maxFileCount > 1\"\n        (selectedFilesChanged)=\"onFileSelection($event)\"\n        [contentDensity]=\"(contentDensity$ | async)!!\"\n    ></fd-file-uploader>\n</fd-toolbar>\n}\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host ::ng-deep fd-file-uploader .fd-button{background-color:var(--sapButton_Lite_Background);border-color:var(--sapButton_Lite_BorderColor);color:var(--sapButton_Lite_TextColor)}:host .hide-file-uploader{visibility:hidden;height:0;width:0}\n"], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: i12.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaListFileLinearComponent, selector: "bsu-barsa-list-file-linear", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "@if (parameters.ModeValue === '1') {\n<ul fd-list class=\"file-viewer-attachments\">\n    @for (file of value; track file) { @if (!file.IsDeleted) {\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\n        @if (file.inEdit) {\n        <input\n            style=\"width: 90%\"\n            fd-form-control\n            [(ngModel)]=\"file.FileName\"\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\n            (keydown.enter)=\"onHandleRenameFile(file)\"\n        />\n        } @if (!file.inEdit) {\n        <span fd-list-title>\n            {{ file.FileName }}\n        </span>\n        }\n        <span fd-list-secondary>\n            <button\n                ariaLabel=\"Edit Or Save\"\n                fdType=\"transparent\"\n                class=\"fd-button--compact\"\n                fd-button\n                fdCompact\n                [glyph]=\"file.inEdit ? 'save' : 'edit'\"\n                (click)=\"onHandleRenameFile(file)\"\n            ></button>\n            @if (!file.inEdit) {\n            <button\n                ariaLabel=\"Remove\"\n                fdType=\"transparent\"\n                title=\"Remove\"\n                fd-button\n                glyph=\"delete\"\n                (click)=\"onFileDeleted(file.Id)\"\n            ></button>\n            }\n        </span>\n    </li>\n    } } @if (valueExtra$ | async; as valueExtra) { @for (file of valueExtra | keyvalue; track file) { @if\n    (file.value.UploadState === 'Uploading') {\n    <li style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\n        @if (file.value.Progress) {\n        <fd-progress-indicator state=\"informative\" [valueNow]=\"file.value.Progress\"></fd-progress-indicator>\n        }\n    </li>\n    } } }\n</ul>\n} @if (parameters.ModeValue === '2') {\n<ul fd-list [byline]=\"true\">\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\n    <li fd-list-item>\n        <div fd-list-content style=\"text-align: center\">\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\n        </div>\n    </li>\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\n    <li fd-list-item>\n        <span fd-list-thumbnail>\n            @if (valueExtra[file.Id].IsIcon) {\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\n            } @else {\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\n            }\n        </span>\n        <!-- for byline, fd-list-content is mandatory -->\n        <div fd-list-content>\n            <div fd-list-title>{{ file.FileName }}</div>\n            <div fd-list-byline [twoCol]=\"true\">\n                <div fd-list-byline-left></div>\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                        @if (file.IsNew) {\n                        <span\n                            fd-toolbar-item\n                            fd-object-status\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                        ></span>\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                        <fd-slider\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\n                            [name]=\"'filerLinear_' + id\"\n                            fd-toolbar-item\n                            [id]=\"id\"\n                            [min]=\"0\"\n                            [max]=\"100\"\n                            [step]=\"1\"\n                        >\n                        </fd-slider>\n                        } }\n                    </fd-toolbar>\n                </div>\n            </div>\n        </div>\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\n        }\n    </li>\n    } } }\n</ul>\n} @if ((disableOrReadonly$ | async) !== true) {\n<fd-toolbar\n    style=\"display: block\"\n    [style.height.px]=\"parameters.ModeValue === '1' ? 0 : null\"\n    [fdType]=\"'transparent'\"\n    [clearBorder]=\"true\"\n>\n    <fd-file-uploader\n        fd-toolbar-item\n        [class.hide-file-uploader]=\"parameters?.HideAttachButton\"\n        [id]=\"id\"\n        [name]=\"id\"\n        [placeholder]=\"'AttachFile' | bbbTranslate\"\n        [buttonLabel]=\"'AttachFile' | bbbTranslate\"\n        [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\n        [accept]=\"Setting.ValidExtensions || ''\"\n        [multiple]=\"maxFileCount > 1\"\n        (selectedFilesChanged)=\"onFileSelection($event)\"\n        [contentDensity]=\"(contentDensity$ | async)!!\"\n    ></fd-file-uploader>\n</fd-toolbar>\n}\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host ::ng-deep fd-file-uploader .fd-button{background-color:var(--sapButton_Lite_Background);border-color:var(--sapButton_Lite_BorderColor);color:var(--sapButton_Lite_TextColor)}:host .hide-file-uploader{visibility:hidden;height:0;width:0}\n"], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: i12.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaListFileLinearComponent, decorators: [{
             type: Component,
@@ -8058,7 +8061,7 @@ class UlvFormMultiSelectComponent extends BaseComponent {
         return item.Id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvFormMultiSelectComponent, deps: [{ token: i1$1.DialogService }, { token: i2.BbbTranslatePipe }, { token: i2.PortalService }, { token: i1$1.ContentDensityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvFormMultiSelectComponent, selector: "bsu-ulv-form-multi-select", inputs: { Show: "Show" }, viewQueries: [{ propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }, { propertyName: "dialogComponent", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (!dialogConfig.fullscreen) {\n                    <fd-button-bar\n                        ariaLabel=\"fullscreen\"\n                        [glyph]=\"dialog.data.fullscreen ? 'exitfullscreen' : 'resize'\"\n                        fullscreenDialog\n                        [dialog]=\"dialog\"\n                        [fullscreen]=\"dialog.data.fullscreen\"\n                        (fullscreenChanged)=\"dialog.data.fullscreen = $event\"\n                        [dialogComponent]=\"dialogTpl\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onCancel(dialog)\"></fd-button-bar>\n                </div>\n            </ng-template>\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\n      <button fd-dialog-close-button></button> -->\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            @if (dialog.data.ulv1; as ulv1) {\n            <bsu-ui-ulv-main-ui\n                class=\"ulv-form-multi-select\"\n                [context]=\"ulv1\"\n                [inDialog]=\"true\"\n                [isMultiSelect]=\"dialog.data.ShowSecondPanel\"\n                [fullscreen]=\"dialog.data.fullscreen\"\n            ></bsu-ui-ulv-main-ui>\n            } @if (dialog.data.ulv2 && dialog.data.ShowSecondPanel) {\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\n                        ({{ dialog.data.selectedItems?.MoDataList?.length || 0 }})\n                    </ng-container>\n                </h5>\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (dialog.data.selectedItems) {\n                        <fd-toolbar [shouldOverflow]=\"true\">\n                            <!-- Selected items -->\n                            @for ( item of dialog.data.selectedItems.MoDataList; track _trackBySelectedFn(selectedIndex,\n                            item); let selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected(dialog, item)\"\n                                >{{ item.$Caption }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        [aria-label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClear(dialog)\"\n                    ></button>\n                </div>\n            </div>\n            }\n        </fd-dialog-body>\n\n        @if (dialog.data.ulv1 && !dialog.data.ulv1?.HideOkCancelButtons) {\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                @if (dialog.data.adapter?.ShowOkCancelButtons !== false) {\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        [label]=\"'OK' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk(dialog)\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        [label]=\"'Cancel' | bbbTranslate\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onCancel(dialog)\"\n                    ></button>\n                </div>\n                }\n            </ng-template>\n        </fd-dialog-footer>\n        }\n    </fd-dialog>\n</ng-template>\n", styles: [".ulv-selection-form-dialog{cursor:default}.ulv-selection-form-dialog .fd-dialog__body bsu-ui-table-view{overflow-x:inherit!important}.ulv-selection-form-dialog__advanced-filters{padding-top:1rem}.ulv-selection-form-dialog__advanced-filters label{height:auto}.ulv-selection-form-dialog__toggle-filters{display:flex;justify-content:flex-end;align-items:flex-end}.ulv-selection-form-dialog__toggle-filters .fd-button{margin-bottom:.25rem}.ulv-selection-form-dialog__advanced-actions{display:flex;align-items:center;justify-content:flex-end}.ulv-selection-form-dialog-mobile .ulv-selection-form-dialog__advanced-actions{justify-content:flex-start}.ulv-selection-form-dialog__advanced-actions .fd-toolbar{padding:0}.ulv-selection-form-dialog fd-dialog-body{height:100%;display:flex;flex-direction:column}.ulv-selection-form-dialog bsu-ui-ulv-main-ui{height:100%;flex-grow:1}.ulv-selection-form-dialog bsu-ui-ulv-main-ui .viewer-container{height:auto;overflow:auto}.ulv-selection-form-dialog .ulv-selection-form-dialog__row{border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9);padding-top:1rem}.ulv-selection-form-dialog bsu-search-panel{border-bottom:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog fd-dialog-footer{height:auto}.ulv-selection-form-dialog__content-holder{padding:0 2rem 1rem;display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.ulv-selection-form-dialog__row{padding:0 2rem 1rem}.ulv-selection-form-dialog__row.ulv-selection-form-dialog__selection-row{background-color:#f7f7f7;background-color:var(--sapBackgroundColor, #f7f7f7)}.ulv-selection-form-dialog__tokens-wrapper{display:flex}.ulv-selection-form-dialog__tokens{display:flex;flex:1 1 auto;overflow:hidden;align-items:center;border:1px solid #89919a;border-color:var(--sapContent_ForegroundBorderColor, #89919a);margin-right:.5rem;border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);background:none}.ulv-selection-form-dialog__tokens fd-toolbar{flex:1 1 auto;overflow:hidden}.ulv-selection-form-dialog__tokens-clear{height:auto;min-width:2rem;padding:.125rem 0;justify-content:center}.ulv-selection-form-dialog__actions-row{padding:.5rem 0;display:flex;align-items:center;justify-content:flex-end;border-top:.0625rem solid #d9d9d9;border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog__actions-row .fd-button{margin-left:.5rem}.ulv-selection-form-dialog__tokens-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]", inputs: ["dialog", "dialogComponent", "fullscreen"], outputs: ["fullscreenChanged"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvFormMultiSelectComponent, selector: "bsu-ulv-form-multi-select", inputs: { Show: "Show" }, viewQueries: [{ propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }, { propertyName: "dialogComponent", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (!dialogConfig.fullscreen) {\n                    <fd-button-bar\n                        ariaLabel=\"fullscreen\"\n                        [glyph]=\"dialog.data.fullscreen ? 'exitfullscreen' : 'resize'\"\n                        fullscreenDialog\n                        [dialog]=\"dialog\"\n                        [fullscreen]=\"dialog.data.fullscreen\"\n                        (fullscreenChanged)=\"dialog.data.fullscreen = $event\"\n                        [dialogComponent]=\"dialogTpl\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onCancel(dialog)\"></fd-button-bar>\n                </div>\n            </ng-template>\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\n      <button fd-dialog-close-button></button> -->\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            @if (dialog.data.ulv1; as ulv1) {\n            <bsu-ui-ulv-main-ui\n                class=\"ulv-form-multi-select\"\n                [context]=\"ulv1\"\n                [inDialog]=\"true\"\n                [isMultiSelect]=\"dialog.data.ShowSecondPanel\"\n                [fullscreen]=\"dialog.data.fullscreen\"\n            ></bsu-ui-ulv-main-ui>\n            } @if (dialog.data.ulv2 && dialog.data.ShowSecondPanel) {\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\n                        ({{ dialog.data.selectedItems?.MoDataList?.length || 0 }})\n                    </ng-container>\n                </h5>\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (dialog.data.selectedItems) {\n                        <fd-toolbar [shouldOverflow]=\"true\">\n                            <!-- Selected items -->\n                            @for ( item of dialog.data.selectedItems.MoDataList; track _trackBySelectedFn(selectedIndex,\n                            item); let selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected(dialog, item)\"\n                                >{{ item.$Caption }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        [aria-label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClear(dialog)\"\n                    ></button>\n                </div>\n            </div>\n            }\n        </fd-dialog-body>\n\n        @if (dialog.data.ulv1 && !dialog.data.ulv1?.HideOkCancelButtons) {\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                @if (dialog.data.adapter?.ShowOkCancelButtons !== false) {\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        [label]=\"'OK' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk(dialog)\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        [label]=\"'Cancel' | bbbTranslate\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onCancel(dialog)\"\n                    ></button>\n                </div>\n                }\n            </ng-template>\n        </fd-dialog-footer>\n        }\n    </fd-dialog>\n</ng-template>\n", styles: [".ulv-selection-form-dialog{cursor:default}.ulv-selection-form-dialog .fd-dialog__body bsu-ui-table-view{overflow-x:inherit!important}.ulv-selection-form-dialog__advanced-filters{padding-top:1rem}.ulv-selection-form-dialog__advanced-filters label{height:auto}.ulv-selection-form-dialog__toggle-filters{display:flex;justify-content:flex-end;align-items:flex-end}.ulv-selection-form-dialog__toggle-filters .fd-button{margin-bottom:.25rem}.ulv-selection-form-dialog__advanced-actions{display:flex;align-items:center;justify-content:flex-end}.ulv-selection-form-dialog-mobile .ulv-selection-form-dialog__advanced-actions{justify-content:flex-start}.ulv-selection-form-dialog__advanced-actions .fd-toolbar{padding:0}.ulv-selection-form-dialog fd-dialog-body{height:100%;display:flex;flex-direction:column}.ulv-selection-form-dialog bsu-ui-ulv-main-ui{height:100%;flex-grow:1}.ulv-selection-form-dialog bsu-ui-ulv-main-ui .viewer-container{height:auto;overflow:auto}.ulv-selection-form-dialog .ulv-selection-form-dialog__row{border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9);padding-top:1rem}.ulv-selection-form-dialog bsu-search-panel{border-bottom:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog fd-dialog-footer{height:auto}.ulv-selection-form-dialog__content-holder{padding:0 2rem 1rem;display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.ulv-selection-form-dialog__row{padding:0 2rem 1rem}.ulv-selection-form-dialog__row.ulv-selection-form-dialog__selection-row{background-color:#f7f7f7;background-color:var(--sapBackgroundColor, #f7f7f7)}.ulv-selection-form-dialog__tokens-wrapper{display:flex}.ulv-selection-form-dialog__tokens{display:flex;flex:1 1 auto;overflow:hidden;align-items:center;border:1px solid #89919a;border-color:var(--sapContent_ForegroundBorderColor, #89919a);margin-right:.5rem;border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);background:none}.ulv-selection-form-dialog__tokens fd-toolbar{flex:1 1 auto;overflow:hidden}.ulv-selection-form-dialog__tokens-clear{height:auto;min-width:2rem;padding:.125rem 0;justify-content:center}.ulv-selection-form-dialog__actions-row{padding:.5rem 0;display:flex;align-items:center;justify-content:flex-end;border-top:.0625rem solid #d9d9d9;border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog__actions-row .fd-button{margin-left:.5rem}.ulv-selection-form-dialog__tokens-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]", inputs: ["dialog", "dialogComponent", "fullscreen"], outputs: ["fullscreenChanged"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvFormMultiSelectComponent, decorators: [{
             type: Component,
@@ -8079,7 +8082,7 @@ class UiUlvFormMultiSelectUiComponent extends BaseComponent {
         this.dialogRef = dialogRef;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiUlvFormMultiSelectUiComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiUlvFormMultiSelectUiComponent, selector: "bsu-ui-ulv-form-multi-select-ui", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n  <fd-dialog-header>\n    <h1 fd-title>{{ dialogRef.data.title }}</h1>\n    <button fd-dialog-close-button (click)=\"dialogRef.dismiss('Close button')\"></button>\n  </fd-dialog-header>\n\n  <fd-dialog-body>\n    @if (dialogRef.data.ulv1; as ulv1) {\n      <bsu-ui-ulv-main-ui [context]=\"ulv1\"></bsu-ui-ulv-main-ui>\n    }\n  </fd-dialog-body>\n\n  <fd-dialog-footer>\n    <ng-template fdkTemplate=\"footer\">\n      <div\n        class=\"fdp-value-help-dialog__row fdp-value-help-dialog__selection-row\"\n        aria-label=\"Selected and condition items\"\n        i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\n        >\n        <h5 fd-title class=\"selected-and-condition-title\">\n          <ng-container>\n            <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\n              >Selected Items and Conditions\n                        </ng-container>\n            ()\n          </ng-container>\n        </h5>\n\n        <div class=\"fdp-value-help-dialog__tokens-wrapper\">\n          <div class=\"fdp-value-help-dialog__tokens\">\n            <fd-toolbar [shouldOverflow]=\"true\">\n              <!-- Selected items -->\n            </fd-toolbar>\n          </div>\n          <button\n            class=\"fdp-value-help-dialog__tokens-clear\"\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"decline\"\n            i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\n            aria-label=\"clear selected items\"\n          ></button>\n        </div>\n      </div>\n      <div class=\"fdp-value-help-dialog__actions-row\">\n        <button\n          fd-button\n          data-go-advanced\n          i18n-label=\"@@platformI18nValueHelpDialog.SearchButton\"\n          label=\"Go\"\n          fdType=\"emphasized\"\n        ></button>\n        <button\n          fd-button\n          data-succes\n          i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\n          label=\"OK\"\n          fdType=\"emphasized\"\n        ></button>\n        <button\n          fd-button\n          data-dismiss-dialog\n          fd-dialog-decisive-button\n          i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\n          label=\"Cancel\"\n          fdType=\"transparent\"\n        ></button>\n      </div>\n    </ng-template>\n  </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiUlvFormMultiSelectUiComponent, selector: "bsu-ui-ulv-form-multi-select-ui", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n  <fd-dialog-header>\n    <h1 fd-title>{{ dialogRef.data.title }}</h1>\n    <button fd-dialog-close-button (click)=\"dialogRef.dismiss('Close button')\"></button>\n  </fd-dialog-header>\n\n  <fd-dialog-body>\n    @if (dialogRef.data.ulv1; as ulv1) {\n      <bsu-ui-ulv-main-ui [context]=\"ulv1\"></bsu-ui-ulv-main-ui>\n    }\n  </fd-dialog-body>\n\n  <fd-dialog-footer>\n    <ng-template fdkTemplate=\"footer\">\n      <div\n        class=\"fdp-value-help-dialog__row fdp-value-help-dialog__selection-row\"\n        aria-label=\"Selected and condition items\"\n        i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\n        >\n        <h5 fd-title class=\"selected-and-condition-title\">\n          <ng-container>\n            <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\n              >Selected Items and Conditions\n                        </ng-container>\n            ()\n          </ng-container>\n        </h5>\n\n        <div class=\"fdp-value-help-dialog__tokens-wrapper\">\n          <div class=\"fdp-value-help-dialog__tokens\">\n            <fd-toolbar [shouldOverflow]=\"true\">\n              <!-- Selected items -->\n            </fd-toolbar>\n          </div>\n          <button\n            class=\"fdp-value-help-dialog__tokens-clear\"\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"decline\"\n            i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\n            aria-label=\"clear selected items\"\n          ></button>\n        </div>\n      </div>\n      <div class=\"fdp-value-help-dialog__actions-row\">\n        <button\n          fd-button\n          data-go-advanced\n          i18n-label=\"@@platformI18nValueHelpDialog.SearchButton\"\n          label=\"Go\"\n          fdType=\"emphasized\"\n        ></button>\n        <button\n          fd-button\n          data-succes\n          i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\n          label=\"OK\"\n          fdType=\"emphasized\"\n        ></button>\n        <button\n          fd-button\n          data-dismiss-dialog\n          fd-dialog-decisive-button\n          i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\n          label=\"Cancel\"\n          fdType=\"transparent\"\n        ></button>\n      </div>\n    </ng-template>\n  </fd-dialog-footer>\n</fd-dialog>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiUlvFormMultiSelectUiComponent, decorators: [{
             type: Component,
@@ -8205,7 +8208,7 @@ class LayoutActionsComponent extends FormToolbarBaseComponent {
         this.workflowChoiceSelect.emit(workflowButton.Choice);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LayoutActionsComponent, deps: [{ token: i1$6.Overlay }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\n<ng-template #defaultTemplate>\n    @if (visible) { @if (hasButtons) {\n    <div fd-bar barDesign=\"footer\" [inPage]=\"true\">\n        @if (canSend && false) {\n        <div fd-bar-left>\n            <fd-bar-element class=\"forward\">\n                <fd-popover\n                    [focusTrapped]=\"true\"\n                    [focusAutoCapture]=\"true\"\n                    [closeOnOutsideClick]=\"false\"\n                    [scrollStrategy]=\"repositionScrollStrategy\"\n                    #forwardPopover\n                >\n                    <fd-popover-control class=\"forward\">\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\n                    </fd-popover-control>\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\n                        <div fd-popover-body-header>\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\n                                <div fd-bar-right>\n                                    <fd-bar-element\n                                        ><button\n                                            fd-button\n                                            (click)=\"forwardPopover.close()\"\n                                            [fdType]=\"'transparent'\"\n                                            [glyph]=\"'decline'\"\n                                        ></button>\n                                    </fd-bar-element>\n                                    <div fd-bar-left>\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <bnrc-form-new\n                            class=\"form-erja\"\n                            [settings]=\"{\n                                MetaTypeDef: { Id: '', $Caption: '' },\n                                MetaView: { Id: '', $Caption: '' },\n                                DisableGenerateId: true\n                            }\"\n                        ></bnrc-form-new>\n                        <div fd-popover-body-footer>\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\n                                <div fd-bar-right>\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\n                                    <fd-button-bar\n                                        [label]=\"'Cancel' | bbbTranslate\"\n                                        [fdType]=\"'transparent'\"\n                                        (click)=\"forwardPopover.close()\"\n                                    ></fd-button-bar>\n                                </div>\n                            </div>\n                        </div>\n                    </fd-popover-body>\n                </fd-popover>\n            </fd-bar-element>\n        </div>\n        }\n        <div fd-bar-right>\n            @if (workflowButtonsComboMode && workflowButtons.length > 0) {\n            <button\n                fd-button\n                [fdMenu]=\"true\"\n                fdType=\"emphasized\"\n                [label]=\"'Select' | bbbTranslate\"\n                [ariaLabel]=\"'Select' | bbbTranslate\"\n                [fdMenuTrigger]=\"menu\"\n            ></button>\n            <fd-menu #menu>\n                @for (btn of workflowButtons; track btn) {\n                <li fd-menu-item (click)=\"onWorkflowButtonSelected(btn)\">\n                    <div fd-menu-interactive>\n                        <span fd-menu-title>{{ btn.text }}</span>\n                    </div>\n                </li>\n                }\n            </fd-menu>\n            <fd-button-bar\n                [fdType]=\"'positive'\"\n                [label]=\"'Send' | bbbTranslate\"\n                [disabled]=\"!selectedWorkflowButton\"\n                [glyph]=\"'accept'\"\n                (click)=\"onAcceptWorkflow()\"\n            ></fd-button-bar>\n            } @else { @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\n            <fd-button-bar\n                [attr.workflowButton]=\"true\"\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                (click)=\"onToolClick(btn)\"\n            ></fd-button-bar>\n            } } } @for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\n            <bnrc-dynamic-form-toolbaritem\n                class=\"fd-bar__element\"\n                [component]=\"btn.Data.CustomUi\"\n                [context]=\"btn\"\n                [isEnable]=\"btn.Command?._isEnable\"\n                (btnClick)=\"onToolClick(btn)\"\n            ></bnrc-dynamic-form-toolbaritem>\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\n            <fd-button-bar\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                (click)=\"onToolClick(btn)\"\n            ></fd-button-bar>\n            } }\n        </div>\n    </div>\n    } } @if (mobileBottomBar) {\n    <div style=\"background-color: transparent; height: 4rem\"></div>\n    }\n</ng-template>\n<ng-template #buttonsMode>\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\n    <fd-button-bar\n        [attr.workflowButton]=\"true\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        [label]=\"btn.text | bbbTranslate\"\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n        (click)=\"onToolClick(btn)\"\n    ></fd-button-bar>\n    } }\n</ng-template>\n", styles: [":host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\n<ng-template #defaultTemplate>\n    @if (visible) { @if (hasButtons) {\n    <div fd-bar barDesign=\"footer\" [inPage]=\"true\">\n        @if (canSend && false) {\n        <div fd-bar-left>\n            <fd-bar-element class=\"forward\">\n                <fd-popover\n                    [focusTrapped]=\"true\"\n                    [focusAutoCapture]=\"true\"\n                    [closeOnOutsideClick]=\"false\"\n                    [scrollStrategy]=\"repositionScrollStrategy\"\n                    #forwardPopover\n                >\n                    <fd-popover-control class=\"forward\">\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\n                    </fd-popover-control>\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\n                        <div fd-popover-body-header>\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\n                                <div fd-bar-right>\n                                    <fd-bar-element\n                                        ><button\n                                            fd-button\n                                            (click)=\"forwardPopover.close()\"\n                                            [fdType]=\"'transparent'\"\n                                            [glyph]=\"'decline'\"\n                                        ></button>\n                                    </fd-bar-element>\n                                    <div fd-bar-left>\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                        <bnrc-form-new\n                            class=\"form-erja\"\n                            [settings]=\"{\n                                MetaTypeDef: { Id: '', $Caption: '' },\n                                MetaView: { Id: '', $Caption: '' },\n                                DisableGenerateId: true\n                            }\"\n                        ></bnrc-form-new>\n                        <div fd-popover-body-footer>\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\n                                <div fd-bar-right>\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\n                                    <fd-button-bar\n                                        [label]=\"'Cancel' | bbbTranslate\"\n                                        [fdType]=\"'transparent'\"\n                                        (click)=\"forwardPopover.close()\"\n                                    ></fd-button-bar>\n                                </div>\n                            </div>\n                        </div>\n                    </fd-popover-body>\n                </fd-popover>\n            </fd-bar-element>\n        </div>\n        }\n        <div fd-bar-right>\n            @if (workflowButtonsComboMode && workflowButtons.length > 0) {\n            <button\n                fd-button\n                [fdMenu]=\"true\"\n                fdType=\"emphasized\"\n                [label]=\"'Select' | bbbTranslate\"\n                [ariaLabel]=\"'Select' | bbbTranslate\"\n                [fdMenuTrigger]=\"menu\"\n            ></button>\n            <fd-menu #menu>\n                @for (btn of workflowButtons; track btn) {\n                <li fd-menu-item (click)=\"onWorkflowButtonSelected(btn)\">\n                    <div fd-menu-interactive>\n                        <span fd-menu-title>{{ btn.text }}</span>\n                    </div>\n                </li>\n                }\n            </fd-menu>\n            <fd-button-bar\n                [fdType]=\"'positive'\"\n                [label]=\"'Send' | bbbTranslate\"\n                [disabled]=\"!selectedWorkflowButton\"\n                [glyph]=\"'accept'\"\n                (click)=\"onAcceptWorkflow()\"\n            ></fd-button-bar>\n            } @else { @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\n            <fd-button-bar\n                [attr.workflowButton]=\"true\"\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                (click)=\"onToolClick(btn)\"\n            ></fd-button-bar>\n            } } } @for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\n            <bnrc-dynamic-form-toolbaritem\n                class=\"fd-bar__element\"\n                [component]=\"btn.Data.CustomUi\"\n                [context]=\"btn\"\n                [isEnable]=\"btn.Command?._isEnable\"\n                (btnClick)=\"onToolClick(btn)\"\n            ></bnrc-dynamic-form-toolbaritem>\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\n            <fd-button-bar\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                (click)=\"onToolClick(btn)\"\n            ></fd-button-bar>\n            } }\n        </div>\n    </div>\n    } } @if (mobileBottomBar) {\n    <div style=\"background-color: transparent; height: 4rem\"></div>\n    }\n</ng-template>\n<ng-template #buttonsMode>\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\n    <fd-button-bar\n        [attr.workflowButton]=\"true\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        [label]=\"btn.text | bbbTranslate\"\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n        (click)=\"onToolClick(btn)\"\n    ></fd-button-bar>\n    } }\n</ng-template>\n", styles: [":host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LayoutActionsComponent, decorators: [{
             type: Component,
@@ -8282,7 +8285,7 @@ class FormToolbarComponent extends FormToolbarBaseComponent {
         this._toolbarComponent.updateCollapsibleItems();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: { toolbarClick: "toolbarClick" }, viewQueries: [{ propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-toolbar\n    #formToolbar\n    fdType=\"transparent\"\n    [clearBorder]=\"true\"\n    [shouldOverflow]=\"deviceSize === 's'\"\n    [class.firefox]=\"isFirefox\"\n>\n    @for (btn of buttons; track btn; let i = $index; let last = $last; let first = $first) { @if ((btn === '-' ||\n    btn.text === '-') && !last && !first && deviceSize !== 's') {\n    <fd-toolbar-separator [attr.i]=\"i\" [attr.last]=\"last\" [attr.first]=\"first\"></fd-toolbar-separator>\n    } @if (btn.IAmMenu) { @if (btn.isBuiltin) {\n    <fd-split-button\n        [dir]=\"dirValue === 'rtl' ? 'rtl' : 'ltr'\"\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"'low'\"\n        [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\n        (click)=\"menu2.open()\"\n    >\n        <fd-menu #menu2>\n            @for (menuItem of btn.menu.items; track menuItem) {\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu2)\">\n                <div fd-menu-interactive>\n                    <fd-menu-addon\n                        position=\"before\"\n                        [glyph]=\"menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\"\n                    >\n                    </fd-menu-addon>\n                    @if (!menuItem.newIcon && menuItem.icon) {\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\n                    }\n                    <span fd-menu-title>{{ menuItem.text }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n    } @if (!btn.isBuiltin) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdMenu]=\"true\"\n        [glyph]=\"btn.FontIcon\"\n        [style.color]=\"btn.IconColor\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        [label]=\"btn.text | bbbTranslate\"\n        [ariaLabel]=\"btn.text | bbbTranslate\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        }\n        <fd-menu #menu>\n            @for (menuItem of btn.menu.items; track menuItem) {\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu)\">\n                <div fd-menu-interactive>\n                    @if ( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon || menuItem.FontIcon ||\n                    menuItem.Data?.CustomUi?.Parameters?.Icon ) {\n                    <fd-menu-addon\n                        position=\"before\"\n                        [ngClass]=\"\n                            menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                ? 'fd-button--' + menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                : ''\n                        \"\n                        [style.color]=\"menuItem.IconColor\"\n                        [glyph]=\"\n                            menuItem.newIcon ||\n                            menuItem.Data?.JsonExtraProp?.Icon ||\n                            menuItem.FontIcon ||\n                            menuItem.Data?.CustomUi?.Parameters?.Icon\n                        \"\n                    >\n                    </fd-menu-addon>\n                    } @if ( !( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon ||\n                    menuItem.Data?.CustomUi?.Parameters?.Icon || menuItem.FontIcon ) && menuItem.icon ) {\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\n                    }\n                    <span fd-menu-title>{{ menuItem.text }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </button>\n    } } @else { @if (!(btn === '-' || btn.text === '-')) {\n    <ng-container\n        *ngTemplateOutlet=\"btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate; context: { $implicit: btn }\"\n    ></ng-container>\n    <ng-template #btnTemplate let-btn>\n        <button\n            fd-toolbar-item\n            fd-button\n            [disabled]=\"btn.disabled\"\n            [attr.fdOverflowPriority]=\"btn.priority\"\n            [fdType]=\"btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n            (click)=\"onToolbarClick(btn)\"\n        >\n            @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\n            <img width=\"16\" [src]=\"btn.icon\" />\n            } @if (btn.text) {\n            <span>{{ btn.text }}</span>\n            }\n        </button>\n    </ng-template>\n    <ng-template #dynamicBtnTemplate let-btn>\n        <bnrc-dynamic-form-toolbaritem\n            fd-toolbar-item\n            [component]=\"btn.Data.CustomUi\"\n            [context]=\"btn\"\n            [isEnable]=\"btn.Command?._isEnable\"\n            (btnClick)=\"onToolbarClick(btn)\"\n        ></bnrc-dynamic-form-toolbaritem>\n    </ng-template>\n    } } }\n</fd-toolbar>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: { toolbarClick: "toolbarClick" }, viewQueries: [{ propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-toolbar\n    #formToolbar\n    fdType=\"transparent\"\n    [clearBorder]=\"true\"\n    [shouldOverflow]=\"deviceSize === 's'\"\n    [class.firefox]=\"isFirefox\"\n>\n    @for (btn of buttons; track btn; let i = $index; let last = $last; let first = $first) { @if ((btn === '-' ||\n    btn.text === '-') && !last && !first && deviceSize !== 's') {\n    <fd-toolbar-separator [attr.i]=\"i\" [attr.last]=\"last\" [attr.first]=\"first\"></fd-toolbar-separator>\n    } @if (btn.IAmMenu) { @if (btn.isBuiltin) {\n    <fd-split-button\n        [dir]=\"dirValue === 'rtl' ? 'rtl' : 'ltr'\"\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"'low'\"\n        [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\n        (click)=\"menu2.open()\"\n    >\n        <fd-menu #menu2>\n            @for (menuItem of btn.menu.items; track menuItem) {\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu2)\">\n                <div fd-menu-interactive>\n                    <fd-menu-addon\n                        position=\"before\"\n                        [glyph]=\"menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\"\n                    >\n                    </fd-menu-addon>\n                    @if (!menuItem.newIcon && menuItem.icon) {\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\n                    }\n                    <span fd-menu-title>{{ menuItem.text }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n    } @if (!btn.isBuiltin) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdMenu]=\"true\"\n        [glyph]=\"btn.FontIcon\"\n        [style.color]=\"btn.IconColor\"\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n        [label]=\"btn.text | bbbTranslate\"\n        [ariaLabel]=\"btn.text | bbbTranslate\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        }\n        <fd-menu #menu>\n            @for (menuItem of btn.menu.items; track menuItem) {\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu)\">\n                <div fd-menu-interactive>\n                    @if ( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon || menuItem.FontIcon ||\n                    menuItem.Data?.CustomUi?.Parameters?.Icon ) {\n                    <fd-menu-addon\n                        position=\"before\"\n                        [ngClass]=\"\n                            menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                ? 'fd-button--' + menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                : ''\n                        \"\n                        [style.color]=\"menuItem.IconColor\"\n                        [glyph]=\"\n                            menuItem.newIcon ||\n                            menuItem.Data?.JsonExtraProp?.Icon ||\n                            menuItem.FontIcon ||\n                            menuItem.Data?.CustomUi?.Parameters?.Icon\n                        \"\n                    >\n                    </fd-menu-addon>\n                    } @if ( !( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon ||\n                    menuItem.Data?.CustomUi?.Parameters?.Icon || menuItem.FontIcon ) && menuItem.icon ) {\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\n                    }\n                    <span fd-menu-title>{{ menuItem.text }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </button>\n    } } @else { @if (!(btn === '-' || btn.text === '-')) {\n    <ng-container\n        *ngTemplateOutlet=\"btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate; context: { $implicit: btn }\"\n    ></ng-container>\n    <ng-template #btnTemplate let-btn>\n        <button\n            fd-toolbar-item\n            fd-button\n            [disabled]=\"btn.disabled\"\n            [attr.fdOverflowPriority]=\"btn.priority\"\n            [fdType]=\"btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n            (click)=\"onToolbarClick(btn)\"\n        >\n            @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\n            <img width=\"16\" [src]=\"btn.icon\" />\n            } @if (btn.text) {\n            <span>{{ btn.text }}</span>\n            }\n        </button>\n    </ng-template>\n    <ng-template #dynamicBtnTemplate let-btn>\n        <bnrc-dynamic-form-toolbaritem\n            fd-toolbar-item\n            [component]=\"btn.Data.CustomUi\"\n            [context]=\"btn\"\n            [isEnable]=\"btn.Command?._isEnable\"\n            (btnClick)=\"onToolbarClick(btn)\"\n        ></bnrc-dynamic-form-toolbaritem>\n    </ng-template>\n    } } }\n</fd-toolbar>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormToolbarComponent, decorators: [{
             type: Component,
@@ -8353,7 +8356,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         this.layout2 = GetFormLayoutGrid(false, this.colXl, this.colLg, this.colMd);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FundamentalDynamicFormComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", 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", rtl: "rtl", 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" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_tabListComponent", first: true, predicate: TabListComponent, descendants: 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) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [subtitle]=\"subtitle | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        #titleRef\n    >\n        @if (!isMobile) {\n        <fd-breadcrumb>\n            @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n            breadCrumb; let i = $index; let last = $last) {\n            <fd-breadcrumb-item>\n                <bsu-breadcrumb\n                    [index]=\"i\"\n                    [isLast]=\"last\"\n                    [breadCrumb]=\"breadCrumb\"\n                    [allBreadCrumb]=\"breadCrumbs\"\n                ></bsu-breadcrumb>\n            </fd-breadcrumb-item>\n            } }\n        </fd-breadcrumb>\n        }\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n            <!-- <fd-toolbar\n        *ngIf=\"toolbarVisible\"\n        #formToolbar\n        fdType=\"transparent\"\n        [clearBorder]=\"true\"\n        [shouldOverflow]=\"deviceSize === 's'\"\n        [class.firefox]=\"isFirefox\"\n        >\n        <ng-container *ngFor=\"let btn of toolbarItems; let i = index; let last = last; let first = first\">\n          <fd-toolbar-separator\n            [attr.i]=\"i\"\n            [attr.last]=\"last\"\n            [attr.first]=\"first\"\n            *ngIf=\"(btn === '-' || btn.text === '-') && !last && !first\"\n          ></fd-toolbar-separator>\n          <ng-container *ngIf=\"btn.IAmMenu; else simpleButton\">\n            <fd-split-button\n              *ngIf=\"btn.isBuiltin\"\n              [dir]=\"dirValue\"\n              fd-toolbar-item\n              [attr.fdOverflowPriority]=\"'low'\"\n              [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\n              [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n              (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\n              (click)=\"menu2.open()\"\n              >\n              <fd-menu #menu2>\n                <li\n                  fd-menu-item\n                  *ngFor=\"let menuItem of btn.menu.items\"\n                  [disabled]=\"menuItem.disabled\"\n                  (click)=\"onToolbarClick(menuItem, menu2)\"\n                  >\n                  <div fd-menu-interactive>\n                    <fd-menu-addon\n                      position=\"before\"\n                                              [glyph]=\"\n                                                  menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\n                                              \"\n                      >\n                    </fd-menu-addon>\n                    <img\n                      class=\"mr8\"\n                      *ngIf=\"!menuItem.newIcon && menuItem.icon\"\n                      [src]=\"menuItem.icon\"\n                      />\n                      <span fd-menu-title>{{ menuItem.text }}</span>\n                    </div>\n                  </li>\n                </fd-menu>\n              </fd-split-button>\n              <button\n                *ngIf=\"!btn.isBuiltin\"\n                fd-button\n                fd-toolbar-item\n                [fdMenu]=\"true\"\n                [glyph]=\"btn.FontIcon\"\n                [style.color]=\"btn.IconColor\"\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [ariaLabel]=\"btn.text | bbbTranslate\"\n                [fdMenuTrigger]=\"menu\"\n                >\n                <img\n                  *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\n                  width=\"16\"\n                  [src]=\"btn.icon\"\n                  />\n                  <fd-menu #menu>\n                    <li\n                      fd-menu-item\n                      *ngFor=\"let menuItem of btn.menu.items\"\n                      [disabled]=\"menuItem.disabled\"\n                      (click)=\"onToolbarClick(menuItem, menu)\"\n                      >\n                      <div fd-menu-interactive>\n                        <fd-menu-addon\n                                              *ngIf=\"\n                                                  menuItem.newIcon ||\n                                                  menuItem.Data?.JsonExtraProp?.Icon ||\n                                                  menuItem.FontIcon ||\n                                                  menuItem.Data?.CustomUi?.Parameters?.Icon\n                                              \"\n                          position=\"before\"\n                                              [ngClass]=\"\n                                                  menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                                      ? 'fd-button--' +\n                                                        menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                                      : ''\n                                              \"\n                          [style.color]=\"menuItem.IconColor\"\n                                              [glyph]=\"\n                                                  menuItem.newIcon ||\n                                                  menuItem.Data?.JsonExtraProp?.Icon ||\n                                                  menuItem.FontIcon ||\n                                                  menuItem.Data?.CustomUi?.Parameters?.Icon\n                                              \"\n                          >\n                        </fd-menu-addon>\n                        <img\n                          class=\"mr8\"\n                                              *ngIf=\"\n                                                  !(\n                                                      menuItem.newIcon ||\n                                                      menuItem.Data?.JsonExtraProp?.Icon ||\n                                                      menuItem.Data?.CustomUi?.Parameters?.Icon ||\n                                                      menuItem.FontIcon\n                                                  ) && menuItem.icon\n                                              \"\n                          [src]=\"menuItem.icon\"\n                          />\n                          <span fd-menu-title>{{ menuItem.text }}</span>\n                        </div>\n                      </li>\n                    </fd-menu>\n                  </button>\n                </ng-container>\n                <ng-template #simpleButton>\n                  <ng-container *ngIf=\"!(btn === '-' || btn.text === '-')\">\n                    <ng-container\n                                  *ngTemplateOutlet=\"\n                                      btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\n                                      context: { $implicit: btn }\n                                  \"\n                    ></ng-container>\n                    <ng-template #btnTemplate let-btn>\n                      <button\n                        fd-toolbar-item\n                        fd-button\n                        [disabled]=\"btn.disabled\"\n                        [attr.fdOverflowPriority]=\"btn.priority\"\n                                      [fdType]=\"\n                                          btn.isWorkflow\n                                              ? 'positive'\n                                              : btn.design\n                                              ? btn.design\n                                              : btn.Data?.JsonExtraProp?.Design\n                                      \"\n                        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                        (click)=\"onToolbarClick(btn)\"\n                        >\n                        <img\n                          *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\n                          width=\"16\"\n                          [src]=\"btn.icon\"\n                          />\n                          <span *ngIf=\"btn.text\">{{ btn.text }}</span>\n                        </button>\n                      </ng-template>\n                      <ng-template #dynamicBtnTemplate let-btn>\n                        <bnrc-dynamic-form-toolbaritem\n                          fd-toolbar-item\n                          [component]=\"btn.Data.CustomUi\"\n                          [context]=\"btn\"\n                          [isEnable]=\"btn.Command?._isEnable\"\n                          (btnClick)=\"onToolbarClick(btn)\"\n                        ></bnrc-dynamic-form-toolbaritem>\n                      </ng-template>\n                    </ng-container>\n                  </ng-template>\n                </ng-container>\n              </fd-toolbar> -->\n            <!-- <bsu-ui-form-panel-toolbar\n              [buttons]=\"toolbarItems | tlbButtons: 'inFooter':false\"\n              [size]=\"size\"\n              [deviceSize]=\"deviceSize$ | async\"\n              [visible]=\"toolbarVisible\"\n              (toolClick)=\"onToolbarClick($event)\"\n            ></bsu-ui-form-panel-toolbar> -->\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin\"\n        [collapsible]=\"!!workflowInfoText || (facetList && facetList.length > 0)\"\n        [pinnable]=\"true\"\n        [collapsed]=\"(!facetList || facetList.length === 0) && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    } @if (!contentIsPage && modernTabs && modernTabs.length > 0 && !parameters?.LayoutComponent) {\n    <fd-tab-list\n        (selectedTabChange)=\"onTabChanged($event)\"\n        [collapseOverflow]=\"true\"\n        [stackContent]=\"false\"\n        maxContentHeight=\"auto\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        #tablist\n    >\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n        <fd-tab [title]=\"tab.Title!! | bbbTranslate\" [class.is-expanded]=\"selectedTab === tab.Title\">\n            <fd-dynamic-page-content [id]=\"tab.id\">\n                <fd-layout-grid>\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\" [tablist]=\"tablist\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fd-tab>\n        }\n    </fd-tab-list>\n    } @else { @if (!contentIsPage) {\n    <fd-tab-list\n        [collapseOverflow]=\"true\"\n        [stackContent]=\"false\"\n        maxContentHeight=\"auto\"\n        #tablist\n        class=\"extra-hide-tabs\"\n    >\n        <fd-tab title=\"\">\n            <fd-dynamic-page-content>\n                <fd-layout-grid style=\"min-height: 100%\">\n                    <div fdLayoutGridRow>\n                        <div\n                            style=\"padding: 0\"\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div\n                            style=\"min-height: 100%\"\n                            [fdLayoutGridCol]=\"12\"\n                            [colMd]=\"colMd\"\n                            [colLg]=\"colLg\"\n                            [colXl]=\"colXl\"\n                        >\n                            <ng-container\n                                *ngTemplateOutlet=\"\n                                    parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                                    context: {\n                                        $implicit: parameters?.LayoutComponent,\n                                        layout94: layout94\n                                    }\n                                \"\n                            ></ng-container>\n                        </div>\n                        <div\n                            style=\"padding: 0\"\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fd-tab>\n    </fd-tab-list>\n    } }\n    <fd-dynamic-page-footer>\n        <bsu-layout-actions\n            [canSend]=\"canSend\"\n            [buttons]=\"layoutActions\"\n            [isMobile]=\"isMobile\"\n            [landscape]=\"landscape\"\n            [standalone]=\"standalone\"\n            [workflowButtons]=\"workflowButtons\"\n            [workflowButtonsComboMode]=\"workflowButtonsComboMode\"\n            [deviceSize]=\"deviceSize\"\n            [rtl]=\"rtl\"\n            (toolClick)=\"toolbarClick.emit($event)\"\n            (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n        >\n        </bsu-layout-actions>\n    </fd-dynamic-page-footer>\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}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-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{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$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layout94", "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: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i7$6.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i7$6.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i7$6.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i4$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i13.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: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "defaultTab", "selectDefaultOnTabsChange", "focusFirstFocusableElement"], outputs: ["selectedTabChange", "selectedTabIndexChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i2$8.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", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { 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"], 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: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", 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", rtl: "rtl", 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" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_tabListComponent", first: true, predicate: TabListComponent, descendants: 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) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [subtitle]=\"subtitle | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        #titleRef\n    >\n        @if (!isMobile) {\n        <fd-breadcrumb>\n            @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n            breadCrumb; let i = $index; let last = $last) {\n            <fd-breadcrumb-item>\n                <bsu-breadcrumb\n                    [index]=\"i\"\n                    [isLast]=\"last\"\n                    [breadCrumb]=\"breadCrumb\"\n                    [allBreadCrumb]=\"breadCrumbs\"\n                ></bsu-breadcrumb>\n            </fd-breadcrumb-item>\n            } }\n        </fd-breadcrumb>\n        }\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n            <!-- <fd-toolbar\n        *ngIf=\"toolbarVisible\"\n        #formToolbar\n        fdType=\"transparent\"\n        [clearBorder]=\"true\"\n        [shouldOverflow]=\"deviceSize === 's'\"\n        [class.firefox]=\"isFirefox\"\n        >\n        <ng-container *ngFor=\"let btn of toolbarItems; let i = index; let last = last; let first = first\">\n          <fd-toolbar-separator\n            [attr.i]=\"i\"\n            [attr.last]=\"last\"\n            [attr.first]=\"first\"\n            *ngIf=\"(btn === '-' || btn.text === '-') && !last && !first\"\n          ></fd-toolbar-separator>\n          <ng-container *ngIf=\"btn.IAmMenu; else simpleButton\">\n            <fd-split-button\n              *ngIf=\"btn.isBuiltin\"\n              [dir]=\"dirValue\"\n              fd-toolbar-item\n              [attr.fdOverflowPriority]=\"'low'\"\n              [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\n              [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n              (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\n              (click)=\"menu2.open()\"\n              >\n              <fd-menu #menu2>\n                <li\n                  fd-menu-item\n                  *ngFor=\"let menuItem of btn.menu.items\"\n                  [disabled]=\"menuItem.disabled\"\n                  (click)=\"onToolbarClick(menuItem, menu2)\"\n                  >\n                  <div fd-menu-interactive>\n                    <fd-menu-addon\n                      position=\"before\"\n                                              [glyph]=\"\n                                                  menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\n                                              \"\n                      >\n                    </fd-menu-addon>\n                    <img\n                      class=\"mr8\"\n                      *ngIf=\"!menuItem.newIcon && menuItem.icon\"\n                      [src]=\"menuItem.icon\"\n                      />\n                      <span fd-menu-title>{{ menuItem.text }}</span>\n                    </div>\n                  </li>\n                </fd-menu>\n              </fd-split-button>\n              <button\n                *ngIf=\"!btn.isBuiltin\"\n                fd-button\n                fd-toolbar-item\n                [fdMenu]=\"true\"\n                [glyph]=\"btn.FontIcon\"\n                [style.color]=\"btn.IconColor\"\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\n                [label]=\"btn.text | bbbTranslate\"\n                [ariaLabel]=\"btn.text | bbbTranslate\"\n                [fdMenuTrigger]=\"menu\"\n                >\n                <img\n                  *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\n                  width=\"16\"\n                  [src]=\"btn.icon\"\n                  />\n                  <fd-menu #menu>\n                    <li\n                      fd-menu-item\n                      *ngFor=\"let menuItem of btn.menu.items\"\n                      [disabled]=\"menuItem.disabled\"\n                      (click)=\"onToolbarClick(menuItem, menu)\"\n                      >\n                      <div fd-menu-interactive>\n                        <fd-menu-addon\n                                              *ngIf=\"\n                                                  menuItem.newIcon ||\n                                                  menuItem.Data?.JsonExtraProp?.Icon ||\n                                                  menuItem.FontIcon ||\n                                                  menuItem.Data?.CustomUi?.Parameters?.Icon\n                                              \"\n                          position=\"before\"\n                                              [ngClass]=\"\n                                                  menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                                      ? 'fd-button--' +\n                                                        menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\n                                                      : ''\n                                              \"\n                          [style.color]=\"menuItem.IconColor\"\n                                              [glyph]=\"\n                                                  menuItem.newIcon ||\n                                                  menuItem.Data?.JsonExtraProp?.Icon ||\n                                                  menuItem.FontIcon ||\n                                                  menuItem.Data?.CustomUi?.Parameters?.Icon\n                                              \"\n                          >\n                        </fd-menu-addon>\n                        <img\n                          class=\"mr8\"\n                                              *ngIf=\"\n                                                  !(\n                                                      menuItem.newIcon ||\n                                                      menuItem.Data?.JsonExtraProp?.Icon ||\n                                                      menuItem.Data?.CustomUi?.Parameters?.Icon ||\n                                                      menuItem.FontIcon\n                                                  ) && menuItem.icon\n                                              \"\n                          [src]=\"menuItem.icon\"\n                          />\n                          <span fd-menu-title>{{ menuItem.text }}</span>\n                        </div>\n                      </li>\n                    </fd-menu>\n                  </button>\n                </ng-container>\n                <ng-template #simpleButton>\n                  <ng-container *ngIf=\"!(btn === '-' || btn.text === '-')\">\n                    <ng-container\n                                  *ngTemplateOutlet=\"\n                                      btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\n                                      context: { $implicit: btn }\n                                  \"\n                    ></ng-container>\n                    <ng-template #btnTemplate let-btn>\n                      <button\n                        fd-toolbar-item\n                        fd-button\n                        [disabled]=\"btn.disabled\"\n                        [attr.fdOverflowPriority]=\"btn.priority\"\n                                      [fdType]=\"\n                                          btn.isWorkflow\n                                              ? 'positive'\n                                              : btn.design\n                                              ? btn.design\n                                              : btn.Data?.JsonExtraProp?.Design\n                                      \"\n                        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\n                        (click)=\"onToolbarClick(btn)\"\n                        >\n                        <img\n                          *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\n                          width=\"16\"\n                          [src]=\"btn.icon\"\n                          />\n                          <span *ngIf=\"btn.text\">{{ btn.text }}</span>\n                        </button>\n                      </ng-template>\n                      <ng-template #dynamicBtnTemplate let-btn>\n                        <bnrc-dynamic-form-toolbaritem\n                          fd-toolbar-item\n                          [component]=\"btn.Data.CustomUi\"\n                          [context]=\"btn\"\n                          [isEnable]=\"btn.Command?._isEnable\"\n                          (btnClick)=\"onToolbarClick(btn)\"\n                        ></bnrc-dynamic-form-toolbaritem>\n                      </ng-template>\n                    </ng-container>\n                  </ng-template>\n                </ng-container>\n              </fd-toolbar> -->\n            <!-- <bsu-ui-form-panel-toolbar\n              [buttons]=\"toolbarItems | tlbButtons: 'inFooter':false\"\n              [size]=\"size\"\n              [deviceSize]=\"deviceSize$ | async\"\n              [visible]=\"toolbarVisible\"\n              (toolClick)=\"onToolbarClick($event)\"\n            ></bsu-ui-form-panel-toolbar> -->\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin\"\n        [collapsible]=\"!!workflowInfoText || (facetList && facetList.length > 0)\"\n        [pinnable]=\"true\"\n        [collapsed]=\"(!facetList || facetList.length === 0) && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    } @if (!contentIsPage && modernTabs && modernTabs.length > 0 && !parameters?.LayoutComponent) {\n    <fd-tab-list\n        (selectedTabChange)=\"onTabChanged($event)\"\n        [collapseOverflow]=\"true\"\n        [stackContent]=\"false\"\n        maxContentHeight=\"auto\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        #tablist\n    >\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n        <fd-tab [title]=\"tab.Title!! | bbbTranslate\" [class.is-expanded]=\"selectedTab === tab.Title\">\n            <fd-dynamic-page-content [id]=\"tab.id\">\n                <fd-layout-grid>\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\" [tablist]=\"tablist\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fd-tab>\n        }\n    </fd-tab-list>\n    } @else { @if (!contentIsPage) {\n    <fd-tab-list\n        [collapseOverflow]=\"true\"\n        [stackContent]=\"false\"\n        maxContentHeight=\"auto\"\n        #tablist\n        class=\"extra-hide-tabs\"\n    >\n        <fd-tab title=\"\">\n            <fd-dynamic-page-content>\n                <fd-layout-grid style=\"min-height: 100%\">\n                    <div fdLayoutGridRow>\n                        <div\n                            style=\"padding: 0\"\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div\n                            style=\"min-height: 100%\"\n                            [fdLayoutGridCol]=\"12\"\n                            [colMd]=\"colMd\"\n                            [colLg]=\"colLg\"\n                            [colXl]=\"colXl\"\n                        >\n                            <ng-container\n                                *ngTemplateOutlet=\"\n                                    parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                                    context: {\n                                        $implicit: parameters?.LayoutComponent,\n                                        layout94: layout94\n                                    }\n                                \"\n                            ></ng-container>\n                        </div>\n                        <div\n                            style=\"padding: 0\"\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fd-tab>\n    </fd-tab-list>\n    } }\n    <fd-dynamic-page-footer>\n        <bsu-layout-actions\n            [canSend]=\"canSend\"\n            [buttons]=\"layoutActions\"\n            [isMobile]=\"isMobile\"\n            [landscape]=\"landscape\"\n            [standalone]=\"standalone\"\n            [workflowButtons]=\"workflowButtons\"\n            [workflowButtonsComboMode]=\"workflowButtonsComboMode\"\n            [deviceSize]=\"deviceSize\"\n            [rtl]=\"rtl\"\n            (toolClick)=\"toolbarClick.emit($event)\"\n            (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n        >\n        </bsu-layout-actions>\n    </fd-dynamic-page-footer>\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}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-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{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$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layout94", "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: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i7$6.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i7$6.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i7$6.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i4$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i13.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: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "defaultTab", "selectDefaultOnTabsChange", "focusFirstFocusableElement"], outputs: ["selectedTabChange", "selectedTabIndexChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i2$8.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", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { 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"], 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: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
@@ -8778,7 +8781,7 @@ class UiLinearListContainerWithButtonComponent extends DeviceInfoFieldBaseCompon
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiLinearListContainerWithButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiLinearListContainerWithButtonComponent, selector: "bsu-ui-linear-list-container-with-button", inputs: { UlvUi: "UlvUi", GetTextItemValue: "GetTextItemValue", show: "show", hide: "hide", hidden: "hidden", GetSelectionData: "GetSelectionData" }, host: { listeners: { "keydown.enter": "onKeyEnter($event)", "keydown.arrowdown": "onKeyDown($event)", "keydown.esc": "onKeyEsc($event)" } }, viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }, { propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\n    [inputId]=\"id\"\n    [class.control-readonly]=\"(readonly$ | async) === true\"\n    [dropdownValues]=\"(dropDownValues$ | async)!!\"\n    [placeholder]=\"Setting.ControlFieldCaptionTranslated | bbbTranslate\"\n    [displayFn]=\"displayFunc\"\n    [showAllButton]=\"false\"\n    [displayAddonButton]=\"(disableOrReadonly$ | async) !== true\"\n    [allowNewTokens]=\"false\"\n    [includes]=\"true\"\n    [(ngModel)]=\"idsOfMo\"\n    [disabled]=\"(disable$ | async) === true\"\n    [valueFn]=\"valueFn\"\n    (searchTermChange)=\"onSearchTermChange($event)\"\n    (selectedChange)=\"onSelectedChange($event)\"\n    (addOnButtonClicked)=\"_handleAddonButtonClicked()\"\n></fd-multi-input>\n\n<!-- <button\n*ngIf=\"report\"\nfd-button\n[attr.rtl]=\"rtl\"\n[aria-label]=\"'Advanced' | bbbTranslate\"\nglyph=\"value-help\"\n[disabled]=\"(disableOrReadonly$ | async)!!\"\n(click)=\"onOpenReport()\"\n></button> -->\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (dialogConfig.height !== '100vh') {\n                    <fd-button-bar\n                        ariaLabel=\"fullscreen\"\n                        [glyph]=\"dialog.data.fullscreen ? 'exitfullscreen' : 'resize'\"\n                        fullscreenDialog\n                        [fullscreen]=\"dialog.data.fullscreen\"\n                        (fullscreenChanged)=\"dialog.data.fullscreen = $event\"\n                        [dialog]=\"dialog\"\n                        [dialogComponent]=\"dialogTpl\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDismiss()\"></fd-button-bar>\n                </div>\n            </ng-template>\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\n      <button fd-dialog-close-button></button> -->\n        </fd-dialog-header>\n        <fd-dialog-body>\n            @if (dialog.data.ulvUi; as ulvUi) {\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\" class=\"linear-list-selection\"></bsu-ui-ulv-main-ui>\n\n            }\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\n                        ({{ dialog.data.selectedItems?.length || 0 }})\n                    </ng-container>\n                </h5>\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (dialog.data.selectedItems) {\n                        <fd-toolbar>\n                            <!-- Selected items -->\n                            @for ( item of dialog.data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\n                            selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected(item)\"\n                                >{{ item.Text }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        [aria-label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClear()\"\n                    ></button>\n                </div>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        [label]=\"'OK' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk()\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        [label]=\"'Cancel' | bbbTranslate\"\n                        fdType=\"transparent\"\n                        (click)=\"onDismiss()\"\n                    ></button>\n                </div>\n            </ng-template>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:flex;align-items:center}:host ::ng-deep fd-multi-input .fd-input-group{cursor:default}fd-multi-input{flex-grow:1}button[rtl=true]{margin-right:5px}button[rtl=false]{margin-left:5px}::ng-deep .fd-toolbar{display:flex;flex-wrap:wrap;row-gap:5px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$7.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "tokenHiddenId"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]", inputs: ["dialog", "dialogComponent", "fullscreen"], outputs: ["fullscreenChanged"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiLinearListContainerWithButtonComponent, selector: "bsu-ui-linear-list-container-with-button", inputs: { UlvUi: "UlvUi", GetTextItemValue: "GetTextItemValue", show: "show", hide: "hide", hidden: "hidden", GetSelectionData: "GetSelectionData" }, host: { listeners: { "keydown.enter": "onKeyEnter($event)", "keydown.arrowdown": "onKeyDown($event)", "keydown.esc": "onKeyEsc($event)" } }, viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }, { propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\n    [inputId]=\"id\"\n    [class.control-readonly]=\"(readonly$ | async) === true\"\n    [dropdownValues]=\"(dropDownValues$ | async)!!\"\n    [placeholder]=\"Setting.ControlFieldCaptionTranslated | bbbTranslate\"\n    [displayFn]=\"displayFunc\"\n    [showAllButton]=\"false\"\n    [displayAddonButton]=\"(disableOrReadonly$ | async) !== true\"\n    [allowNewTokens]=\"false\"\n    [includes]=\"true\"\n    [(ngModel)]=\"idsOfMo\"\n    [disabled]=\"(disable$ | async) === true\"\n    [valueFn]=\"valueFn\"\n    (searchTermChange)=\"onSearchTermChange($event)\"\n    (selectedChange)=\"onSelectedChange($event)\"\n    (addOnButtonClicked)=\"_handleAddonButtonClicked()\"\n></fd-multi-input>\n\n<!-- <button\n*ngIf=\"report\"\nfd-button\n[attr.rtl]=\"rtl\"\n[aria-label]=\"'Advanced' | bbbTranslate\"\nglyph=\"value-help\"\n[disabled]=\"(disableOrReadonly$ | async)!!\"\n(click)=\"onOpenReport()\"\n></button> -->\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (dialogConfig.height !== '100vh') {\n                    <fd-button-bar\n                        ariaLabel=\"fullscreen\"\n                        [glyph]=\"dialog.data.fullscreen ? 'exitfullscreen' : 'resize'\"\n                        fullscreenDialog\n                        [fullscreen]=\"dialog.data.fullscreen\"\n                        (fullscreenChanged)=\"dialog.data.fullscreen = $event\"\n                        [dialog]=\"dialog\"\n                        [dialogComponent]=\"dialogTpl\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDismiss()\"></fd-button-bar>\n                </div>\n            </ng-template>\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\n      <button fd-dialog-close-button></button> -->\n        </fd-dialog-header>\n        <fd-dialog-body>\n            @if (dialog.data.ulvUi; as ulvUi) {\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\" class=\"linear-list-selection\"></bsu-ui-ulv-main-ui>\n\n            }\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\n                        ({{ dialog.data.selectedItems?.length || 0 }})\n                    </ng-container>\n                </h5>\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (dialog.data.selectedItems) {\n                        <fd-toolbar>\n                            <!-- Selected items -->\n                            @for ( item of dialog.data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\n                            selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected(item)\"\n                                >{{ item.Text }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        [aria-label]=\"'Clear' | bbbTranslate\"\n                        (click)=\"onClear()\"\n                    ></button>\n                </div>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        [label]=\"'OK' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk()\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        [label]=\"'Cancel' | bbbTranslate\"\n                        fdType=\"transparent\"\n                        (click)=\"onDismiss()\"\n                    ></button>\n                </div>\n            </ng-template>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{display:flex;align-items:center}:host ::ng-deep fd-multi-input .fd-input-group{cursor:default}fd-multi-input{flex-grow:1}button[rtl=true]{margin-right:5px}button[rtl=false]{margin-left:5px}::ng-deep .fd-toolbar{display:flex;flex-wrap:wrap;row-gap:5px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$7.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "tokenHiddenId"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]", inputs: ["dialog", "dialogComponent", "fullscreen"], outputs: ["fullscreenChanged"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiLinearListContainerWithButtonComponent, decorators: [{
             type: Component,
@@ -8914,7 +8917,7 @@ class GlobalSearchComponent extends BaseComponent {
         BarsaApi.Bw.Form.Show({ Mo: this.mo });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: GlobalSearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: GlobalSearchComponent, selector: "bsu-global-search", inputs: { mo: "mo", compact: "compact" }, usesInheritance: true, ngImport: i0, template: "<fd-input-group\n    style=\"width: 100%\"\n    type=\"search\"\n    glyph=\"search\"\n    [glyphAriaLabel]=\"'Search' | bbbTranslate\"\n    [placeholder]=\"'Search' | bbbTranslate\"\n    [button]=\"true\"\n    [disabled]=\"false\"\n    [(ngModel)]=\"searchTerm\"\n    (addOnButtonClicked)=\"onSearchSubmit()\"\n    (keydown.enter)=\"onSearchSubmit()\"\n>\n</fd-input-group>\n", styles: [":host{display:inline-block;min-width:320px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: GlobalSearchComponent, selector: "bsu-global-search", inputs: { mo: "mo", compact: "compact" }, usesInheritance: true, ngImport: i0, template: "<fd-input-group\n    style=\"width: 100%\"\n    type=\"search\"\n    glyph=\"search\"\n    [glyphAriaLabel]=\"'Search' | bbbTranslate\"\n    [placeholder]=\"'Search' | bbbTranslate\"\n    [button]=\"true\"\n    [disabled]=\"false\"\n    [(ngModel)]=\"searchTerm\"\n    (addOnButtonClicked)=\"onSearchSubmit()\"\n    (keydown.enter)=\"onSearchSubmit()\"\n>\n</fd-input-group>\n", styles: [":host{display:inline-block;min-width:320px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: GlobalSearchComponent, decorators: [{
             type: Component,
@@ -9001,7 +9004,7 @@ class CaptchaFieldComponent extends FieldBaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CaptchaFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: CaptchaFieldComponent, selector: "bsu-captcha-field", usesInheritance: true, ngImport: i0, template: "<input\r\n    fd-form-control\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n    type=\"text\"\r\n    [value]=\"!value ? '' : value\"\r\n    [id]=\"id\"\r\n    (input)=\"onValueChange($event)\"\r\n/>\r\n<div id=\"captchaCommand\">\r\n    <img [src]=\"'/api/auth/captcha?capId=' + capId + '&t=' + now\" />\r\n    <button\r\n        fd-button\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'refresh'\"\r\n        aria-label=\"refresh\"\r\n        title=\"captcha\"\r\n        (click)=\"onRefresh()\"\r\n    ></button>\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;gap:.2rem}#captchaCommand{flex-grow:1;display:flex;width:100%;align-items:center;justify-content:start}img{flex-grow:1;max-width:170px;height:40px;width:auto}input{font-size:1rem}@media (max-width: 599px){img{max-width:140px}}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: CaptchaFieldComponent, selector: "bsu-captcha-field", usesInheritance: true, ngImport: i0, template: "<input\r\n    fd-form-control\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n    type=\"text\"\r\n    [value]=\"!value ? '' : value\"\r\n    [id]=\"id\"\r\n    (input)=\"onValueChange($event)\"\r\n/>\r\n<div id=\"captchaCommand\">\r\n    <img [src]=\"'/api/auth/captcha?capId=' + capId + '&t=' + now\" />\r\n    <button\r\n        fd-button\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'refresh'\"\r\n        aria-label=\"refresh\"\r\n        title=\"captcha\"\r\n        (click)=\"onRefresh()\"\r\n    ></button>\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;gap:.2rem}#captchaCommand{flex-grow:1;display:flex;width:100%;align-items:center;justify-content:start}img{flex-grow:1;max-width:170px;height:40px;width:auto}input{font-size:1rem}@media (max-width: 599px){img{max-width:140px}}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CaptchaFieldComponent, decorators: [{
             type: Component,
@@ -9138,7 +9141,7 @@ class UiWorkflowPanelUiComponent extends BaseComponent {
         btn.handler(btn, this.context);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiWorkflowPanelUiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiWorkflowPanelUiComponent, selector: "bsu-ui-workflow-panel-ui", inputs: { context: "context", infoHtml: "infoHtml", showInfoBar: "showInfoBar", buttonList: "buttonList" }, usesInheritance: true, ngImport: i0, template: "<fd-bar-element>\n  @for (btn of buttonList.slice().reverse(); track btn; let i = $index) {\n    <button\n      fd-button\n      [fdType]=\"i === 0 ? 'emphasized' : 'standard'\"\n      [label]=\"btn.text\"\n      [glyph]=\"btn.Data?.JsonExtraProp?.Icon\"\n      (click)=\"onToolClick(btn)\"\n    ></button>\n  }\n</fd-bar-element>\n", styles: ["button{margin:0 5px;min-width:60px}fd-bar-element:last-child{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiWorkflowPanelUiComponent, selector: "bsu-ui-workflow-panel-ui", inputs: { context: "context", infoHtml: "infoHtml", showInfoBar: "showInfoBar", buttonList: "buttonList" }, usesInheritance: true, ngImport: i0, template: "<fd-bar-element>\n  @for (btn of buttonList.slice().reverse(); track btn; let i = $index) {\n    <button\n      fd-button\n      [fdType]=\"i === 0 ? 'emphasized' : 'standard'\"\n      [label]=\"btn.text\"\n      [glyph]=\"btn.Data?.JsonExtraProp?.Icon\"\n      (click)=\"onToolClick(btn)\"\n    ></button>\n  }\n</fd-bar-element>\n", styles: ["button{margin:0 5px;min-width:60px}fd-bar-element:last-child{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiWorkflowPanelUiComponent, decorators: [{
             type: Component,
@@ -9257,7 +9260,7 @@ class UlMsgBoxAdapterComponent extends BaseComponent {
         return '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlMsgBoxAdapterComponent, deps: [{ token: i1$1.DialogService }, { token: i1$1.ContentDensityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlMsgBoxAdapterComponent, selector: "bsu-ul-msg-box-adapter", inputs: { context: "context" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true }, { propertyName: "waitRef", first: true, predicate: ["waitRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #waitRef [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\">\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-body\n            style=\"background-color: transparent\"\n            class=\"tw-flex tw-flex-col tw-items-center tw-justify-center\"\n        >\n            @if(dialog.data && dialog.data.title){\n            <div\n                _ngcontent-ng-c678863778=\"\"\n                class=\"tw-flex tw-flex-col tw-justify-start tw-items-center tw-p-4\"\n                style=\"\n                    color: white;\n                    min-width: 210px;\n                    width: auto;\n                    height: 160px;\n                    background: white;\n                    position: relative;\n                    gap: 1rem;\n                    border-radius: 0.625rem;\n                \"\n            >\n                <h3 fd-title *ngIf=\"dialog.data?.title\">{{ dialog.data?.title }}</h3>\n                <fd-text *ngIf=\"dialog.data?.msg\" [text]=\"dialog.data?.msg\" [whitespaces]=\"true\"></fd-text>\n                <div style=\"position: relative; width: 100%\">\n                    <bsu-mask></bsu-mask>\n                </div>\n            </div>\n            }@else {\n            <bsu-mask></bsu-mask>\n            }\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #templateRef>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title>\n                {{ dialogConfig.title }}\n            </h1>\n        </fd-dialog-header>\n\n        <fd-dialog-body style=\"padding: 15px; max-width: 480px\">\n            <div style=\"min-height: 125px\">\n                <label fd-label [type]=\"dialogConfig.iconType\" [innerHtml]=\"dialogConfig.msg\"> </label>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            @for (btn of dialogConfig.buttons | keyvalue: keepOrder; track btn) {\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"\n                        btn.key === 'ok' || btn.key === 'yes'\n                            ? 'emphasized'\n                            : btn.key === 'no'\n                            ? 'standard'\n                            : 'transparent'\n                    \"\n                    [label]=\"btn.key + '' | titlecase | bbbTranslate\"\n                    (click)=\"onButton(btn, dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n            }\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$1.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlMsgBoxAdapterComponent, selector: "bsu-ul-msg-box-adapter", inputs: { context: "context" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true }, { propertyName: "waitRef", first: true, predicate: ["waitRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #waitRef [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\">\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-body\n            style=\"background-color: transparent\"\n            class=\"tw-flex tw-flex-col tw-items-center tw-justify-center\"\n        >\n            @if(dialog.data && dialog.data.title){\n            <div\n                _ngcontent-ng-c678863778=\"\"\n                class=\"tw-flex tw-flex-col tw-justify-start tw-items-center tw-p-4\"\n                style=\"\n                    color: white;\n                    min-width: 210px;\n                    width: auto;\n                    height: 160px;\n                    background: white;\n                    position: relative;\n                    gap: 1rem;\n                    border-radius: 0.625rem;\n                \"\n            >\n                <h3 fd-title *ngIf=\"dialog.data?.title\">{{ dialog.data?.title }}</h3>\n                <fd-text *ngIf=\"dialog.data?.msg\" [text]=\"dialog.data?.msg\" [whitespaces]=\"true\"></fd-text>\n                <div style=\"position: relative; width: 100%\">\n                    <bsu-mask></bsu-mask>\n                </div>\n            </div>\n            }@else {\n            <bsu-mask></bsu-mask>\n            }\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #templateRef>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title>\n                {{ dialogConfig.title }}\n            </h1>\n        </fd-dialog-header>\n\n        <fd-dialog-body style=\"padding: 15px; max-width: 480px\">\n            <div style=\"min-height: 125px\">\n                <label fd-label [type]=\"dialogConfig.iconType\" [innerHtml]=\"dialogConfig.msg\"> </label>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            @for (btn of dialogConfig.buttons | keyvalue: keepOrder; track btn) {\n            <fd-dialog-footer-button>\n                <button\n                    fd-button\n                    fd-dialog-decisive-button\n                    [fdType]=\"\n                        btn.key === 'ok' || btn.key === 'yes'\n                            ? 'emphasized'\n                            : btn.key === 'no'\n                            ? 'standard'\n                            : 'transparent'\n                    \"\n                    [label]=\"btn.key + '' | titlecase | bbbTranslate\"\n                    (click)=\"onButton(btn, dialog, dialogConfig)\"\n                ></button>\n            </fd-dialog-footer-button>\n            }\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$1.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlMsgBoxAdapterComponent, decorators: [{
             type: Component,
@@ -9277,7 +9280,7 @@ class UiMoInfoComboViewerComponent extends FieldBaseComponent {
         this.context.fireEvent('ButtonClick', this.context);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMoInfoComboViewerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMoInfoComboViewerComponent, selector: "bsu-ui-mo-info-combo-viewer", usesInheritance: true, ngImport: i0, template: "<fd-text class=\"bold\" [text]=\"value | bbbTranslate\" hyphenation=\"auto\"></fd-text>\n@if ((disableOrReadonly$ | async) !== true && !Setting.IsReadOnly && Setting.ViewRelatedFormType !== 'Hide') {\n<button fd-button [glyph]=\"'edit'\" [fdType]=\"'transparent'\" (click)=\"onBtnClick()\"></button>\n}\n", styles: [":host{display:flex;height:auto;align-items:center}h5{align-self:center}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMoInfoComboViewerComponent, selector: "bsu-ui-mo-info-combo-viewer", usesInheritance: true, ngImport: i0, template: "<fd-text class=\"bold\" [text]=\"value | bbbTranslate\" hyphenation=\"auto\"></fd-text>\n@if ((disableOrReadonly$ | async) !== true && !Setting.IsReadOnly && Setting.ViewRelatedFormType !== 'Hide') {\n<button fd-button [glyph]=\"'edit'\" [fdType]=\"'transparent'\" (click)=\"onBtnClick()\"></button>\n}\n", styles: [":host{display:flex;height:auto;align-items:center}h5{align-self:center}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMoInfoComboViewerComponent, decorators: [{
             type: Component,
@@ -9628,7 +9631,7 @@ class UiPicturesInfoComponent extends DeviceInfoFieldBaseComponent {
         this.value = value;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPicturesInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPicturesInfoComponent, selector: "bsu-ui-pictures-info", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "gallery", first: true, predicate: ["gallery"], descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    #uploader\n    [style.display]=\"'none'\"\n    [id]=\"id\"\n    [name]=\"'pictures_' + id\"\n    [placeholder]=\"'AttachPicture' | bbbTranslate\"\n    [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\n    [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\n    accept=\".png,.jpg,.bpm,.jpeg,.gif,.png,.tif\"\n    [fileLimit]=\"maxFileCount === 0 ? 100 : maxFileCount\"\n    [multiple]=\"maxFileCount === 0 || maxFileCount > 1\"\n    (selectedFilesChanged)=\"onFileSelection($event)\"\n></fd-file-uploader>\n\n<ng-container *ngTemplateOutlet=\"layoutGridTpl\"></ng-container>\n<ng-template #layoutGridTpl let-inDialog=\"inDialog\">\n    <fd-layout-grid>\n        @if (mediaData$ | async; as mediaData) {\n        <div fdLayoutGridRow>\n            @for (media of mediaData; track media; let i = $index) {\n            <div [fdLayoutGridCol]=\"6\" [colMd]=\"3\" [colLg]=\"2\" [colXl]=\"2\" (click)=\"onMedaiClick(media, i)\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        cardTpl;\n                        context: { $implicit: media, mediaData: this.mediaData, inDialog: this.inDialog, index: i }\n                    \"\n                ></ng-container>\n            </div>\n            } @if (!inDialog && (disableOrReadonly$ | async) === true ? false : true) {\n            <div [fdLayoutGridCol]=\"6\" [colMd]=\"3\" [colLg]=\"2\" [colXl]=\"2\">\n                <ng-container *ngTemplateOutlet=\"newFile\"></ng-container>\n            </div>\n            }\n        </div>\n        }\n    </fd-layout-grid>\n</ng-template>\n<ng-template #cardTpl let-media let-mediaData=\"mediaData\" let-inDialog=\"inDialog\" let-index=\"index\">\n    <fd-card class=\"media\" [class.inDialog]=\"inDialog\">\n        <fd-card-content style=\"text-align: center; height: 120px\">\n            <img imgLazy [imgLazy]=\"media.thumbnailUrl\" [src]=\"media.thumbnailUrl\" />\n        </fd-card-content>\n        @if (!inDialog) {\n        <fd-card-footer>\n            <button\n                glyph=\"message-information\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                [fd-inline-help]=\"media.title\"\n                [triggers]=\"['click']\"\n                [closeOnOutsideClick]=\"true\"\n            ></button>\n            <button\n                glyph=\"full-screen\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                (click)=\"onFullscreen(media, mediaData)\"\n            ></button>\n            @if ((disableOrReadonly$ | async) === true ? false : true) {\n            <button\n                glyph=\"delete\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                (click)=\"onDelete(index)\"\n            ></button>\n            }\n        </fd-card-footer>\n        }\n    </fd-card>\n</ng-template>\n<ng-template #newFile>\n    <div style=\"position: relative; height: 100%\">\n        <fd-card>\n            <fd-card-content style=\"display: flex; align-items: center; justify-content: center; min-height: 120px\">\n                <button\n                    fd-button\n                    glyph=\"add-photo\"\n                    fdType=\"transparent\"\n                    [label]=\"'AttachFile' | bbbTranslate\"\n                    (click)=\"uploader.open()\"\n                ></button>\n            </fd-card-content>\n\n            <fd-card-footer style=\"border-top: 1px solid #ccc\">\n                <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\n                <fd-menu #menu>\n                    <li fd-menu-item (click)=\"onScan()\">\n                        <a fd-menu-interactive>\n                            <span fd-menu-title>{{ 'Scan' | bbbTranslate }}</span>\n                        </a>\n                    </li>\n                    <li fd-menu-item (click)=\"onAdvanceScan()\">\n                        <a fd-menu-interactive>\n                            <span fd-menu-title>{{ 'AdvancedScan' | bbbTranslate }}</span>\n                        </a>\n                    </li>\n                </fd-menu>\n            </fd-card-footer>\n        </fd-card>\n        @if ((uploadingState$ | async)?.uploading === true) {\n        <bsu-mask></bsu-mask>\n        }\n    </div>\n</ng-template>\n<ng-template #dialogTemplate let-dialog let-dialogConfig=\"dialogConfig\">\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl class=\"vertical\">\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 fd-title>{{ Setting.ControlFieldCaptionTranslated }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (!dialogConfig.fullscreen) {\n                    <fd-button-bar\n                        ariaLabel=\"Fit image size\"\n                        [glyph]=\"'resize'\"\n                        [fdType]=\"fillWidth ? 'emphasized' : 'transparent'\"\n                        (click)=\"fillWidth = !fillWidth\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"dialog.close()\"></fd-button-bar>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n        <fd-dialog-body #fdbody>\n            <div #gallery class=\"gallery inDialog\" style=\"flex: 1\">\n                @for (media of dialog.data.mediaData; track media; let i = $index) {\n                <div\n                    class=\"column big-imgs-box\"\n                    [class.fill-width]=\"fillWidth\"\n                    [class.fill-all]=\"fillAll\"\n                    [class.fill-original]=\"fillOriginal\"\n                    [ngClass]=\"selectedZoom\"\n                >\n                    <div class=\"pics\" [id]=\"i\">\n                        <bsu-mask></bsu-mask>\n                        <img imgLazy [imgLazy]=\"media.mediaUrl\" [src]=\"media.mediaUrl\" />\n                    </div>\n                </div>\n                }\n            </div>\n            @if ((deviceSize$ | async) !== 's') {\n            <div class=\"thumbnail\" style=\"flex-shrink: 1\">\n                <ng-cotainer *ngTemplateOutlet=\"layoutGridTpl; context: { inDialog: true }\"></ng-cotainer>\n            </div>\n            }\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{position:relative}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}fd-toolbar{width:100%}fd-dialog-footer{justify-content:center}.hatchBackground{min-height:100px}.gallery{display:flex;width:100%;height:400px;column-gap:1px;background-color:var(--sapField_Background, #fff)}.gallery ::-webkit-scrollbar{width:7px;height:7px}.gallery ::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:4px}.gallery ::-webkit-scrollbar-thumb{background:#555454;border-radius:4px}.gallery ::-webkit-scrollbar-thumb:hover{background:#2c2b2b}.gallery .column{overflow-y:scroll;display:flex;flex-direction:column;row-gap:3%;align-items:center}.gallery .column .pics{width:100%;display:flex;justify-content:center}.gallery .column .pics img{border-radius:5px}.gallery .column.small-imgs-box{flex:10%}.gallery .column.big-imgs-box{flex:90%}.gallery .selected{background-color:#fff;border:3px solid #0294d8;padding:10px}.gallery .fill-all .pics{height:100%}.gallery .fill-all img{width:100%!important;height:100%!important;object-fit:fill!important}.gallery .fill-original img{width:unset;height:unset}.gallery .zoom1 img{zoom:1}.gallery .zoom1-5 img{zoom:1.5}.gallery .zoom2 img{zoom:2}fd-dialog .gallery{overflow:auto}fd-dialog .gallery .column{overflow:initial}fd-dialog .gallery .pics{position:relative}fd-dialog fd-dialog-body{display:flex}fd-dialog.horizontal fd-dialog-body{flex-direction:column}fd-dialog.horizontal .gallery{flex-direction:row}fd-dialog.horizontal .thumbnail{border-top:1px solid #ccc;overflow-x:auto}fd-dialog.vertical fd-dialog-body{flex-direction:row-reverse}fd-dialog.vertical .gallery{flex-direction:column;height:100%}fd-dialog.vertical .thumbnail{border-left:1px solid #ccc;height:100%;width:200px;overflow-y:auto}fd-dialog.vertical .thumbnail ::ng-deep .fd-row>div{width:100%;min-width:100%}fd-card.media fd-card-footer button{border:none}fd-card.inDialog fd-card-header{padding-top:5px;padding-bottom:5px}.fd-col{min-width:165px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "directive", type: i7$8.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPicturesInfoComponent, selector: "bsu-ui-pictures-info", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "gallery", first: true, predicate: ["gallery"], descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    #uploader\n    [style.display]=\"'none'\"\n    [id]=\"id\"\n    [name]=\"'pictures_' + id\"\n    [placeholder]=\"'AttachPicture' | bbbTranslate\"\n    [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\n    [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\n    accept=\".png,.jpg,.bpm,.jpeg,.gif,.png,.tif\"\n    [fileLimit]=\"maxFileCount === 0 ? 100 : maxFileCount\"\n    [multiple]=\"maxFileCount === 0 || maxFileCount > 1\"\n    (selectedFilesChanged)=\"onFileSelection($event)\"\n></fd-file-uploader>\n\n<ng-container *ngTemplateOutlet=\"layoutGridTpl\"></ng-container>\n<ng-template #layoutGridTpl let-inDialog=\"inDialog\">\n    <fd-layout-grid>\n        @if (mediaData$ | async; as mediaData) {\n        <div fdLayoutGridRow>\n            @for (media of mediaData; track media; let i = $index) {\n            <div [fdLayoutGridCol]=\"6\" [colMd]=\"3\" [colLg]=\"2\" [colXl]=\"2\" (click)=\"onMedaiClick(media, i)\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        cardTpl;\n                        context: { $implicit: media, mediaData: this.mediaData, inDialog: this.inDialog, index: i }\n                    \"\n                ></ng-container>\n            </div>\n            } @if (!inDialog && (disableOrReadonly$ | async) === true ? false : true) {\n            <div [fdLayoutGridCol]=\"6\" [colMd]=\"3\" [colLg]=\"2\" [colXl]=\"2\">\n                <ng-container *ngTemplateOutlet=\"newFile\"></ng-container>\n            </div>\n            }\n        </div>\n        }\n    </fd-layout-grid>\n</ng-template>\n<ng-template #cardTpl let-media let-mediaData=\"mediaData\" let-inDialog=\"inDialog\" let-index=\"index\">\n    <fd-card class=\"media\" [class.inDialog]=\"inDialog\">\n        <fd-card-content style=\"text-align: center; height: 120px\">\n            <img imgLazy [imgLazy]=\"media.thumbnailUrl\" [src]=\"media.thumbnailUrl\" />\n        </fd-card-content>\n        @if (!inDialog) {\n        <fd-card-footer>\n            <button\n                glyph=\"message-information\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                [fd-inline-help]=\"media.title\"\n                [triggers]=\"['click']\"\n                [closeOnOutsideClick]=\"true\"\n            ></button>\n            <button\n                glyph=\"full-screen\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                (click)=\"onFullscreen(media, mediaData)\"\n            ></button>\n            @if ((disableOrReadonly$ | async) === true ? false : true) {\n            <button\n                glyph=\"delete\"\n                *fdCardFooterActionItem\n                fd-button\n                fdType=\"transparent\"\n                (click)=\"onDelete(index)\"\n            ></button>\n            }\n        </fd-card-footer>\n        }\n    </fd-card>\n</ng-template>\n<ng-template #newFile>\n    <div style=\"position: relative; height: 100%\">\n        <fd-card>\n            <fd-card-content style=\"display: flex; align-items: center; justify-content: center; min-height: 120px\">\n                <button\n                    fd-button\n                    glyph=\"add-photo\"\n                    fdType=\"transparent\"\n                    [label]=\"'AttachFile' | bbbTranslate\"\n                    (click)=\"uploader.open()\"\n                ></button>\n            </fd-card-content>\n\n            <fd-card-footer style=\"border-top: 1px solid #ccc\">\n                <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\n                <fd-menu #menu>\n                    <li fd-menu-item (click)=\"onScan()\">\n                        <a fd-menu-interactive>\n                            <span fd-menu-title>{{ 'Scan' | bbbTranslate }}</span>\n                        </a>\n                    </li>\n                    <li fd-menu-item (click)=\"onAdvanceScan()\">\n                        <a fd-menu-interactive>\n                            <span fd-menu-title>{{ 'AdvancedScan' | bbbTranslate }}</span>\n                        </a>\n                    </li>\n                </fd-menu>\n            </fd-card-footer>\n        </fd-card>\n        @if ((uploadingState$ | async)?.uploading === true) {\n        <bsu-mask></bsu-mask>\n        }\n    </div>\n</ng-template>\n<ng-template #dialogTemplate let-dialog let-dialogConfig=\"dialogConfig\">\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl class=\"vertical\">\n        <fd-dialog-header>\n            <ng-template fdkTemplate=\"header\">\n                <div fd-bar-left>\n                    <fd-bar-element>\n                        <h1 fd-title>{{ Setting.ControlFieldCaptionTranslated }}</h1>\n                    </fd-bar-element>\n                </div>\n                <div fd-bar-right>\n                    @if (!dialogConfig.fullscreen) {\n                    <fd-button-bar\n                        ariaLabel=\"Fit image size\"\n                        [glyph]=\"'resize'\"\n                        [fdType]=\"fillWidth ? 'emphasized' : 'transparent'\"\n                        (click)=\"fillWidth = !fillWidth\"\n                    ></fd-button-bar>\n                    }\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"dialog.close()\"></fd-button-bar>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n        <fd-dialog-body #fdbody>\n            <div #gallery class=\"gallery inDialog\" style=\"flex: 1\">\n                @for (media of dialog.data.mediaData; track media; let i = $index) {\n                <div\n                    class=\"column big-imgs-box\"\n                    [class.fill-width]=\"fillWidth\"\n                    [class.fill-all]=\"fillAll\"\n                    [class.fill-original]=\"fillOriginal\"\n                    [ngClass]=\"selectedZoom\"\n                >\n                    <div class=\"pics\" [id]=\"i\">\n                        <bsu-mask></bsu-mask>\n                        <img imgLazy [imgLazy]=\"media.mediaUrl\" [src]=\"media.mediaUrl\" />\n                    </div>\n                </div>\n                }\n            </div>\n            @if ((deviceSize$ | async) !== 's') {\n            <div class=\"thumbnail\" style=\"flex-shrink: 1\">\n                <ng-cotainer *ngTemplateOutlet=\"layoutGridTpl; context: { inDialog: true }\"></ng-cotainer>\n            </div>\n            }\n        </fd-dialog-body>\n    </fd-dialog>\n</ng-template>\n", styles: [":host{position:relative}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}fd-toolbar{width:100%}fd-dialog-footer{justify-content:center}.hatchBackground{min-height:100px}.gallery{display:flex;width:100%;height:400px;column-gap:1px;background-color:var(--sapField_Background, #fff)}.gallery ::-webkit-scrollbar{width:7px;height:7px}.gallery ::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:4px}.gallery ::-webkit-scrollbar-thumb{background:#555454;border-radius:4px}.gallery ::-webkit-scrollbar-thumb:hover{background:#2c2b2b}.gallery .column{overflow-y:scroll;display:flex;flex-direction:column;row-gap:3%;align-items:center}.gallery .column .pics{width:100%;display:flex;justify-content:center}.gallery .column .pics img{border-radius:5px}.gallery .column.small-imgs-box{flex:10%}.gallery .column.big-imgs-box{flex:90%}.gallery .selected{background-color:#fff;border:3px solid #0294d8;padding:10px}.gallery .fill-all .pics{height:100%}.gallery .fill-all img{width:100%!important;height:100%!important;object-fit:fill!important}.gallery .fill-original img{width:unset;height:unset}.gallery .zoom1 img{zoom:1}.gallery .zoom1-5 img{zoom:1.5}.gallery .zoom2 img{zoom:2}fd-dialog .gallery{overflow:auto}fd-dialog .gallery .column{overflow:initial}fd-dialog .gallery .pics{position:relative}fd-dialog fd-dialog-body{display:flex}fd-dialog.horizontal fd-dialog-body{flex-direction:column}fd-dialog.horizontal .gallery{flex-direction:row}fd-dialog.horizontal .thumbnail{border-top:1px solid #ccc;overflow-x:auto}fd-dialog.vertical fd-dialog-body{flex-direction:row-reverse}fd-dialog.vertical .gallery{flex-direction:column;height:100%}fd-dialog.vertical .thumbnail{border-left:1px solid #ccc;height:100%;width:200px;overflow-y:auto}fd-dialog.vertical .thumbnail ::ng-deep .fd-row>div{width:100%;min-width:100%}fd-card.media fd-card-footer button{border:none}fd-card.inDialog fd-card-header{padding-top:5px;padding-bottom:5px}.fd-col{min-width:165px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "directive", type: i7$8.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPicturesInfoComponent, decorators: [{
             type: Component,
@@ -9712,8 +9715,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
             }] } });
 
 class FormDialogLessComponent extends ContainerComponent {
-    constructor(dialogParams, _el, _activatedRoute, _portalService, _vcr, _barsaDialogService, _injector, _router, _renderer2, _cdr, _containerService, _formDialogComponent) {
-        super(_el, _activatedRoute, _portalService, _vcr, _barsaDialogService, _injector, _router, _cdr, _renderer2, _containerService, _formDialogComponent);
+    constructor(dialogParams, _el, _activatedRoute, _portalService, _vcr, _barsaDialogService, _injector, _router, _renderer2, _cdr, _dialogService, _containerService, _formDialogComponent) {
+        super(_el, _activatedRoute, _portalService, _vcr, _barsaDialogService, _injector, _router, _cdr, _renderer2, _dialogService, _containerService, _formDialogComponent);
         this.dialogParams = dialogParams;
         this._el = _el;
         this._activatedRoute = _activatedRoute;
@@ -9724,6 +9727,7 @@ class FormDialogLessComponent extends ContainerComponent {
         this._router = _router;
         this._renderer2 = _renderer2;
         this._cdr = _cdr;
+        this._dialogService = _dialogService;
         this._containerService = _containerService;
         this._formDialogComponent = _formDialogComponent;
         this.formPanelCtrlr = this.dialogParams.context.formpanelCtrlr;
@@ -9733,13 +9737,18 @@ class FormDialogLessComponent extends ContainerComponent {
         this.params = { moId, typeDefId, reportId, inDialog: true };
     }
     onFormClose() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormDialogLessComponent, deps: [{ token: i2.DialogParams }, { token: i0.ElementRef }, { token: i2$6.ActivatedRoute }, { token: i2.PortalService }, { token: i0.ViewContainerRef }, { token: i2.BarsaDialogService }, { token: i0.Injector }, { token: i2$6.Router }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i2.ContainerService, optional: true, self: true }, { token: FORM_DIALOG_COMPONENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormDialogLessComponent, deps: [{ token: i2.DialogParams }, { token: i0.ElementRef }, { token: i2$6.ActivatedRoute }, { token: i2.PortalService }, { token: i0.ViewContainerRef }, { token: i2.BarsaDialogService }, { token: i0.Injector }, { token: i2$6.Router }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: DIALOG_SERVICE, optional: true }, { token: i2.ContainerService, optional: true, self: true }, { token: FORM_DIALOG_COMPONENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FormDialogLessComponent, selector: "bsu-form-dialog-less", providers: [ContainerService], usesInheritance: true, ngImport: i0, template: "@if (rendered) {\n<bnrc-form [formPanelCtrl]=\"formPanelCtrlr\" [params]=\"params\" (formClose)=\"onFormClose()\"></bnrc-form>\n}\n", styles: [""], dependencies: [{ 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: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormDialogLessComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-form-dialog-less', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ContainerService], template: "@if (rendered) {\n<bnrc-form [formPanelCtrl]=\"formPanelCtrlr\" [params]=\"params\" (formClose)=\"onFormClose()\"></bnrc-form>\n}\n" }]
-        }], ctorParameters: () => [{ type: i2.DialogParams }, { type: i0.ElementRef }, { type: i2$6.ActivatedRoute }, { type: i2.PortalService }, { type: i0.ViewContainerRef }, { type: i2.BarsaDialogService }, { type: i0.Injector }, { type: i2$6.Router }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i2.ContainerService, decorators: [{
+        }], ctorParameters: () => [{ type: i2.DialogParams }, { type: i0.ElementRef }, { type: i2$6.ActivatedRoute }, { type: i2.PortalService }, { type: i0.ViewContainerRef }, { type: i2.BarsaDialogService }, { type: i0.Injector }, { type: i2$6.Router }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [DIALOG_SERVICE]
+                }] }, { type: i2.ContainerService, decorators: [{
                     type: Self
                 }, {
                     type: Optional
@@ -10398,7 +10407,7 @@ class ResponsiveToolbarComponent extends BaseComponent {
         this.btnClick.emit(button);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ResponsiveToolbarComponent, deps: [{ token: i2.PortalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ResponsiveToolbarComponent, selector: "bsu-responsive-toolbar", inputs: { buttons: "buttons" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "btnListRef", predicate: ["btnRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- <div style=\"width: 100%; height: 0; visibility: hidden\" #containerRef>\n<ng-container\n  *ngTemplateOutlet=\"renderToolbar; context: { $implicit: buttons }\"\n></ng-container>\n</div>\n<bsu-responsive-toolbar-renderer\n  *ngIf=\"buttonsCalculated\"\n  [buttons]=\"buttonsCalculated\"\n  (btnClick)=\"onButtonClick($event)\"\n  [renderToolbar]=\"renderToolbar\"\n></bsu-responsive-toolbar-renderer>\n\n<ng-template #renderToolbar let-btnList>\n  <ng-container *ngFor=\"let btn of btnList\">\n    <ng-container *ngIf=\"btn === '-' || btn.text === '-'; else btnCommand\">\n      <span #btnRef class=\"toolbar-btn toolbar-vseperator\"></span>\n    </ng-container>\n    <ng-template #btnCommand>\n      <ui5-button\n        #btnRef\n        (click)=\"onButtonClick(btn)\"\n        [attr.disabled]=\"btn.enable === false ? true : null\"\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\n        class=\"toolbar-btn\"\n        [attr.design]=\"btn.emphasized ? 'Emphasized' : 'Transparent'\"\n        [attr.icon]=\"btn.newIcon ? btn.newIcon : null\"\n        >{{ btn.text }}\n        <img *ngIf=\"!btn.newIcon && !btn.isBuiltin\" width=\"16\" [src]=\"btn.icon\"\n        /></ui5-button>\n      </ng-template>\n    </ng-container>\n  </ng-template> -->\n\n<fd-toolbar [shouldOverflow]=\"true\" [style.direction]=\"dirValue$ | async\">\n    @for (btn of btns; track btn) { @if (btn === '-' || btn.text === '-') {\n    <fd-toolbar-separator></fd-toolbar-separator>\n    } @else {\n    <button\n        fd-toolbar-item\n        fd-button\n        (click)=\"onButtonClick(btn)\"\n        [attr.disabled]=\"btn.enable === false ? true : null\"\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\n        [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\n        [label]=\"btn.text\"\n        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\n    >\n        @if (!btn.newIcon && !btn.isBuiltin) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        }\n    </button>\n    }\n    <ng-template #btnCommand>\n        <button\n            fd-toolbar-item\n            fd-button\n            (click)=\"onButtonClick(btn)\"\n            [attr.disabled]=\"btn.enable === false ? true : null\"\n            [attr.disabled]=\"btn.readonly === true ? true : null\"\n            [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\n            [label]=\"btn.text\"\n            [glyph]=\"btn.newIcon ? btn.newIcon : null\"\n        >\n            @if (!btn.newIcon && !btn.isBuiltin) {\n            <img width=\"16\" [src]=\"btn.icon\" />\n            }\n        </button>\n    </ng-template>\n    }\n</fd-toolbar>\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar--solid{background-color:var(--sapBackgroundColor, #f7f7f7);border:none}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ResponsiveToolbarComponent, selector: "bsu-responsive-toolbar", inputs: { buttons: "buttons" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "btnListRef", predicate: ["btnRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- <div style=\"width: 100%; height: 0; visibility: hidden\" #containerRef>\n<ng-container\n  *ngTemplateOutlet=\"renderToolbar; context: { $implicit: buttons }\"\n></ng-container>\n</div>\n<bsu-responsive-toolbar-renderer\n  *ngIf=\"buttonsCalculated\"\n  [buttons]=\"buttonsCalculated\"\n  (btnClick)=\"onButtonClick($event)\"\n  [renderToolbar]=\"renderToolbar\"\n></bsu-responsive-toolbar-renderer>\n\n<ng-template #renderToolbar let-btnList>\n  <ng-container *ngFor=\"let btn of btnList\">\n    <ng-container *ngIf=\"btn === '-' || btn.text === '-'; else btnCommand\">\n      <span #btnRef class=\"toolbar-btn toolbar-vseperator\"></span>\n    </ng-container>\n    <ng-template #btnCommand>\n      <ui5-button\n        #btnRef\n        (click)=\"onButtonClick(btn)\"\n        [attr.disabled]=\"btn.enable === false ? true : null\"\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\n        class=\"toolbar-btn\"\n        [attr.design]=\"btn.emphasized ? 'Emphasized' : 'Transparent'\"\n        [attr.icon]=\"btn.newIcon ? btn.newIcon : null\"\n        >{{ btn.text }}\n        <img *ngIf=\"!btn.newIcon && !btn.isBuiltin\" width=\"16\" [src]=\"btn.icon\"\n        /></ui5-button>\n      </ng-template>\n    </ng-container>\n  </ng-template> -->\n\n<fd-toolbar [shouldOverflow]=\"true\" [style.direction]=\"dirValue$ | async\">\n    @for (btn of btns; track btn) { @if (btn === '-' || btn.text === '-') {\n    <fd-toolbar-separator></fd-toolbar-separator>\n    } @else {\n    <button\n        fd-toolbar-item\n        fd-button\n        (click)=\"onButtonClick(btn)\"\n        [attr.disabled]=\"btn.enable === false ? true : null\"\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\n        [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\n        [label]=\"btn.text\"\n        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\n    >\n        @if (!btn.newIcon && !btn.isBuiltin) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        }\n    </button>\n    }\n    <ng-template #btnCommand>\n        <button\n            fd-toolbar-item\n            fd-button\n            (click)=\"onButtonClick(btn)\"\n            [attr.disabled]=\"btn.enable === false ? true : null\"\n            [attr.disabled]=\"btn.readonly === true ? true : null\"\n            [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\n            [label]=\"btn.text\"\n            [glyph]=\"btn.newIcon ? btn.newIcon : null\"\n        >\n            @if (!btn.newIcon && !btn.isBuiltin) {\n            <img width=\"16\" [src]=\"btn.icon\" />\n            }\n        </button>\n    </ng-template>\n    }\n</fd-toolbar>\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar--solid{background-color:var(--sapBackgroundColor, #f7f7f7);border:none}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ResponsiveToolbarComponent, decorators: [{
             type: Component,
@@ -10894,7 +10903,7 @@ class UiButtonComponent extends FieldBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiButtonComponent, selector: "bsu-ui-button", host: { properties: { "style.margin": "this.designMode" } }, usesInheritance: true, ngImport: i0, template: "<button\n    (click)=\"onClick()\"\n    [disabled]=\"(disable$ | async)!!\"\n    fd-button\n    [fdType]=\"parameters?.FdType$Caption\"\n    [glyph]=\"parameters?.Icon\"\n    [title]=\"label | bbbTranslate\"\n>\n    @if (!parameters?.Icon && context?.Setting?.FieldIcon && !JsonExtraProp?.Icon) {\n    <img [src]=\"context?.Setting.FieldIcon\" />\n    } @if (label && !JsonExtraProp?.OnlyIcon && !parameters?.OnlyIcon) {\n    <span class=\"fd-button__text\">{{ label | bbbTranslate }}</span>\n    }\n</button>\n<input fd-form-control class=\"extra-input-hidden\" />\n", styles: [":host{display:flex;height:100%;align-items:center}button{width:100%}.fd-button__text{font-size:.78rem}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiButtonComponent, selector: "bsu-ui-button", host: { properties: { "style.margin": "this.designMode" } }, usesInheritance: true, ngImport: i0, template: "<button\n    (click)=\"onClick()\"\n    [disabled]=\"(disable$ | async)!!\"\n    fd-button\n    [fdType]=\"parameters?.FdType$Caption\"\n    [glyph]=\"parameters?.Icon\"\n    [title]=\"label | bbbTranslate\"\n>\n    @if (!parameters?.Icon && context?.Setting?.FieldIcon && !JsonExtraProp?.Icon) {\n    <img [src]=\"context?.Setting.FieldIcon\" />\n    } @if (label && !JsonExtraProp?.OnlyIcon && !parameters?.OnlyIcon) {\n    <span class=\"fd-button__text\">{{ label | bbbTranslate }}</span>\n    }\n</button>\n<input fd-form-control class=\"extra-input-hidden\" />\n", styles: [":host{display:flex;height:100%;align-items:center}button{width:100%}.fd-button__text{font-size:.78rem}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiButtonComponent, decorators: [{
             type: Component,
@@ -11025,7 +11034,7 @@ class UlvSettingsComponent extends BaseComponent {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSettingsComponent, deps: [{ token: i1$1.DialogService }, { token: i2.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvSettingsComponent, selector: "bsu-ulv-settings", inputs: { context: "context", open: "open" }, outputs: { changed: "changed", restore: "restore" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogTemplateRef"], descendants: true, read: TemplateRef }, { propertyName: "gridColumnsComponent", first: true, predicate: ["gridColumnsRef"], descendants: true }, { propertyName: "gridSortComponent", first: true, predicate: ["gridSortRef"], descendants: true }, { propertyName: "gridGroupComponent", first: true, predicate: ["gridGroupRef"], descendants: true }, { propertyName: "settingButtonRef", predicate: ["settingButtons"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplateRef>\n  <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n    <fd-dialog-header>\n      <h1 fd-title>{{ 'Settings' | bbbTranslate }}</h1>\n      <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n      <fd-segmented-button>\n        @for (button of settingButtons; track button; let i = $index) {\n          <button\n            (click)=\"onSettingButtonsSelectionChange(i)\"\n            #settingButtons\n            [class.is-selected]=\"selectedSettingButton === i ? true : null\"\n            fd-button\n            [label]=\"button.text\"\n          ></button>\n        }\n      </fd-segmented-button>\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Columns' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-columns [columns]=\"allColumns\" #gridColumnsRef></bsu-ui-grid-columns>\n      </div>\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Sort' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-sort-setting\n          #gridSortRef\n          [columns]=\"allColumns\"\n          [sortSettings]=\"sortSettings\"\n          (changeSetting)=\"onChangeSetting()\"\n        ></bsu-ui-grid-sort-setting>\n      </div>\n\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Groups' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-sort-setting\n          #gridGroupRef\n          [columns]=\"allColumns\"\n          [class.section-visible]=\"selectedSettingButton === 1\"\n          [sortSettings]=\"sortSettings\"\n          [showGroups]=\"true\"\n          (changeSetting)=\"onChangeSetting()\"\n        ></bsu-ui-grid-sort-setting>\n      </div>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n      <fd-dialog-footer-button>\n        <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\n      </fd-dialog-footer-button>\n      <fd-dialog-footer-button>\n        <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\n      </fd-dialog-footer-button>\n      <fd-dialog-footer-button>\n        <button\n          fd-button\n          fdType=\"transparent\"\n          (click)=\"onRestoreClick()\"\n          [label]=\"'Restore' | bbbTranslate\"\n        ></button>\n      </fd-dialog-footer-button>\n    </fd-dialog-footer>\n  </fd-dialog>\n</ng-template>\n", styles: [".popover-content{width:60vw;height:60vh;background-color:var(--sapBackgroundColor)}.segemented-wrapper{box-shadow:var(--sapContent_HeaderShadow)}ui5-responsive-popover{background-color:var(--sapBackgroundColor)}.header-settings{padding:10px 0 2px;display:flex;flex-direction:column;align-items:stretch;width:100%}.header-settings ui5-title{align-self:flex-start}fd-segmented-button{display:flex;justify-content:stretch;width:100%;height:36px}fd-segmented-button button{width:100%}.setting-wrapper{min-height:calc(60vh - 25px)}.setting-section{display:none;overflow:hidden;padding:15px 0;max-height:50vh}.section-visible{overflow:auto;display:block}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i6$4.SegmentedButtonComponent, selector: "fd-segmented-button", inputs: ["toggle", "vertical"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvSettingsComponent, selector: "bsu-ulv-settings", inputs: { context: "context", open: "open" }, outputs: { changed: "changed", restore: "restore" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogTemplateRef"], descendants: true, read: TemplateRef }, { propertyName: "gridColumnsComponent", first: true, predicate: ["gridColumnsRef"], descendants: true }, { propertyName: "gridSortComponent", first: true, predicate: ["gridSortRef"], descendants: true }, { propertyName: "gridGroupComponent", first: true, predicate: ["gridGroupRef"], descendants: true }, { propertyName: "settingButtonRef", predicate: ["settingButtons"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplateRef>\n  <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n    <fd-dialog-header>\n      <h1 fd-title>{{ 'Settings' | bbbTranslate }}</h1>\n      <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n    </fd-dialog-header>\n    <fd-dialog-body class=\"setting-wrapper\">\n      <fd-segmented-button>\n        @for (button of settingButtons; track button; let i = $index) {\n          <button\n            (click)=\"onSettingButtonsSelectionChange(i)\"\n            #settingButtons\n            [class.is-selected]=\"selectedSettingButton === i ? true : null\"\n            fd-button\n            [label]=\"button.text\"\n          ></button>\n        }\n      </fd-segmented-button>\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Columns' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-columns [columns]=\"allColumns\" #gridColumnsRef></bsu-ui-grid-columns>\n      </div>\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Sort' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-sort-setting\n          #gridSortRef\n          [columns]=\"allColumns\"\n          [sortSettings]=\"sortSettings\"\n          (changeSetting)=\"onChangeSetting()\"\n        ></bsu-ui-grid-sort-setting>\n      </div>\n\n      <div\n        class=\"setting-section\"\n        [class.section-visible]=\"settingButtons[selectedSettingButton]?.text === ('Groups' | bbbTranslate)\"\n        >\n        <bsu-ui-grid-sort-setting\n          #gridGroupRef\n          [columns]=\"allColumns\"\n          [class.section-visible]=\"selectedSettingButton === 1\"\n          [sortSettings]=\"sortSettings\"\n          [showGroups]=\"true\"\n          (changeSetting)=\"onChangeSetting()\"\n        ></bsu-ui-grid-sort-setting>\n      </div>\n    </fd-dialog-body>\n\n    <fd-dialog-footer>\n      <fd-dialog-footer-button>\n        <button fd-button fdType=\"emphasized\" (click)=\"onOkClick()\" [label]=\"'OK' | bbbTranslate\"></button>\n      </fd-dialog-footer-button>\n      <fd-dialog-footer-button>\n        <button fd-button (click)=\"onCancelSettings()\" [label]=\"'Cancel' | bbbTranslate\"></button>\n      </fd-dialog-footer-button>\n      <fd-dialog-footer-button>\n        <button\n          fd-button\n          fdType=\"transparent\"\n          (click)=\"onRestoreClick()\"\n          [label]=\"'Restore' | bbbTranslate\"\n        ></button>\n      </fd-dialog-footer-button>\n    </fd-dialog-footer>\n  </fd-dialog>\n</ng-template>\n", styles: [".popover-content{width:60vw;height:60vh;background-color:var(--sapBackgroundColor)}.segemented-wrapper{box-shadow:var(--sapContent_HeaderShadow)}ui5-responsive-popover{background-color:var(--sapBackgroundColor)}.header-settings{padding:10px 0 2px;display:flex;flex-direction:column;align-items:stretch;width:100%}.header-settings ui5-title{align-self:flex-start}fd-segmented-button{display:flex;justify-content:stretch;width:100%;height:36px}fd-segmented-button button{width:100%}.setting-wrapper{min-height:calc(60vh - 25px)}.setting-section{display:none;overflow:hidden;padding:15px 0;max-height:50vh}.section-visible{overflow:auto;display:block}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i6$4.SegmentedButtonComponent, selector: "fd-segmented-button", inputs: ["toggle", "vertical"] }, { kind: "component", type: UiGridSortSettingComponent, selector: "bsu-ui-grid-sort-setting", inputs: ["showGroups", "columns", "sortSettings"], outputs: ["changeSetting"] }, { kind: "component", type: UiGridColumnsComponent, selector: "bsu-ui-grid-columns", inputs: ["columns", "selectedColumns"], outputs: ["columnsChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSettingsComponent, decorators: [{
             type: Component,
@@ -11067,7 +11076,7 @@ class UiSearchCommandInfoUiComponent extends FieldBaseComponent {
         this.context.fireEvent('ClearClick');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSearchCommandInfoUiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiSearchCommandInfoUiComponent, selector: "bsu-ui-search-command-info-ui", usesInheritance: true, ngImport: i0, template: "<button (click)=\"onSearch()\" fd-button [label]=\"'Search' | bbbTranslate\" [fdType]=\"'emphasized'\"></button>\r\n<button (click)=\"onClear()\" fd-button [label]=\"'Clear' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\r\n", styles: [":host{display:flex;padding:4px}button{margin-left:5px;margin-right:5px}.input-search-command{width:300px;margin:0 10px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiSearchCommandInfoUiComponent, selector: "bsu-ui-search-command-info-ui", usesInheritance: true, ngImport: i0, template: "<button (click)=\"onSearch()\" fd-button [label]=\"'Search' | bbbTranslate\" [fdType]=\"'emphasized'\"></button>\r\n<button (click)=\"onClear()\" fd-button [label]=\"'Clear' | bbbTranslate\" [fdType]=\"'transparent'\"></button>\r\n", styles: [":host{display:flex;padding:4px}button{margin-left:5px;margin-right:5px}.input-search-command{width:300px;margin:0 10px}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSearchCommandInfoUiComponent, decorators: [{
             type: Component,
@@ -11196,7 +11205,7 @@ class UlvSelectionComponent extends BaseComponent {
         this.visibility = this.visibility ? true : false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSelectionComponent, deps: [{ token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvSelectionComponent, selector: "bsu-ulv-selection", inputs: { context: "context", config: "config", body: "body" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogRef"], descendants: true, read: TemplateRef }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h3 fd-title>{{ data.title }}</h3>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            @if (data.ulvUi; as ulvUi) {\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\"></bsu-ui-ulv-main-ui>\n            }\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                aria-label=\"Selected and condition items\"\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\n                            >Selected Items and Conditions\n                        </ng-container>\n                        ({{ data.selectedItems?.length || 0 }})\n                    </ng-container>\n                </h5>\n\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (data.selectedItems) {\n                        <fd-toolbar [shouldOverflow]=\"true\">\n                            <!-- Selected items -->\n                            @for ( item of data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\n                            selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected()\"\n                                >{{ item.$Caption }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\n                        aria-label=\"clear selected items\"\n                        (click)=\"onClear()\"\n                    ></button>\n                </div>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\n                        label=\"OK\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk()\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\n                        label=\"Cancel\"\n                        fdType=\"transparent\"\n                        (click)=\"onDismiss()\"\n                    ></button>\n                </div>\n            </ng-template>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvSelectionComponent, selector: "bsu-ulv-selection", inputs: { context: "context", config: "config", body: "body" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogRef"], descendants: true, read: TemplateRef }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h3 fd-title>{{ data.title }}</h3>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            @if (data.ulvUi; as ulvUi) {\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\"></bsu-ui-ulv-main-ui>\n            }\n            <div\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\n                aria-label=\"Selected and condition items\"\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\n            >\n                <h5 fd-title class=\"selected-and-condition-title\">\n                    <ng-container>\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\n                            >Selected Items and Conditions\n                        </ng-container>\n                        ({{ data.selectedItems?.length || 0 }})\n                    </ng-container>\n                </h5>\n\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\n                    <div class=\"ulv-selection-form-dialog__tokens\">\n                        @if (data.selectedItems) {\n                        <fd-toolbar [shouldOverflow]=\"true\">\n                            <!-- Selected items -->\n                            @for ( item of data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\n                            selectedIndex = $index) {\n                            <fd-token\n                                fd-toolbar-item\n                                fdOverflowPriority=\"high\"\n                                class=\"fdp-value-help-dialog__selection-token\"\n                                (onCloseClick)=\"onRemoveSelected()\"\n                                >{{ item.$Caption }}\n                            </fd-token>\n                            }\n                        </fd-toolbar>\n                        }\n                    </div>\n                    <button\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\n                        fd-button\n                        fdType=\"transparent\"\n                        glyph=\"decline\"\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\n                        aria-label=\"clear selected items\"\n                        (click)=\"onClear()\"\n                    ></button>\n                </div>\n            </div>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <ng-template fdkTemplate=\"footer\">\n                <div class=\"fd-bar__right\">\n                    <button\n                        fd-button\n                        data-succes\n                        i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\n                        label=\"OK\"\n                        fdType=\"emphasized\"\n                        (click)=\"onOk()\"\n                    ></button>\n                    <button\n                        fd-button\n                        data-dismiss-dialog\n                        fd-dialog-decisive-button\n                        i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\n                        label=\"Cancel\"\n                        fdType=\"transparent\"\n                        (click)=\"onDismiss()\"\n                    ></button>\n                </div>\n            </ng-template>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i5$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i9.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvSelectionComponent, decorators: [{
             type: Component,
@@ -11363,7 +11372,7 @@ class UiMultiSelectComboComponent extends FieldBaseComponent {
             else {
                 this.maxWidth = layoutWidth;
             }
-        }, 0);
+        }, 10);
     }
     ngOnDestroy() {
         super.ngOnDestroy();
@@ -11786,16 +11795,16 @@ class UiMoInfoUlvComboComponent extends FieldBaseComponent {
             this.UlvUi.viewerControl.fireEvent('rowclick', this.UlvUi, 0, mo);
         }
         else if (this.ulvAdapter) {
-            this.ulvAdapter.ViewerAdapter.Control.fireEvent('rowclick', this.ulvAdapter.ViewerAdapter.Control, 0, mo);
+            this.ulvAdapter.ViewerAdapter.fireEvent(BarsaApi.Ul.UlvMainCtrlr.EventEnum.ItemClick, this.ulvAdapter.ViewerAdapter);
         }
         // this._triggerClick('ItemSelect', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMoInfoUlvComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", 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\n    *ngTemplateOutlet=\"\n        comboTemplate;\n        context: {\n            $implicit:\n                (loading$ | async) === true\n                | moInfoUlvMoList\n                    : isDataLoadedFirstTime\n                    : ulvAdapter?.Setting?.Data?.MoDataList\n                    : UlvUi?.Setting?.Data?.MoDataList\n                    : ulvAdapter?.Setting?.Data?.Paging\n                    : UlvUi?.Setting?.Data?.Paging,\n            deviceSize: deviceSize$ | async,\n            disableOrReadonly: disableOrReadonly$ | async,\n            disable: disable$ | async,\n            readonly: readonly$ | async,\n            isSearch: context._showPopup || context._showDropDown === false\n        }\n    \"\n>\n</ng-container>\n\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\">\n        @if (hasValue && disableOrReadonly !== true) {\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\n        </span>\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\n        </span>\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\n        </span>\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\n        </span>\n        }\n    </div>\n</ng-template>\n<ng-template\n    #comboTemplate\n    let-moDataList\n    let-deviceSize=\"deviceSize\"\n    let-disableOrReadonly=\"disableOrReadonly\"\n    let-disable=\"disable\"\n    let-readonly=\"readonly\"\n    let-isSearch=\"isSearch\"\n>\n    <div class=\"simple-combo-wrapper\">\n        <fd-combobox\n            #fdCombobox\n            class=\"combo-mo-ulv\"\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\n            [comboboxId]=\"comboboxId\"\n            [class.has-report]=\"hasReport\"\n            [class.has-Value]=\"hasValue\"\n            [placeholder]=\"'Select' | bbbTranslate\"\n            [mobile]=\"deviceSize === 's'\"\n            [mobileConfig]=\"mobileConfig\"\n            [fillOnSelect]=\"true\"\n            [readOnly]=\"readonly === true ? true : false\"\n            [disabled]=\"disable === true ? true : false\"\n            [dropdownValues]=\"moDataList\"\n            [filterFn]=\"customFilter\"\n            [openOnKeyboardEvent]=\"true\"\n            [byline]=\"allColumns.length > 0\"\n            [isSearch]=\"false\"\n            [itemTemplate]=\"itemTemplate\"\n            [displayFn]=\"displayFunc\"\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\n            (itemClicked)=\"onItemClick($event, moDataList)\"\n            (inputTextChange)=\"onInputChange($event)\"\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\n        >\n        </fd-combobox>\n        <ng-container *ngTemplateOutlet=\"btnsTpl\"></ng-container>\n    </div>\n    <ng-template #itemTemplate let-item>\n        @if (item.$isLoading) {\n        <div fd-list-content style=\"width: 100%; height: 20px\">\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\n        </div>\n        } @else {\n        <ng-container\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\n        >\n        </ng-container>\n        }\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\n            @if (ulv) {\n            <bsu-ulv-paging\n                (click)=\"onPagingClick($event)\"\n                (pageChange)=\"onPageChange($event)\"\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\n            >\n            </bsu-ulv-paging>\n            }\n            <!-- <button\n        style=\"width: 100%\"\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\n        fd-button\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\n        [label]=\"'More' | bbbTranslate\"\n      ></button> -->\n        </ng-template>\n        <ng-template #showItem>\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\n            <div class=\"moinfoulv devider\"></div>\n            } @if (item.$Icon) {\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\n            }\n            <div fd-list-content class=\"moinfoulv hasColumns\">\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\n                @if (allColumns[1]) {\n                <div fd-list-byline class=\"byline\">\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\n                </div>\n                }\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\n                    | rval: item:allColumns:true; as value) {\n                    <span> {{ column.Alias }}:{{ value }}</span>\n                    } } }\n                </div>\n            </div>\n            } @else {\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\n            </span>\n            }\n        </ng-template>\n    </ng-template>\n</ng-template>\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-] .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit .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$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.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", "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: i6.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: "pipe", type: i1$3.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: "17.3.5", 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\n    *ngTemplateOutlet=\"\n        comboTemplate;\n        context: {\n            $implicit:\n                (loading$ | async) === true\n                | moInfoUlvMoList\n                    : isDataLoadedFirstTime\n                    : ulvAdapter?.Setting?.Data?.MoDataList\n                    : UlvUi?.Setting?.Data?.MoDataList\n                    : ulvAdapter?.Setting?.Data?.Paging\n                    : UlvUi?.Setting?.Data?.Paging,\n            deviceSize: deviceSize$ | async,\n            disableOrReadonly: disableOrReadonly$ | async,\n            disable: disable$ | async,\n            readonly: readonly$ | async,\n            isSearch: context._showPopup || context._showDropDown === false\n        }\n    \"\n>\n</ng-container>\n\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\">\n        @if (hasValue && disableOrReadonly !== true) {\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\n        </span>\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\n        </span>\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\n        </span>\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\n        </span>\n        }\n    </div>\n</ng-template>\n<ng-template\n    #comboTemplate\n    let-moDataList\n    let-deviceSize=\"deviceSize\"\n    let-disableOrReadonly=\"disableOrReadonly\"\n    let-disable=\"disable\"\n    let-readonly=\"readonly\"\n    let-isSearch=\"isSearch\"\n>\n    <div class=\"simple-combo-wrapper\">\n        <fd-combobox\n            #fdCombobox\n            class=\"combo-mo-ulv\"\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\n            [comboboxId]=\"comboboxId\"\n            [class.has-Value]=\"hasValue\"\n            [placeholder]=\"'Select' | bbbTranslate\"\n            [mobile]=\"deviceSize === 's'\"\n            [mobileConfig]=\"mobileConfig\"\n            [fillOnSelect]=\"true\"\n            [readOnly]=\"readonly === true ? true : false\"\n            [disabled]=\"disable === true ? true : false\"\n            [dropdownValues]=\"moDataList\"\n            [filterFn]=\"customFilter\"\n            [openOnKeyboardEvent]=\"true\"\n            [byline]=\"allColumns.length > 0\"\n            [isSearch]=\"false\"\n            [itemTemplate]=\"itemTemplate\"\n            [displayFn]=\"displayFunc\"\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\n            (itemClicked)=\"onItemClick($event, moDataList)\"\n            (inputTextChange)=\"onInputChange($event)\"\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\n        >\n        </fd-combobox>\n        <ng-container\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\n        ></ng-container>\n    </div>\n    <ng-template #itemTemplate let-item>\n        @if (item.$isLoading) {\n        <div fd-list-content style=\"width: 100%; height: 20px\">\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\n        </div>\n        } @else {\n        <ng-container\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\n        >\n        </ng-container>\n        }\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\n            @if (ulv) {\n            <bsu-ulv-paging\n                (click)=\"onPagingClick($event)\"\n                (pageChange)=\"onPageChange($event)\"\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\n            >\n            </bsu-ulv-paging>\n            }\n            <!-- <button\n        style=\"width: 100%\"\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\n        fd-button\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\n        [label]=\"'More' | bbbTranslate\"\n      ></button> -->\n        </ng-template>\n        <ng-template #showItem>\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\n            <div class=\"moinfoulv devider\"></div>\n            } @if (item.$Icon) {\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\n            }\n            <div fd-list-content class=\"moinfoulv hasColumns\">\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\n                @if (allColumns[1]) {\n                <div fd-list-byline class=\"byline\">\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\n                </div>\n                }\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\n                    | rval: item:allColumns:true; as value) {\n                    <span> {{ column.Alias }}:{{ value }}</span>\n                    } } }\n                </div>\n            </div>\n            } @else {\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\n            </span>\n            }\n        </ng-template>\n    </ng-template>\n</ng-template>\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$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.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", "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: i6.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: "pipe", type: i1$3.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: "17.3.5", ngImport: i0, type: UiMoInfoUlvComboComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-mo-info-ulv-combo', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n    *ngTemplateOutlet=\"\n        comboTemplate;\n        context: {\n            $implicit:\n                (loading$ | async) === true\n                | moInfoUlvMoList\n                    : isDataLoadedFirstTime\n                    : ulvAdapter?.Setting?.Data?.MoDataList\n                    : UlvUi?.Setting?.Data?.MoDataList\n                    : ulvAdapter?.Setting?.Data?.Paging\n                    : UlvUi?.Setting?.Data?.Paging,\n            deviceSize: deviceSize$ | async,\n            disableOrReadonly: disableOrReadonly$ | async,\n            disable: disable$ | async,\n            readonly: readonly$ | async,\n            isSearch: context._showPopup || context._showDropDown === false\n        }\n    \"\n>\n</ng-container>\n\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\">\n        @if (hasValue && disableOrReadonly !== true) {\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\n        </span>\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\n        </span>\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\n        </span>\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\n        </span>\n        }\n    </div>\n</ng-template>\n<ng-template\n    #comboTemplate\n    let-moDataList\n    let-deviceSize=\"deviceSize\"\n    let-disableOrReadonly=\"disableOrReadonly\"\n    let-disable=\"disable\"\n    let-readonly=\"readonly\"\n    let-isSearch=\"isSearch\"\n>\n    <div class=\"simple-combo-wrapper\">\n        <fd-combobox\n            #fdCombobox\n            class=\"combo-mo-ulv\"\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\n            [comboboxId]=\"comboboxId\"\n            [class.has-report]=\"hasReport\"\n            [class.has-Value]=\"hasValue\"\n            [placeholder]=\"'Select' | bbbTranslate\"\n            [mobile]=\"deviceSize === 's'\"\n            [mobileConfig]=\"mobileConfig\"\n            [fillOnSelect]=\"true\"\n            [readOnly]=\"readonly === true ? true : false\"\n            [disabled]=\"disable === true ? true : false\"\n            [dropdownValues]=\"moDataList\"\n            [filterFn]=\"customFilter\"\n            [openOnKeyboardEvent]=\"true\"\n            [byline]=\"allColumns.length > 0\"\n            [isSearch]=\"false\"\n            [itemTemplate]=\"itemTemplate\"\n            [displayFn]=\"displayFunc\"\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\n            (itemClicked)=\"onItemClick($event, moDataList)\"\n            (inputTextChange)=\"onInputChange($event)\"\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\n        >\n        </fd-combobox>\n        <ng-container *ngTemplateOutlet=\"btnsTpl\"></ng-container>\n    </div>\n    <ng-template #itemTemplate let-item>\n        @if (item.$isLoading) {\n        <div fd-list-content style=\"width: 100%; height: 20px\">\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\n        </div>\n        } @else {\n        <ng-container\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\n        >\n        </ng-container>\n        }\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\n            @if (ulv) {\n            <bsu-ulv-paging\n                (click)=\"onPagingClick($event)\"\n                (pageChange)=\"onPageChange($event)\"\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\n            >\n            </bsu-ulv-paging>\n            }\n            <!-- <button\n        style=\"width: 100%\"\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\n        fd-button\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\n        [label]=\"'More' | bbbTranslate\"\n      ></button> -->\n        </ng-template>\n        <ng-template #showItem>\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\n            <div class=\"moinfoulv devider\"></div>\n            } @if (item.$Icon) {\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\n            }\n            <div fd-list-content class=\"moinfoulv hasColumns\">\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\n                @if (allColumns[1]) {\n                <div fd-list-byline class=\"byline\">\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\n                </div>\n                }\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\n                    | rval: item:allColumns:true; as value) {\n                    <span> {{ column.Alias }}:{{ value }}</span>\n                    } } }\n                </div>\n            </div>\n            } @else {\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\n            </span>\n            }\n        </ng-template>\n    </ng-template>\n</ng-template>\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-] .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit .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, template: "<ng-container\n    *ngTemplateOutlet=\"\n        comboTemplate;\n        context: {\n            $implicit:\n                (loading$ | async) === true\n                | moInfoUlvMoList\n                    : isDataLoadedFirstTime\n                    : ulvAdapter?.Setting?.Data?.MoDataList\n                    : UlvUi?.Setting?.Data?.MoDataList\n                    : ulvAdapter?.Setting?.Data?.Paging\n                    : UlvUi?.Setting?.Data?.Paging,\n            deviceSize: deviceSize$ | async,\n            disableOrReadonly: disableOrReadonly$ | async,\n            disable: disable$ | async,\n            readonly: readonly$ | async,\n            isSearch: context._showPopup || context._showDropDown === false\n        }\n    \"\n>\n</ng-container>\n\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\">\n        @if (hasValue && disableOrReadonly !== true) {\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\n        </span>\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\n        </span>\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\n        </span>\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\n        </span>\n        }\n    </div>\n</ng-template>\n<ng-template\n    #comboTemplate\n    let-moDataList\n    let-deviceSize=\"deviceSize\"\n    let-disableOrReadonly=\"disableOrReadonly\"\n    let-disable=\"disable\"\n    let-readonly=\"readonly\"\n    let-isSearch=\"isSearch\"\n>\n    <div class=\"simple-combo-wrapper\">\n        <fd-combobox\n            #fdCombobox\n            class=\"combo-mo-ulv\"\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\n            [comboboxId]=\"comboboxId\"\n            [class.has-Value]=\"hasValue\"\n            [placeholder]=\"'Select' | bbbTranslate\"\n            [mobile]=\"deviceSize === 's'\"\n            [mobileConfig]=\"mobileConfig\"\n            [fillOnSelect]=\"true\"\n            [readOnly]=\"readonly === true ? true : false\"\n            [disabled]=\"disable === true ? true : false\"\n            [dropdownValues]=\"moDataList\"\n            [filterFn]=\"customFilter\"\n            [openOnKeyboardEvent]=\"true\"\n            [byline]=\"allColumns.length > 0\"\n            [isSearch]=\"false\"\n            [itemTemplate]=\"itemTemplate\"\n            [displayFn]=\"displayFunc\"\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\n            (itemClicked)=\"onItemClick($event, moDataList)\"\n            (inputTextChange)=\"onInputChange($event)\"\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\n        >\n        </fd-combobox>\n        <ng-container\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\n        ></ng-container>\n    </div>\n    <ng-template #itemTemplate let-item>\n        @if (item.$isLoading) {\n        <div fd-list-content style=\"width: 100%; height: 20px\">\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\n        </div>\n        } @else {\n        <ng-container\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\n        >\n        </ng-container>\n        }\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\n            @if (ulv) {\n            <bsu-ulv-paging\n                (click)=\"onPagingClick($event)\"\n                (pageChange)=\"onPageChange($event)\"\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\n            >\n            </bsu-ulv-paging>\n            }\n            <!-- <button\n        style=\"width: 100%\"\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\n        fd-button\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\n        [label]=\"'More' | bbbTranslate\"\n      ></button> -->\n        </ng-template>\n        <ng-template #showItem>\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\n            <div class=\"moinfoulv devider\"></div>\n            } @if (item.$Icon) {\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\n            }\n            <div fd-list-content class=\"moinfoulv hasColumns\">\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\n                @if (allColumns[1]) {\n                <div fd-list-byline class=\"byline\">\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\n                </div>\n                }\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\n                    | rval: item:allColumns:true; as value) {\n                    <span> {{ column.Alias }}:{{ value }}</span>\n                    } } }\n                </div>\n            </div>\n            } @else {\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\n            </span>\n            }\n        </ng-template>\n    </ng-template>\n</ng-template>\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: [{
@@ -11909,7 +11918,7 @@ class UiPictureFileComponent extends FieldBaseComponent {
         }))));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPictureFileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode" }, host: { properties: { "class.editable": "this._editable" } }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<div\n    [style.max-height.px]=\"Setting.SizeMode === '2' ? null : layoutInfo.ControlBounds.height\"\n    [class.no-inlineEdit]=\"!inlineEdit\"\n    [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\n    [class.inlineEdit]=\"inlineEdit\"\n>\n    @if (!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)) {\n    <div>\n        <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"value && imageUrl ? false : true\">\n            <fd-file-uploader\n                #uploader\n                fd-toolbar-item\n                [style.display]=\"'none'\"\n                [id]=\"id\"\n                [name]=\"'uploader_' + id\"\n                [placeholder]=\"'AttachPicture' | bbbTranslate\"\n                [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\n                [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\n                [accept]=\"validExtensions\"\n                [(ngModel)]=\"files\"\n                [multiple]=\"false\"\n                (selectedFilesChanged)=\"onFileSelection($event)\"\n            ></fd-file-uploader>\n            <button\n                fd-toolbar-item\n                fd-button\n                [disabled]=\"this.value && value?.IsDeleted !== true\"\n                glyph=\"attachment\"\n                [fdType]=\"'transparent'\"\n                (click)=\"uploader.open()\"\n            ></button>\n            <button\n                class=\"delete\"\n                fd-button\n                fd-toolbar-item\n                [disabled]=\"!this.value || value?.IsDeleted\"\n                glyph=\"delete\"\n                [fdType]=\"'transparent'\"\n                (click)=\"onFileDeleted(uploader)\"\n            ></button>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    loadingTpl;\n                    context: {\n                        uploadingState: uploadingState$ | async\n                    }\n                \"\n            >\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    } @if (!inlineEdit) {\n    <div\n        [style.max-height.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.height : null\"\n        [style.max-width.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.width : null\"\n        [class.centerImage]=\"Setting.SizeMode === '3'\"\n    >\n        @if (value && imageUrl) {\n        <bsu-mask [top]=\"'0px'\"></bsu-mask>\n        } @if ((value && imageUrl) || Setting.HasDefaultPicture) {\n        <img\n            imgLazy\n            [imgLazy]=\"imageUrl\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n        }\n    </div>\n    } @else {\n    <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    }\n</div>\n<ng-template #loadingTpl let-uploadingState=\"uploadingState\">\n    @if (uploadingState && uploadingState.state !== 'Complete' && uploadingState.uploading) {\n    <fd-slider\n        [(ngModel)]=\"uploadingState.progress\"\n        [name]=\"'slider_' + id\"\n        fd-toolbar-item\n        [id]=\"id + '1'\"\n        [min]=\"0\"\n        [max]=\"100\"\n        [step]=\"1\"\n    >\n    </fd-slider>\n    @if (uploadingState.state === 'Uploading') {\n    <button fd-toolbar-item fd-button glyph=\"stop\" fdType=\"transparent\" (click)=\"onTerminate()\"></button>\n    } @if (uploadingState.state === 'Error') {\n    <button fd-toolbar-item fd-button glyph=\"refresh\" [fdType]=\"'transparent'\" (click)=\"onRetry()\"></button>\n    } }\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden;margin-bottom:.25rem;margin-top:.1875rem}:host.editable{border:.0625rem solid var(--sapGroup_TitleBorderColor)}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}img{width:100%}.pic-wrapper{background-repeat:no-repeat;background-position:center}.cover{max-width:100%;max-height:100%;min-height:100%;width:100%;height:100%;background-size:cover}.contain{max-width:100%;max-height:100%;min-height:100%;width:auto;height:100%;background-size:contain}.no-inlineEdit{width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:flex-start}.centerImage{display:flex;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode" }, host: { properties: { "class.editable": "this._editable" } }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<div\n    [style.max-height.px]=\"Setting.SizeMode === '2' ? null : layoutInfo.ControlBounds.height\"\n    [class.no-inlineEdit]=\"!inlineEdit\"\n    [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\n    [class.inlineEdit]=\"inlineEdit\"\n>\n    @if (!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)) {\n    <div>\n        <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"value && imageUrl ? false : true\">\n            <fd-file-uploader\n                #uploader\n                fd-toolbar-item\n                [style.display]=\"'none'\"\n                [id]=\"id\"\n                [name]=\"'uploader_' + id\"\n                [placeholder]=\"'AttachPicture' | bbbTranslate\"\n                [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\n                [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\n                [accept]=\"validExtensions\"\n                [(ngModel)]=\"files\"\n                [multiple]=\"false\"\n                (selectedFilesChanged)=\"onFileSelection($event)\"\n            ></fd-file-uploader>\n            <button\n                fd-toolbar-item\n                fd-button\n                [disabled]=\"this.value && value?.IsDeleted !== true\"\n                glyph=\"attachment\"\n                [fdType]=\"'transparent'\"\n                (click)=\"uploader.open()\"\n            ></button>\n            <button\n                class=\"delete\"\n                fd-button\n                fd-toolbar-item\n                [disabled]=\"!this.value || value?.IsDeleted\"\n                glyph=\"delete\"\n                [fdType]=\"'transparent'\"\n                (click)=\"onFileDeleted(uploader)\"\n            ></button>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    loadingTpl;\n                    context: {\n                        uploadingState: uploadingState$ | async\n                    }\n                \"\n            >\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    } @if (!inlineEdit) {\n    <div\n        [style.max-height.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.height : null\"\n        [style.max-width.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.width : null\"\n        [class.centerImage]=\"Setting.SizeMode === '3'\"\n    >\n        @if (value && imageUrl) {\n        <bsu-mask [top]=\"'0px'\"></bsu-mask>\n        } @if ((value && imageUrl) || Setting.HasDefaultPicture) {\n        <img\n            imgLazy\n            [imgLazy]=\"imageUrl\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n        }\n    </div>\n    } @else {\n    <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    }\n</div>\n<ng-template #loadingTpl let-uploadingState=\"uploadingState\">\n    @if (uploadingState && uploadingState.state !== 'Complete' && uploadingState.uploading) {\n    <fd-slider\n        [(ngModel)]=\"uploadingState.progress\"\n        [name]=\"'slider_' + id\"\n        fd-toolbar-item\n        [id]=\"id + '1'\"\n        [min]=\"0\"\n        [max]=\"100\"\n        [step]=\"1\"\n    >\n    </fd-slider>\n    @if (uploadingState.state === 'Uploading') {\n    <button fd-toolbar-item fd-button glyph=\"stop\" fdType=\"transparent\" (click)=\"onTerminate()\"></button>\n    } @if (uploadingState.state === 'Error') {\n    <button fd-toolbar-item fd-button glyph=\"refresh\" [fdType]=\"'transparent'\" (click)=\"onRetry()\"></button>\n    } }\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden;margin-bottom:.25rem;margin-top:.1875rem}:host.editable{border:.0625rem solid var(--sapGroup_TitleBorderColor)}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}img{width:100%}.pic-wrapper{background-repeat:no-repeat;background-position:center}.cover{max-width:100%;max-height:100%;min-height:100%;width:100%;height:100%;background-size:cover}.contain{max-width:100%;max-height:100%;min-height:100%;width:auto;height:100%;background-size:contain}.no-inlineEdit{width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:flex-start}.centerImage{display:flex;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiPictureFileComponent, decorators: [{
             type: Component,
@@ -11946,7 +11955,7 @@ class UiContainerWithButtonComponent extends FieldBaseComponent {
         btn.handler.bind(this.context)();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiContainerWithButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiContainerWithButtonComponent, selector: "bsu-ui-container-with-button", usesInheritance: true, ngImport: i0, template: "<bnrc-field-ui class=\"inner-control\" [customField]=\"context._innerControl\" [layoutInfo]=\"layoutInfo\"></bnrc-field-ui>\n@if (btnVisible && btnEnable) { @for (btn of context._buttonsConfig; track btn) {\n<button\n    fd-button\n    [label]=\"btn.text\"\n    [glyph]=\"btn.itemId === 'Recalculate' ? 'synchronize' : ''\"\n    [fdType]=\"'transparent'\"\n    (click)=\"onBtnClick(btn)\"\n    [disabled]=\"(disableOrReadonly$ | async) === true\"\n></button>\n} }\n", styles: [":host{width:100%;height:100%;display:flex;justify-content:stretch;align-items:center}.btn{max-width:80px;width:100%;height:30px}button{flex-shrink:0}\n"], dependencies: [{ kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "componentUi", "layoutInfo", "inlineEdit", "focusControl", "formHeight"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiContainerWithButtonComponent, selector: "bsu-ui-container-with-button", usesInheritance: true, ngImport: i0, template: "<bnrc-field-ui class=\"inner-control\" [customField]=\"context._innerControl\" [layoutInfo]=\"layoutInfo\"></bnrc-field-ui>\n@if (btnVisible && btnEnable) { @for (btn of context._buttonsConfig; track btn) {\n<button\n    fd-button\n    [label]=\"btn.text\"\n    [glyph]=\"btn.itemId === 'Recalculate' ? 'synchronize' : ''\"\n    [fdType]=\"'transparent'\"\n    (click)=\"onBtnClick(btn)\"\n    [disabled]=\"(disableOrReadonly$ | async) === true\"\n></button>\n} }\n", styles: [":host{width:100%;height:100%;display:flex;justify-content:stretch;align-items:center}.btn{max-width:80px;width:100%;height:30px}button{flex-shrink:0}\n"], dependencies: [{ kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "componentUi", "layoutInfo", "inlineEdit", "focusControl", "formHeight"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiContainerWithButtonComponent, decorators: [{
             type: Component,
@@ -11974,7 +11983,7 @@ class UiReadOnlyFieldComponent extends FieldBaseComponent {
         this._cdr.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiReadOnlyFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiReadOnlyFieldComponent, selector: "bsu-ui-read-only-field", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"controlTpl; context: { maxlines: parameters?.MaxLines }\"></ng-container>\n\n@if (parameters?.ShowCopy && text) {\n<button fd-button glyph=\"copy\" [fdCompact] fdType=\"transparent\" [copy]=\"text | bbbTranslate\"></button>\n}\n<!-- <fd-popover *ngIf=\"text\">\n<fd-popover-control>\n  <button\n    *ngIf=\"isEllipsis\"\n    fd-button\n    glyph=\"overflow\"\n    [fdCompact]\n    fdType=\"transparent\"\n    [title]=\"text | bbbTranslate\"\n  ></button>\n</fd-popover-control>\n<fd-popover-body>\n  <ng-container *ngTemplateOutlet=\"controlTpl\"></ng-container>\n</fd-popover-body>\n</fd-popover>\n-->\n<ng-template #controlTpl let-maxlines>\n    <fd-text\n        style=\"color: var(--fdIcon_Tab_Bar_Selection_Color)\"\n        [class.empty-bracket]=\"!text\"\n        [text]=\"!text && parameters?.HideTextOnEmpty ? '' : (text || 'Empty_Bracket' | bbbTranslate)\"\n        [class.bold]=\"text !== null && text !== '' && !parameters?.NotBold\"\n        [whitespaces]=\"true\"\n        [maxLines]=\"maxlines ? maxlines : 0\"\n        [style.color]=\"parameters?.ColorValue ? parameters?.ColorValue : null\"\n    ></fd-text>\n</ng-template>\n", styles: [":host{display:flex;width:100%;height:100%;align-items:center}label{overflow:hidden;text-align:justify;line-height:1.6rem}.empty-bracket{opacity:.3}fd-text ::ng-deep p{color:inherit}fd-text ::ng-deep p span{color:inherit}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CopyDirective, selector: "[copy]", inputs: ["copy"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiReadOnlyFieldComponent, selector: "bsu-ui-read-only-field", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"controlTpl; context: { maxlines: parameters?.MaxLines }\"></ng-container>\n\n@if (parameters?.ShowCopy && text) {\n<button fd-button glyph=\"copy\" [fdCompact] fdType=\"transparent\" [copy]=\"text | bbbTranslate\"></button>\n}\n<!-- <fd-popover *ngIf=\"text\">\n<fd-popover-control>\n  <button\n    *ngIf=\"isEllipsis\"\n    fd-button\n    glyph=\"overflow\"\n    [fdCompact]\n    fdType=\"transparent\"\n    [title]=\"text | bbbTranslate\"\n  ></button>\n</fd-popover-control>\n<fd-popover-body>\n  <ng-container *ngTemplateOutlet=\"controlTpl\"></ng-container>\n</fd-popover-body>\n</fd-popover>\n-->\n<ng-template #controlTpl let-maxlines>\n    <fd-text\n        style=\"color: var(--fdIcon_Tab_Bar_Selection_Color)\"\n        [class.empty-bracket]=\"!text\"\n        [text]=\"!text && parameters?.HideTextOnEmpty ? '' : (text || 'Empty_Bracket' | bbbTranslate)\"\n        [class.bold]=\"text !== null && text !== '' && !parameters?.NotBold\"\n        [whitespaces]=\"true\"\n        [maxLines]=\"maxlines ? maxlines : 0\"\n        [style.color]=\"parameters?.ColorValue ? parameters?.ColorValue : null\"\n    ></fd-text>\n</ng-template>\n", styles: [":host{display:flex;width:100%;height:100%;align-items:center}label{overflow:hidden;text-align:justify;line-height:1.6rem}.empty-bracket{opacity:.3}fd-text ::ng-deep p{color:inherit}fd-text ::ng-deep p span{color:inherit}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CopyDirective, selector: "[copy]", inputs: ["copy"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiReadOnlyFieldComponent, decorators: [{
             type: Component,
@@ -12153,7 +12162,7 @@ class UiSimpleComboComponent extends FieldBaseComponent {
         this.fireContextEvent('select', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSimpleComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiSimpleComboComponent, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n    style=\"width: 100%\"\n    [placeholder]=\"'Select' | bbbTranslate\"\n    [value]=\"value\"\n    [mobile]=\"(deviceSize$ | async) === 's'\"\n    [mobileConfig]=\"mobileConfig\"\n    (valueChange)=\"onValueChange($event)\"\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n    [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n    [readonly]=\"(readonly$ | async) === true ? true : false\"\n    [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n    @for (item of context.store.data[context.store.root]; track item) {\n    <fd-option\n        [value]=\"item.id\"\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n        [class.control-disabled]=\"item.IsEmpty\"\n        [class.list-empty-item]=\"item.IsEmpty\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n    </fd-option>\n    }\n</fd-select> -->\n<fd-combobox\n    [inputId]=\"id\"\n    [mobile]=\"(deviceSize$ | async) === 's'\"\n    [placeholder]=\"'Select' | bbbTranslate\"\n    [displayFn]=\"displayFn\"\n    [(ngModel)]=\"tvalue\"\n    [readOnly]=\"(readonly$ | async) === true ? true : false\"\n    [disabled]=\"(disable$ | async) === true ? true : false\"\n    [fillOnSelect]=\"true\"\n    [dropdownValues]=\"context.store.data[context.store.root]\"\n    (itemClicked)=\"onItemClick($event)\"\n    (change)=\"onChange($event)\"\n>\n    <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n        <!-- Note that in this case you are responsible for highlighting. -->\n        @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n        <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n        } } @if (Setting.IconDisplayType !== 'Image') {\n        <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n        }\n    </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n    <fd-popover-control>\n        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n            @if (value && value !== '0') {\n            <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n            }\n        </button>\n    </fd-popover-control>\n    <fd-popover-body class=\"combo-popupmode\">\n        @for (item of context.store.data[context.store.root]; track item) {\n        <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n            @if (item.url) {\n            <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n            }\n        </button>\n        }\n    </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n    @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n    <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n    } } @if (Setting.IconDisplayType !== 'Image') {\n    {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n    }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.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", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$5.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiSimpleComboComponent, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n    style=\"width: 100%\"\n    [placeholder]=\"'Select' | bbbTranslate\"\n    [value]=\"value\"\n    [mobile]=\"(deviceSize$ | async) === 's'\"\n    [mobileConfig]=\"mobileConfig\"\n    (valueChange)=\"onValueChange($event)\"\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n    [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n    [readonly]=\"(readonly$ | async) === true ? true : false\"\n    [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n    @for (item of context.store.data[context.store.root]; track item) {\n    <fd-option\n        [value]=\"item.id\"\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n        [class.control-disabled]=\"item.IsEmpty\"\n        [class.list-empty-item]=\"item.IsEmpty\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n    </fd-option>\n    }\n</fd-select> -->\n<fd-combobox\n    [inputId]=\"id\"\n    [mobile]=\"(deviceSize$ | async) === 's'\"\n    [placeholder]=\"'Select' | bbbTranslate\"\n    [displayFn]=\"displayFn\"\n    [(ngModel)]=\"tvalue\"\n    [readOnly]=\"(readonly$ | async) === true ? true : false\"\n    [disabled]=\"(disable$ | async) === true ? true : false\"\n    [fillOnSelect]=\"true\"\n    [dropdownValues]=\"context.store.data[context.store.root]\"\n    (itemClicked)=\"onItemClick($event)\"\n    (change)=\"onChange($event)\"\n>\n    <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n        <!-- Note that in this case you are responsible for highlighting. -->\n        @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n        <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n        } } @if (Setting.IconDisplayType !== 'Image') {\n        <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n        }\n    </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n    <fd-popover-control>\n        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n            @if (value && value !== '0') {\n            <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n            }\n        </button>\n    </fd-popover-control>\n    <fd-popover-body class=\"combo-popupmode\">\n        @for (item of context.store.data[context.store.root]; track item) {\n        <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n            @if (item.url) {\n            <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n            }\n        </button>\n        }\n    </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n    @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n    <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n    } } @if (Setting.IconDisplayType !== 'Image') {\n    {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n    }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.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", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$5.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSimpleComboComponent, decorators: [{
             type: Component,
@@ -12184,7 +12193,7 @@ class UiCheckBoxComponent extends DeviceInfoFieldBaseComponent {
         this.fireContextEvent('check', val);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiCheckBoxComponent, selector: "bsu-ui-check-box", inputs: { MinSize: "MinSize" }, usesInheritance: true, ngImport: i0, template: "<fd-checkbox\n    [id]=\"id\"\n    (change)=\"onValueChange()\"\n    [ngModel]=\"value\"\n    [disabled]=\"(disableOrReadonly$ | async)!!\"\n    [label]=\"!showText ? '' : layoutInfo.Caption\"\n    [wrapLabel]=\"true\"\n>\n</fd-checkbox>\n", styles: [":host{width:100%;height:100%;display:flex}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: UiCheckBoxComponent, selector: "bsu-ui-check-box", inputs: { MinSize: "MinSize" }, usesInheritance: true, ngImport: i0, template: "<fd-checkbox\n    [id]=\"id\"\n    (change)=\"onValueChange()\"\n    [ngModel]=\"value\"\n    [disabled]=\"(disableOrReadonly$ | async)!!\"\n    [label]=\"!showText ? '' : layoutInfo.Caption\"\n    [wrapLabel]=\"true\"\n>\n</fd-checkbox>\n", styles: [":host{width:100%;height:100%;display:flex}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCheckBoxComponent, decorators: [{
             type: Component,
@@ -12383,7 +12392,7 @@ class UiCardViewHorizontalGroupComponent extends UiCardViewComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewHorizontalGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewHorizontalGroupComponent, selector: "bsu-ui-card-view-horizontal-group", viewQueries: [{ propertyName: "dynamicPage", first: true, predicate: DynamicPageComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-dynamic-page [size]=\"deviceSize | dynamicPageSize\">\n    @if (moDataList?.length) {\n    <fd-tab-list [expandOverflowText]=\"'More' | bbbTranslate\" [stackContent]=\"true\">\n        @for ( tab of moDataList | groupBy: groupby[0].Name | reverse: isFirefox; track _trackByRow(index, tab); let\n        index = $index) {\n        <fd-tab [title]=\"tab.key | bbbTranslate\" [id]=\"'h_' + index\">\n            <fd-dynamic-page-content>\n                <h4 fd-title [id]=\"'h_' + index + '_h'\">{{ tab.key | bbbTranslate }}</h4>\n                <bsu-card-view-content\n                    [moDataList]=\"tab.value\"\n                    [groupby]=\"[]\"\n                    [title]=\"tab.key\"\n                    [setting]=\"cardSetting\"\n                    [editMode]=\"inlineEditMode\"\n                    [rtl]=\"rtl\"\n                    [deviceName]=\"deviceName\"\n                    [deviceSize]=\"deviceSize\"\n                    [allColumns]=\"allColumns\"\n                    [contextMenuItems]=\"contextMenuItems\"\n                    [canView]=\"canView\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [navigationArrow]=\"navigationArrow\"\n                    [isCheckList]=\"isCheckList\"\n                    (rowCheck)=\"onRowCheck($event)\"\n                    (rowClick)=\"onRowClick($event)\"\n                    (ulvCommand)=\"onUlvCommand($event)\"\n                    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n                    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n                    (action)=\"onAction($event)\"\n                ></bsu-card-view-content>\n            </fd-dynamic-page-content>\n        </fd-tab>\n        }\n    </fd-tab-list>\n    } @else {\n    <fd-dynamic-page-content>\n        <bsu-no-data [simple]=\"true\"></bsu-no-data>\n    </fd-dynamic-page-content>\n    }\n</fd-dynamic-page>\n", styles: [":host ::ng-deep .fd-container.card-list{padding:0!important}:host ::ng-deep .footer-spacer{display:none!important}\n"], dependencies: [{ kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "defaultTab", "selectDefaultOnTabsChange", "focusFirstFocusableElement"], outputs: ["selectedTabChange", "selectedTabIndexChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.GroupByPipe, name: "groupBy" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ReversePipe, name: "reverse" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewHorizontalGroupComponent, selector: "bsu-ui-card-view-horizontal-group", viewQueries: [{ propertyName: "dynamicPage", first: true, predicate: DynamicPageComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-dynamic-page [size]=\"deviceSize | dynamicPageSize\">\n    @if (moDataList?.length) {\n    <fd-tab-list [expandOverflowText]=\"'More' | bbbTranslate\" [stackContent]=\"true\">\n        @for ( tab of moDataList | groupBy: groupby[0].Name | reverse: isFirefox; track _trackByRow(index, tab); let\n        index = $index) {\n        <fd-tab [title]=\"tab.key | bbbTranslate\" [id]=\"'h_' + index\">\n            <fd-dynamic-page-content>\n                <h4 fd-title [id]=\"'h_' + index + '_h'\">{{ tab.key | bbbTranslate }}</h4>\n                <bsu-card-view-content\n                    [moDataList]=\"tab.value\"\n                    [groupby]=\"[]\"\n                    [title]=\"tab.key\"\n                    [setting]=\"cardSetting\"\n                    [editMode]=\"inlineEditMode\"\n                    [rtl]=\"rtl\"\n                    [deviceName]=\"deviceName\"\n                    [deviceSize]=\"deviceSize\"\n                    [allColumns]=\"allColumns\"\n                    [contextMenuItems]=\"contextMenuItems\"\n                    [canView]=\"canView\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [navigationArrow]=\"navigationArrow\"\n                    [isCheckList]=\"isCheckList\"\n                    (rowCheck)=\"onRowCheck($event)\"\n                    (rowClick)=\"onRowClick($event)\"\n                    (ulvCommand)=\"onUlvCommand($event)\"\n                    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n                    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n                    (action)=\"onAction($event)\"\n                ></bsu-card-view-content>\n            </fd-dynamic-page-content>\n        </fd-tab>\n        }\n    </fd-tab-list>\n    } @else {\n    <fd-dynamic-page-content>\n        <bsu-no-data [simple]=\"true\"></bsu-no-data>\n    </fd-dynamic-page-content>\n    }\n</fd-dynamic-page>\n", styles: [":host ::ng-deep .fd-container.card-list{padding:0!important}:host ::ng-deep .footer-spacer{display:none!important}\n"], dependencies: [{ kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "defaultTab", "selectDefaultOnTabsChange", "focusFirstFocusableElement"], outputs: ["selectedTabChange", "selectedTabIndexChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.GroupByPipe, name: "groupBy" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ReversePipe, name: "reverse" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewHorizontalGroupComponent, decorators: [{
             type: Component,
@@ -12440,7 +12449,7 @@ class FormToolbarButtonComponent extends BaseFormToolbaritemPropsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormToolbarButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FormToolbarButtonComponent, selector: "bsu-form-toolbar-button", inputs: { parameters: "parameters" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "inlineHelpDirective", first: true, predicate: InlineHelpDirective, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<button\n    fd-toolbar-item\n    fd-button\n    [title]=\"inlineHelp | bbbTranslate\"\n    [glyph]=\"deviceSize === 's' ? null : icon\"\n    [class.control-disabled]=\"isEnable === false ? true : false\"\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\n    (click)=\"btnClick.emit()\"\n    [style.min-width.px]=\"minWidth ? minWidth : null\"\n>\n    @if (!onlyIcon || showText || deviceSize === 's') {\n    <span>{{ customText || text | bbbTranslate }}</span>\n    }\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: FormToolbarButtonComponent, selector: "bsu-form-toolbar-button", inputs: { parameters: "parameters" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "inlineHelpDirective", first: true, predicate: InlineHelpDirective, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<button\n    fd-toolbar-item\n    fd-button\n    [title]=\"inlineHelp | bbbTranslate\"\n    [glyph]=\"deviceSize === 's' ? null : icon\"\n    [class.control-disabled]=\"isEnable === false ? true : false\"\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\n    (click)=\"btnClick.emit()\"\n    [style.min-width.px]=\"minWidth ? minWidth : null\"\n>\n    @if (!onlyIcon || showText || deviceSize === 's') {\n    <span>{{ customText || text | bbbTranslate }}</span>\n    }\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: FormToolbarButtonComponent, decorators: [{
             type: Component,
@@ -12654,7 +12663,7 @@ class BarsaCartableGroupComponent extends BaseViewItemPropsComponent {
         this.allItem = { allCount, unreadCount };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCartableGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCartableGroupComponent, selector: "bsu-barsa-cartable-group", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- <li\n[interactive]=\"true\"\nfd-list-item\n[selected]=\"allItemChecked ? true : false\"\n(click)=\"onRowCheckAll()\"\n*ngIf=\"allItem\"\n>\n<div class=\"title-container\">\n  <div style=\"background-color: transparent; width: 0.2rem; height: 100%\"></div>\n  <span fd-list-title>\n    <div style=\"height: 100%; display: flex; align-items: center\">\n      <span [style.fontSize]=\"allItem.unreadCount > 0 ? 'bold' : null\">{{ '\u0647\u0645\u0647 \u0645\u0648\u0627\u0631\u062F' | bbbTranslate }}</span>\n      <ng-container *ngIf=\"allItem.unreadCount > 0\">\n        <strong style=\"padding: 0 2px; direction: ltr\">({{ allItem.unreadCount }})</strong>\n      </ng-container>\n      <span style=\"padding: 0 5px\" *ngIf=\"allItem.allCount > 0\">{{ allItem.allCount }}</span>\n    </div>\n  </span>\n</div>\n</li> -->\n\n<ng-container>\n    @if (allItem) {\n    <ng-container\n        *ngTemplateOutlet=\"\n            itemTemplate;\n            context: {\n                $implicit: '\u0647\u0645\u0647 \u0645\u0648\u0627\u0631\u062F' | bbbTranslate,\n                unreadCount: allItem.unreadCount,\n                allCount: allItem.allCount,\n                backColor: 'transparent',\n                isAll: true,\n                isChecked: allItemChecked\n            }\n        \"\n    ></ng-container>\n    }\n\n    <ng-container\n        *ngTemplateOutlet=\"\n            itemTemplate;\n            context: {\n                $implicit: parameters.CartableGroupField | rval: mo:allColumns:true,\n                unreadCount: parameters.UnreadCountField | rval: mo:allColumns,\n                allCount: parameters.AllCountField | rval: mo:allColumns,\n                backColor: (columns[0].Caption | rval: mo:columns),\n                isChecked: isChecked,\n                icon: parameters.IconField | rval: mo:allColumns:true,\n                isBuiltin: isBuiltin\n            }\n        \"\n    ></ng-container>\n</ng-container>\n@if (isLastBuiltin) {\n<li fd-list-item class=\"space\">\n    <span fd-list-title></span>\n</li>\n}\n<!-- <ng-container *ngIf=\"last\">\n<ul fd-list>\n  <li fd-list-group-header>\n    <span fd-list-title style=\"background:#f7f7f7\"></span>\n  </li>\n  <ng-container *ngFor=\"let mo2 of moDataList\">\n    <ng-container *ngIf=\"'\u0633\u06CC\u0633\u062A\u0645\u06CC' | rval: mo2:allColumns\">\n      <ng-container\n                    *ngTemplateOutlet=\"\n                        itemTemplate;\n                        context: {\n                            $implicit: parameters.CartableGroupField | rval: mo2:allColumns:true,\n                            unreadCount: parameters.UnreadCountField | rval: mo2:allColumns,\n                            allCount: parameters.AllCountField | rval: mo2:allColumns,\n                            backColor: columns[0].Caption | rval: mo2:columns,\n                            isChecked: isChecked\n                        }\n                    \"\n    ></ng-container>\n  </ng-container>\n</ng-container>\n</ul>\n</ng-container> -->\n\n<!-- <li fd-list-item [selected]=\"isChecked ? true : false\" (click)=\"onRowCheck()\" [interactive]=\"true\">\n<div class=\"title-container\">\n  <div [style.backgroundColor]=\"columns[0].Caption | rval: mo:columns\" style=\"width: 0.2rem; height: 100%\"></div>\n  <span fd-list-title>\n    <div style=\"height: 100%; display: flex; align-items: center\">\n      <span [style.fontSize]=\"parameters.UnreadCountField | rval: mo:allColumns:(true ? 'bold' : null)\"\n        >{{ parameters.CartableGroupField | rval: mo:allColumns:true }}\n      </span>\n      <ng-container *ngIf=\"parameters.UnreadCountField | rval: mo:allColumns:true\">\n        <strong style=\"padding: 0 2px; direction: ltr\"\n          >({{ parameters.UnreadCountField | rval: mo:allColumns:true }})</strong\n          >\n        </ng-container>\n        <span style=\"padding: 0 5px\">{{ parameters.AllCountField | rval: mo:allColumns:true }}</span>\n      </div>\n    </span>\n  </div>\n</li> -->\n<ng-template\n    #itemTemplate\n    let-caption\n    let-unreadCount=\"unreadCount\"\n    let-allCount=\"allCount\"\n    let-backColor=\"backColor\"\n    let-isAll=\"isAll\"\n    let-isChecked=\"isChecked\"\n    let-icon=\"icon\"\n    let-isBuiltin=\"isBuiltin\"\n>\n    @if (isBuiltin || allCount > 0 || isAll) {\n    <li fd-list-item [selected]=\"isChecked ? true : false\" (click)=\"onClick(isAll)\" [interactive]=\"true\">\n        <div class=\"title-container\">\n            <div [style.backgroundColor]=\"backColor\" style=\"width: 0.2rem; height: 100%\"></div>\n            @if (icon) {\n            <i fd-list-icon [glyph]=\"icon\"></i>\n            }\n            <span fd-list-title>\n                <div style=\"height: 100%; display: flex; align-items: center; column-gap: 5px\">\n                    @if (unreadCount && unreadCount > 0) {\n                    <strong>{{ caption }}</strong>\n                    <strong style=\"padding: 0 2px; direction: ltr\">({{ unreadCount }})</strong>\n                    } @else {\n                    <span>{{ caption }}</span>\n                    } @if (allCount && allCount > 0) {\n                    <span style=\"padding: 0 5px\">{{ allCount }}</span>\n                    }\n                </div>\n            </span>\n        </div>\n    </li>\n    }\n</ng-template>\n", styles: [":host{display:contents;width:100%;height:100%;cursor:pointer}.title-container{align-items:center;display:flex;column-gap:5px;height:100%;width:100%}li{padding:0}.space{cursor:default;background-color:var(--sapBackgroundColor);pointer-events:none}.space:focus:before{border:none}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCartableGroupComponent, selector: "bsu-barsa-cartable-group", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- <li\n[interactive]=\"true\"\nfd-list-item\n[selected]=\"allItemChecked ? true : false\"\n(click)=\"onRowCheckAll()\"\n*ngIf=\"allItem\"\n>\n<div class=\"title-container\">\n  <div style=\"background-color: transparent; width: 0.2rem; height: 100%\"></div>\n  <span fd-list-title>\n    <div style=\"height: 100%; display: flex; align-items: center\">\n      <span [style.fontSize]=\"allItem.unreadCount > 0 ? 'bold' : null\">{{ '\u0647\u0645\u0647 \u0645\u0648\u0627\u0631\u062F' | bbbTranslate }}</span>\n      <ng-container *ngIf=\"allItem.unreadCount > 0\">\n        <strong style=\"padding: 0 2px; direction: ltr\">({{ allItem.unreadCount }})</strong>\n      </ng-container>\n      <span style=\"padding: 0 5px\" *ngIf=\"allItem.allCount > 0\">{{ allItem.allCount }}</span>\n    </div>\n  </span>\n</div>\n</li> -->\n\n<ng-container>\n    @if (allItem) {\n    <ng-container\n        *ngTemplateOutlet=\"\n            itemTemplate;\n            context: {\n                $implicit: '\u0647\u0645\u0647 \u0645\u0648\u0627\u0631\u062F' | bbbTranslate,\n                unreadCount: allItem.unreadCount,\n                allCount: allItem.allCount,\n                backColor: 'transparent',\n                isAll: true,\n                isChecked: allItemChecked\n            }\n        \"\n    ></ng-container>\n    }\n\n    <ng-container\n        *ngTemplateOutlet=\"\n            itemTemplate;\n            context: {\n                $implicit: parameters.CartableGroupField | rval: mo:allColumns:true,\n                unreadCount: parameters.UnreadCountField | rval: mo:allColumns,\n                allCount: parameters.AllCountField | rval: mo:allColumns,\n                backColor: (columns[0].Caption | rval: mo:columns),\n                isChecked: isChecked,\n                icon: parameters.IconField | rval: mo:allColumns:true,\n                isBuiltin: isBuiltin\n            }\n        \"\n    ></ng-container>\n</ng-container>\n@if (isLastBuiltin) {\n<li fd-list-item class=\"space\">\n    <span fd-list-title></span>\n</li>\n}\n<!-- <ng-container *ngIf=\"last\">\n<ul fd-list>\n  <li fd-list-group-header>\n    <span fd-list-title style=\"background:#f7f7f7\"></span>\n  </li>\n  <ng-container *ngFor=\"let mo2 of moDataList\">\n    <ng-container *ngIf=\"'\u0633\u06CC\u0633\u062A\u0645\u06CC' | rval: mo2:allColumns\">\n      <ng-container\n                    *ngTemplateOutlet=\"\n                        itemTemplate;\n                        context: {\n                            $implicit: parameters.CartableGroupField | rval: mo2:allColumns:true,\n                            unreadCount: parameters.UnreadCountField | rval: mo2:allColumns,\n                            allCount: parameters.AllCountField | rval: mo2:allColumns,\n                            backColor: columns[0].Caption | rval: mo2:columns,\n                            isChecked: isChecked\n                        }\n                    \"\n    ></ng-container>\n  </ng-container>\n</ng-container>\n</ul>\n</ng-container> -->\n\n<!-- <li fd-list-item [selected]=\"isChecked ? true : false\" (click)=\"onRowCheck()\" [interactive]=\"true\">\n<div class=\"title-container\">\n  <div [style.backgroundColor]=\"columns[0].Caption | rval: mo:columns\" style=\"width: 0.2rem; height: 100%\"></div>\n  <span fd-list-title>\n    <div style=\"height: 100%; display: flex; align-items: center\">\n      <span [style.fontSize]=\"parameters.UnreadCountField | rval: mo:allColumns:(true ? 'bold' : null)\"\n        >{{ parameters.CartableGroupField | rval: mo:allColumns:true }}\n      </span>\n      <ng-container *ngIf=\"parameters.UnreadCountField | rval: mo:allColumns:true\">\n        <strong style=\"padding: 0 2px; direction: ltr\"\n          >({{ parameters.UnreadCountField | rval: mo:allColumns:true }})</strong\n          >\n        </ng-container>\n        <span style=\"padding: 0 5px\">{{ parameters.AllCountField | rval: mo:allColumns:true }}</span>\n      </div>\n    </span>\n  </div>\n</li> -->\n<ng-template\n    #itemTemplate\n    let-caption\n    let-unreadCount=\"unreadCount\"\n    let-allCount=\"allCount\"\n    let-backColor=\"backColor\"\n    let-isAll=\"isAll\"\n    let-isChecked=\"isChecked\"\n    let-icon=\"icon\"\n    let-isBuiltin=\"isBuiltin\"\n>\n    @if (isBuiltin || allCount > 0 || isAll) {\n    <li fd-list-item [selected]=\"isChecked ? true : false\" (click)=\"onClick(isAll)\" [interactive]=\"true\">\n        <div class=\"title-container\">\n            <div [style.backgroundColor]=\"backColor\" style=\"width: 0.2rem; height: 100%\"></div>\n            @if (icon) {\n            <i fd-list-icon [glyph]=\"icon\"></i>\n            }\n            <span fd-list-title>\n                <div style=\"height: 100%; display: flex; align-items: center; column-gap: 5px\">\n                    @if (unreadCount && unreadCount > 0) {\n                    <strong>{{ caption }}</strong>\n                    <strong style=\"padding: 0 2px; direction: ltr\">({{ unreadCount }})</strong>\n                    } @else {\n                    <span>{{ caption }}</span>\n                    } @if (allCount && allCount > 0) {\n                    <span style=\"padding: 0 5px\">{{ allCount }}</span>\n                    }\n                </div>\n            </span>\n        </div>\n    </li>\n    }\n</ng-template>\n", styles: [":host{display:contents;width:100%;height:100%;cursor:pointer}.title-container{align-items:center;display:flex;column-gap:5px;height:100%;width:100%}li{padding:0}.space{cursor:default;background-color:var(--sapBackgroundColor);pointer-events:none}.space:focus:before{border:none}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCartableGroupComponent, decorators: [{
             type: Component,
@@ -12717,7 +12726,7 @@ class BarsaToolbaritemSearchComponent extends BaseFormToolbaritemPropsComponent
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaToolbaritemSearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaToolbaritemSearchComponent, selector: "bsu-barsa-toolbaritem-search", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"searchTpl\"> </ng-container>\n<!-- <ng-container *ngTemplateOutlet=\"deviceSize !== 's' ? searchTpl : btnTpl\"> </ng-container> -->\n\n<ng-template #btnTpl>\n    <button fd-button glyph=\"search\" fdType=\"transparent\" (click)=\"onSearchModeChange()\"></button>\n    @if (searchMode) {\n    <div style=\"z-index: 1; position: absolute; left: 0; top: 0; bottom: 0; right: 0\">\n        <ng-container *ngTemplateOutlet=\"searchTpl\"></ng-container>\n    </div>\n    }\n</ng-template>\n<ng-template #searchTpl>\n    <!-- <button fd-button glyph=\"arrow-right\" fdType=\"transparent\"></button> -->\n    <!-- <fd-input-group placement=\"before\" glyph=\"arrow-right\" glyphAriaLabel=\"search\" placeholder=\"Search\">\n</fd-input-group> -->\n    <fd-input-group\n        [style.width]=\"deviceSize === 's' ? '100%' : '220px'\"\n        fd-toolbar-item\n        type=\"search\"\n        glyph=\"search\"\n        [glyphAriaLabel]=\"'Search' | bbbTranslate\"\n        [placeholder]=\"'Search' | bbbTranslate\"\n        [button]=\"true\"\n        [disabled]=\"false\"\n        [(ngModel)]=\"searchTerm\"\n        (addOnButtonClicked)=\"onSearchSubmit()\"\n        (keydown.enter)=\"onSearchSubmit()\"\n    >\n    </fd-input-group>\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%;min-width:180px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaToolbaritemSearchComponent, selector: "bsu-barsa-toolbaritem-search", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"searchTpl\"> </ng-container>\n<!-- <ng-container *ngTemplateOutlet=\"deviceSize !== 's' ? searchTpl : btnTpl\"> </ng-container> -->\n\n<ng-template #btnTpl>\n    <button fd-button glyph=\"search\" fdType=\"transparent\" (click)=\"onSearchModeChange()\"></button>\n    @if (searchMode) {\n    <div style=\"z-index: 1; position: absolute; left: 0; top: 0; bottom: 0; right: 0\">\n        <ng-container *ngTemplateOutlet=\"searchTpl\"></ng-container>\n    </div>\n    }\n</ng-template>\n<ng-template #searchTpl>\n    <!-- <button fd-button glyph=\"arrow-right\" fdType=\"transparent\"></button> -->\n    <!-- <fd-input-group placement=\"before\" glyph=\"arrow-right\" glyphAriaLabel=\"search\" placeholder=\"Search\">\n</fd-input-group> -->\n    <fd-input-group\n        [style.width]=\"deviceSize === 's' ? '100%' : '220px'\"\n        fd-toolbar-item\n        type=\"search\"\n        glyph=\"search\"\n        [glyphAriaLabel]=\"'Search' | bbbTranslate\"\n        [placeholder]=\"'Search' | bbbTranslate\"\n        [button]=\"true\"\n        [disabled]=\"false\"\n        [(ngModel)]=\"searchTerm\"\n        (addOnButtonClicked)=\"onSearchSubmit()\"\n        (keydown.enter)=\"onSearchSubmit()\"\n    >\n    </fd-input-group>\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%;min-width:180px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaToolbaritemSearchComponent, decorators: [{
             type: Component,
@@ -12767,7 +12776,7 @@ class BarsaPishnamayeshPayamComponent extends FieldBaseComponent {
                 useFactory: getDateService$1,
                 deps: [LogService]
             }
-        ], usesInheritance: true, ngImport: i0, template: "@if (data) {\n<ng-container\n    *ngTemplateOutlet=\"\n        showPayamClass;\n        context: {\n            $implicit: data,\n            primary: !data?.$details?.length,\n            isFirst: true\n        }\n    \"\n>\n</ng-container>\n}\n<ng-template #showPayamClass let-data let-primary=\"primary\" let-isFirst=\"isFirst\">\n    <ng-container\n        *ngTemplateOutlet=\"\n            namayeshPayam;\n            context: {\n                $implicit: data.payam.Subject,\n                fromText: data.payam.FromText,\n                toText: data.$toText,\n                importance: data.$importance,\n                readDate: data.$readDate,\n                sendDate: data.$sendDate,\n                ccText: data.$ccText,\n                bccText: data.$bccText,\n                accessLevel: data.$accessLevel,\n                content: data.$content,\n                fromPhoto: data.$fromPhoto,\n                details: data.$details,\n                attachments: data.$attachments,\n                todo: data.$todo,\n                customText: data.payam.CustomText,\n                primary: primary,\n                isFirst: isFirst\n            }\n        \"\n    >\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #namayeshPayam\n    let-subject\n    let-content=\"content\"\n    let-fromText=\"fromText\"\n    let-toText=\"toText\"\n    let-importance=\"importance\"\n    let-readDate=\"readDate\"\n    let-sendDate=\"sendDate\"\n    let-ccText=\"ccText\"\n    let-bccText=\"bccText\"\n    let-fromPhoto=\"fromPhoto\"\n    let-details=\"details\"\n    let-accessLevel=\"accessLevel\"\n    let-primary=\"primary\"\n    let-isFirst=\"isFirst\"\n    let-attachments=\"attachments\"\n    let-todo=\"todo\"\n    let-customText=\"customText\"\n>\n    <fd-card cardType=\"object\">\n        <fd-card-header>\n            <fd-avatar\n                [image]=\"fromPhoto\"\n                [circle]=\"true\"\n                size=\"s\"\n                [ariaLabel]=\"fromText\"\n                [label]=\"fromText\"\n                [title]=\"fromText\"\n            ></fd-avatar>\n            <div fd-card-title class=\"header-fields\">\n                <h5 fd-title>\n                    <a fd-link [emphasized]=\"true\" aria-label=\"Sender\"> {{ fromText }}</a>\n                </h5>\n                <fd-object-identifier [description]=\"'(' + sendDate + ')'\"> </fd-object-identifier>\n            </div>\n            <div fd-card-subtitle>\n                <h5 fd-title>{{ subject }}</h5>\n                <fd-popover>\n                    <fd-popover-control>\n                        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">{{ 'Recievers' | bbbTranslate }}</button>\n                    </fd-popover-control>\n                    <fd-popover-body>\n                        <ul fd-list>\n                            @for (rec of toText; track rec) {\n                            <li fd-list-item>\n                                <a fd-list-link>{{ rec }}</a>\n                            </li>\n                            }\n                        </ul>\n                    </fd-popover-body>\n                </fd-popover>\n            </div>\n        </fd-card-header>\n        <fd-card-content>\n            <fd-panel [expanded]=\"isFirst\">\n                <div fd-panel-title id=\"panel-expandable-title-1\">\n                    <h5 fd-title>{{ '\u0645\u062D\u062A\u0648\u0627\u06CC \u067E\u06CC\u0627\u0645' | bbbTranslate }}</h5>\n                    <div class=\"payamIcons\">\n                        @if (importance.icon) {\n                        <fd-popover>\n                            <fd-popover-control>\n                                <img [src]=\"'/Customization/Mail/' + importance.icon\" />\n                            </fd-popover-control>\n                            <fd-popover-body>\n                                <ul fd-list>\n                                    <li fd-list-item>{{ importance.text }}</li>\n                                </ul>\n                            </fd-popover-body>\n                        </fd-popover>\n                        } @if (accessLevel.icon) {\n                        <fd-popover>\n                            <fd-popover-control>\n                                <img [src]=\"'/Customization/Mail/' + accessLevel.icon\" />\n                            </fd-popover-control>\n                            <fd-popover-body>\n                                <ul fd-list>\n                                    <li fd-list-item>{{ accessLevel.text }}</li>\n                                </ul>\n                            </fd-popover-body>\n                        </fd-popover>\n                        } @if (todo) {\n                        <fd-info-label [label]=\"todo.text\" [color]=\"todo.color\" [title]=\"todo.text\"></fd-info-label>\n                        }\n                    </div>\n                </div>\n                <div fd-panel-content>\n                    @if (customText) {\n                    <div>\n                        <fd-message-strip type=\"information\" [noIcon]=\"true\" [dismissible]=\"false\">\n                            {{ customText }}\n                        </fd-message-strip>\n                    </div>\n                    }\n                    <div [innerHtml]=\"content\" [disable]=\"!primary || attachments?.length\"></div>\n\n                    @if (attachments?.length) {\n                    <div class=\"file-viewer-attachments\">\n                        @for (file of attachments; track file) { @if (!file.IsDeleted) {\n                        <bsu-file-viewer-popover\n                            [file]=\"file\"\n                            [files]=\"attachments\"\n                            [deviceSize]=\"(deviceSize$ | async)!!\"\n                            [canDownload]=\"true\"\n                            [disableRemove]=\"true\"\n                        ></bsu-file-viewer-popover>\n                        } } @if (attachments.length > 1) {\n                        <button\n                            fd-button\n                            [title]=\"'Download' | bbbTranslate\"\n                            [glyph]=\"'download'\"\n                            downloadFiles\n                            [files]=\"attachments\"\n                        ></button>\n                        }\n                    </div>\n                    }\n                    <div class=\"readAt\">\n                        @if (readDate) {\n                        <fd-object-identifier [description]=\"('ReadAt' | bbbTranslate) + ': (' + readDate + ')'\">\n                        </fd-object-identifier>\n                        }\n                    </div>\n                </div>\n            </fd-panel>\n        </fd-card-content>\n        <!-- <fd-card-footer>\n    <button *fdCardFooterActionItem fd-button fdCompact>Assign to Project</button>\n  </fd-card-footer> -->\n    </fd-card>\n    @for (detail of details; track detail) {\n    <ng-contianer>\n        <ng-container\n            *ngTemplateOutlet=\"\n                showPayamClass;\n                context: {\n                    $implicit: detail\n                }\n            \"\n        >\n        </ng-container>\n    </ng-contianer>\n    }\n</ng-template>\n", styles: [":host{display:block;position:relative;width:100%;height:100%}:host ::ng-deep .fd-panel__content{border-bottom:none;padding-bottom:5px}:host ::ng-deep .fd-card__subtitle{display:flex;align-items:center;column-gap:5px;justify-content:start;height:auto;max-height:initial}:host ::ng-deep .fd-card__subtitle h5{white-space:initial!important}:host ::ng-deep .fd-object-identifier__text{margin-top:0}:host ::ng-deep .fd-panel__header{border-bottom:none}fd-card-header{cursor:default;border-bottom:none!important}fd-card-header:before{position:relative!important;display:none!important}fd-card-header:hover{background:var(--fdCard_Background_Color)!important}.readAt{padding-top:2rem}.readAt ::ng-deep p{color:var(--sapButton_BorderColor)!important}.payamIcons{display:flex;column-gap:5px}.payamIcons img{width:16px}@media (max-width: 410px){h5{max-width:210px}}@media (max-width: 1040px){.h5{max-width:600px}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i5$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i6$5.InfoLabelComponent, selector: "fd-info-label", inputs: ["class", "type", "glyph", "font", "color", "label", "title", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i11$1.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i3$6.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$6.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$6.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "@if (data) {\n<ng-container\n    *ngTemplateOutlet=\"\n        showPayamClass;\n        context: {\n            $implicit: data,\n            primary: !data?.$details?.length,\n            isFirst: true\n        }\n    \"\n>\n</ng-container>\n}\n<ng-template #showPayamClass let-data let-primary=\"primary\" let-isFirst=\"isFirst\">\n    <ng-container\n        *ngTemplateOutlet=\"\n            namayeshPayam;\n            context: {\n                $implicit: data.payam.Subject,\n                fromText: data.payam.FromText,\n                toText: data.$toText,\n                importance: data.$importance,\n                readDate: data.$readDate,\n                sendDate: data.$sendDate,\n                ccText: data.$ccText,\n                bccText: data.$bccText,\n                accessLevel: data.$accessLevel,\n                content: data.$content,\n                fromPhoto: data.$fromPhoto,\n                details: data.$details,\n                attachments: data.$attachments,\n                todo: data.$todo,\n                customText: data.payam.CustomText,\n                primary: primary,\n                isFirst: isFirst\n            }\n        \"\n    >\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #namayeshPayam\n    let-subject\n    let-content=\"content\"\n    let-fromText=\"fromText\"\n    let-toText=\"toText\"\n    let-importance=\"importance\"\n    let-readDate=\"readDate\"\n    let-sendDate=\"sendDate\"\n    let-ccText=\"ccText\"\n    let-bccText=\"bccText\"\n    let-fromPhoto=\"fromPhoto\"\n    let-details=\"details\"\n    let-accessLevel=\"accessLevel\"\n    let-primary=\"primary\"\n    let-isFirst=\"isFirst\"\n    let-attachments=\"attachments\"\n    let-todo=\"todo\"\n    let-customText=\"customText\"\n>\n    <fd-card cardType=\"object\">\n        <fd-card-header>\n            <fd-avatar\n                [image]=\"fromPhoto\"\n                [circle]=\"true\"\n                size=\"s\"\n                [ariaLabel]=\"fromText\"\n                [label]=\"fromText\"\n                [title]=\"fromText\"\n            ></fd-avatar>\n            <div fd-card-title class=\"header-fields\">\n                <h5 fd-title>\n                    <a fd-link [emphasized]=\"true\" aria-label=\"Sender\"> {{ fromText }}</a>\n                </h5>\n                <fd-object-identifier [description]=\"'(' + sendDate + ')'\"> </fd-object-identifier>\n            </div>\n            <div fd-card-subtitle>\n                <h5 fd-title>{{ subject }}</h5>\n                <fd-popover>\n                    <fd-popover-control>\n                        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">{{ 'Recievers' | bbbTranslate }}</button>\n                    </fd-popover-control>\n                    <fd-popover-body>\n                        <ul fd-list>\n                            @for (rec of toText; track rec) {\n                            <li fd-list-item>\n                                <a fd-list-link>{{ rec }}</a>\n                            </li>\n                            }\n                        </ul>\n                    </fd-popover-body>\n                </fd-popover>\n            </div>\n        </fd-card-header>\n        <fd-card-content>\n            <fd-panel [expanded]=\"isFirst\">\n                <div fd-panel-title id=\"panel-expandable-title-1\">\n                    <h5 fd-title>{{ '\u0645\u062D\u062A\u0648\u0627\u06CC \u067E\u06CC\u0627\u0645' | bbbTranslate }}</h5>\n                    <div class=\"payamIcons\">\n                        @if (importance.icon) {\n                        <fd-popover>\n                            <fd-popover-control>\n                                <img [src]=\"'/Customization/Mail/' + importance.icon\" />\n                            </fd-popover-control>\n                            <fd-popover-body>\n                                <ul fd-list>\n                                    <li fd-list-item>{{ importance.text }}</li>\n                                </ul>\n                            </fd-popover-body>\n                        </fd-popover>\n                        } @if (accessLevel.icon) {\n                        <fd-popover>\n                            <fd-popover-control>\n                                <img [src]=\"'/Customization/Mail/' + accessLevel.icon\" />\n                            </fd-popover-control>\n                            <fd-popover-body>\n                                <ul fd-list>\n                                    <li fd-list-item>{{ accessLevel.text }}</li>\n                                </ul>\n                            </fd-popover-body>\n                        </fd-popover>\n                        } @if (todo) {\n                        <fd-info-label [label]=\"todo.text\" [color]=\"todo.color\" [title]=\"todo.text\"></fd-info-label>\n                        }\n                    </div>\n                </div>\n                <div fd-panel-content>\n                    @if (customText) {\n                    <div>\n                        <fd-message-strip type=\"information\" [noIcon]=\"true\" [dismissible]=\"false\">\n                            {{ customText }}\n                        </fd-message-strip>\n                    </div>\n                    }\n                    <div [innerHtml]=\"content\" [disable]=\"!primary || attachments?.length\"></div>\n\n                    @if (attachments?.length) {\n                    <div class=\"file-viewer-attachments\">\n                        @for (file of attachments; track file) { @if (!file.IsDeleted) {\n                        <bsu-file-viewer-popover\n                            [file]=\"file\"\n                            [files]=\"attachments\"\n                            [deviceSize]=\"(deviceSize$ | async)!!\"\n                            [canDownload]=\"true\"\n                            [disableRemove]=\"true\"\n                        ></bsu-file-viewer-popover>\n                        } } @if (attachments.length > 1) {\n                        <button\n                            fd-button\n                            [title]=\"'Download' | bbbTranslate\"\n                            [glyph]=\"'download'\"\n                            downloadFiles\n                            [files]=\"attachments\"\n                        ></button>\n                        }\n                    </div>\n                    }\n                    <div class=\"readAt\">\n                        @if (readDate) {\n                        <fd-object-identifier [description]=\"('ReadAt' | bbbTranslate) + ': (' + readDate + ')'\">\n                        </fd-object-identifier>\n                        }\n                    </div>\n                </div>\n            </fd-panel>\n        </fd-card-content>\n        <!-- <fd-card-footer>\n    <button *fdCardFooterActionItem fd-button fdCompact>Assign to Project</button>\n  </fd-card-footer> -->\n    </fd-card>\n    @for (detail of details; track detail) {\n    <ng-contianer>\n        <ng-container\n            *ngTemplateOutlet=\"\n                showPayamClass;\n                context: {\n                    $implicit: detail\n                }\n            \"\n        >\n        </ng-container>\n    </ng-contianer>\n    }\n</ng-template>\n", styles: [":host{display:block;position:relative;width:100%;height:100%}:host ::ng-deep .fd-panel__content{border-bottom:none;padding-bottom:5px}:host ::ng-deep .fd-card__subtitle{display:flex;align-items:center;column-gap:5px;justify-content:start;height:auto;max-height:initial}:host ::ng-deep .fd-card__subtitle h5{white-space:initial!important}:host ::ng-deep .fd-object-identifier__text{margin-top:0}:host ::ng-deep .fd-panel__header{border-bottom:none}fd-card-header{cursor:default;border-bottom:none!important}fd-card-header:before{position:relative!important;display:none!important}fd-card-header:hover{background:var(--fdCard_Background_Color)!important}.readAt{padding-top:2rem}.readAt ::ng-deep p{color:var(--sapButton_BorderColor)!important}.payamIcons{display:flex;column-gap:5px}.payamIcons img{width:16px}@media (max-width: 410px){h5{max-width:210px}}@media (max-width: 1040px){.h5{max-width:600px}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i5$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i6$5.InfoLabelComponent, selector: "fd-info-label", inputs: ["class", "type", "glyph", "font", "color", "label", "title", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i11$1.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i3$6.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$6.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$6.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaPishnamayeshPayamComponent, decorators: [{
             type: Component,
@@ -12897,7 +12906,7 @@ class BarsaTextEllipsisComponent extends BaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTextEllipsisComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTextEllipsisComponent, selector: "bsu-barsa-text-ellipsis,[textEllipsis]", inputs: { text: "text", fontSize: "fontSize", deviceSize: "deviceSize" }, usesInheritance: true, ngImport: i0, template: "<div (ellapsised)=\"onEllapsised($event)\" ellapsisText [ellapsisText]=\"text | bbbTranslate\">\n    {{ text | bbbTranslate }}\n</div>\n@if (ellipsised) {\n<fd-popover>\n    <fd-popover-control>\n        <button style=\"position: absolute; left: 0\" fd-button glyph=\"overflow\" fdType=\"transparent\" fdCompact></button>\n    </fd-popover-control>\n    <fd-popover-body style=\"max-width: 320px\">\n        <fd-text [text]=\"text | bbbTranslate\" [whitespaces]=\"true\"></fd-text>\n    </fd-popover-body>\n</fd-popover>\n}\n", styles: [":host{display:block;position:relative}\n"], dependencies: [{ kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize"], outputs: ["ellapsised"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaTextEllipsisComponent, selector: "bsu-barsa-text-ellipsis,[textEllipsis]", inputs: { text: "text", fontSize: "fontSize", deviceSize: "deviceSize" }, usesInheritance: true, ngImport: i0, template: "<div (ellapsised)=\"onEllapsised($event)\" ellapsisText [ellapsisText]=\"text | bbbTranslate\">\n    {{ text | bbbTranslate }}\n</div>\n@if (ellipsised) {\n<fd-popover>\n    <fd-popover-control>\n        <button style=\"position: absolute; left: 0\" fd-button glyph=\"overflow\" fdType=\"transparent\" fdCompact></button>\n    </fd-popover-control>\n    <fd-popover-body style=\"max-width: 320px\">\n        <fd-text [text]=\"text | bbbTranslate\" [whitespaces]=\"true\"></fd-text>\n    </fd-popover-body>\n</fd-popover>\n}\n", styles: [":host{display:block;position:relative}\n"], dependencies: [{ kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize"], outputs: ["ellapsised"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i2$8.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaTextEllipsisComponent, decorators: [{
             type: Component,
@@ -12915,7 +12924,7 @@ class BarsaListFileLinearGmailComponent extends UiFileLinearListBoxComponent {
         this.retry(fileAttachment);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaListFileLinearGmailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaListFileLinearGmailComponent, selector: "bsu-barsa-list-file-linear-gmail", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\n    @for (item of value; track item) { @if (!item.IsDeleted) {\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0.5rem 0 0 30%\">\n        @if (item.inEdit) {\n        <input\n            style=\"width: 90%\"\n            fd-form-control\n            [value]=\"item.fileName\"\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\n        />\n        } @if (!item.inEdit) {\n        <span fd-list-title>\n            {{ item.fileName }}\n        </span>\n        }\n        <span fd-list-secondary>\n            <button\n                ariaLabel=\"Edit Or Save\"\n                fdType=\"transparent\"\n                class=\"fd-button--compact\"\n                fd-button\n                fdCompact\n                [glyph]=\"item.inEdit ? 'save' : 'edit'\"\n                (click)=\"item.inEdit = !item.inEdit\"\n            ></button>\n            @if (!item.inEdit) {\n            <button ariaLabel=\"Remove\" fdType=\"transparent\" title=\"Remove\" fd-button glyph=\"delete\"></button>\n            }\n        </span>\n    </li>\n    } }\n</ul>\n<ul fd-list [byline]=\"true\">\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\n    <li fd-list-item>\n        <div fd-list-content style=\"text-align: center\">\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\n        </div>\n    </li>\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\n    <li fd-list-item>\n        <span fd-list-thumbnail>\n            @if (valueExtra[file.Id].IsIcon) {\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\n            } @else {\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\n            }\n        </span>\n        <!-- for byline, fd-list-content is mandatory -->\n        <div fd-list-content>\n            <div fd-list-title>{{ file.FileName }}</div>\n            <div fd-list-byline [twoCol]=\"true\">\n                <div fd-list-byline-left></div>\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                        @if (file.IsNew) {\n                        <span\n                            fd-toolbar-item\n                            fd-object-status\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                        ></span>\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                        <fd-slider\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\n                            [name]=\"'filerLinear_' + id\"\n                            fd-toolbar-item\n                            [id]=\"id\"\n                            [min]=\"0\"\n                            [max]=\"100\"\n                            [step]=\"1\"\n                        >\n                        </fd-slider>\n                        } }\n                    </fd-toolbar>\n                </div>\n            </div>\n        </div>\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\n        }\n    </li>\n    } } }\n</ul>\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaListFileLinearGmailComponent, selector: "bsu-barsa-list-file-linear-gmail", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\n    @for (item of value; track item) { @if (!item.IsDeleted) {\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0.5rem 0 0 30%\">\n        @if (item.inEdit) {\n        <input\n            style=\"width: 90%\"\n            fd-form-control\n            [value]=\"item.fileName\"\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\n        />\n        } @if (!item.inEdit) {\n        <span fd-list-title>\n            {{ item.fileName }}\n        </span>\n        }\n        <span fd-list-secondary>\n            <button\n                ariaLabel=\"Edit Or Save\"\n                fdType=\"transparent\"\n                class=\"fd-button--compact\"\n                fd-button\n                fdCompact\n                [glyph]=\"item.inEdit ? 'save' : 'edit'\"\n                (click)=\"item.inEdit = !item.inEdit\"\n            ></button>\n            @if (!item.inEdit) {\n            <button ariaLabel=\"Remove\" fdType=\"transparent\" title=\"Remove\" fd-button glyph=\"delete\"></button>\n            }\n        </span>\n    </li>\n    } }\n</ul>\n<ul fd-list [byline]=\"true\">\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\n    <li fd-list-item>\n        <div fd-list-content style=\"text-align: center\">\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\n        </div>\n    </li>\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\n    <li fd-list-item>\n        <span fd-list-thumbnail>\n            @if (valueExtra[file.Id].IsIcon) {\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\n            } @else {\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\n            }\n        </span>\n        <!-- for byline, fd-list-content is mandatory -->\n        <div fd-list-content>\n            <div fd-list-title>{{ file.FileName }}</div>\n            <div fd-list-byline [twoCol]=\"true\">\n                <div fd-list-byline-left></div>\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                        @if (file.IsNew) {\n                        <span\n                            fd-toolbar-item\n                            fd-object-status\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\n                        ></span>\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\n                        <fd-slider\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\n                            [name]=\"'filerLinear_' + id\"\n                            fd-toolbar-item\n                            [id]=\"id\"\n                            [min]=\"0\"\n                            [max]=\"100\"\n                            [step]=\"1\"\n                        >\n                        </fd-slider>\n                        } }\n                    </fd-toolbar>\n                </div>\n            </div>\n        </div>\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\n        }\n    </li>\n    } } }\n</ul>\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "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"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11$2.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaListFileLinearGmailComponent, decorators: [{
             type: Component,
@@ -13001,7 +13010,7 @@ class BarsaEnumMenuButtonComponent extends FieldBaseComponent {
         this.fireContextEvent('select', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaEnumMenuButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaEnumMenuButtonComponent, selector: "bsu-barsa-enum-menu-button", usesInheritance: true, ngImport: i0, template: "<button\n    fd-button\n    [label]=\"valueCaption ? valueCaption : Setting.ControlFieldCaptionTranslated\"\n    [title]=\"Setting.ControlFieldCaptionTranslated\"\n    [fdType]=\"valueStatus\"\n    [fdMenu]=\"(disableOrReadonly$ | async) === true ? false : true\"\n    [fdMenuTrigger]=\"(disableOrReadonly$ | async) === true ? undefined : menu\"\n    [class.placeholder-custom]=\"!valueItem || valueItem?.IsEmpty\"\n></button>\n<fd-menu #menu>\n    @for (item of context.store.data[context.store.root]; track item) {\n    <li fd-menu-item>\n        <a fd-menu-interactive (click)=\"onValueChange(menu, item.id)\">\n            <span fd-menu-title [class.list-empty-item]=\"item.IsEmpty\">{{ item.txt }}</span>\n        </a>\n    </li>\n    }\n</fd-menu>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaEnumMenuButtonComponent, selector: "bsu-barsa-enum-menu-button", usesInheritance: true, ngImport: i0, template: "<button\n    fd-button\n    [label]=\"valueCaption ? valueCaption : Setting.ControlFieldCaptionTranslated\"\n    [title]=\"Setting.ControlFieldCaptionTranslated\"\n    [fdType]=\"valueStatus\"\n    [fdMenu]=\"(disableOrReadonly$ | async) === true ? false : true\"\n    [fdMenuTrigger]=\"(disableOrReadonly$ | async) === true ? undefined : menu\"\n    [class.placeholder-custom]=\"!valueItem || valueItem?.IsEmpty\"\n></button>\n<fd-menu #menu>\n    @for (item of context.store.data[context.store.root]; track item) {\n    <li fd-menu-item>\n        <a fd-menu-interactive (click)=\"onValueChange(menu, item.id)\">\n            <span fd-menu-title [class.list-empty-item]=\"item.IsEmpty\">{{ item.txt }}</span>\n        </a>\n    </li>\n    }\n</fd-menu>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaEnumMenuButtonComponent, decorators: [{
             type: Component,
@@ -13018,7 +13027,7 @@ class BarsaCardLayoutPanelComponent extends LayoutPanelBaseComponent {
         FillAllLayoutControls(this.config, this.layoutControls);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCardLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCardLayoutPanelComponent, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    @if (parameters?.HideTitle !== true) {\n    <fd-card-header [class.hideBorder]=\"parameters?.HideHeaderBorder\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    }\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer style=\"display: none\"> </fd-card-footer>\n</fd-card>\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$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i6$1.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: "17.3.5", type: BarsaCardLayoutPanelComponent, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    @if (parameters?.HideTitle !== true) {\n    <fd-card-header [class.hideBorder]=\"parameters?.HideHeaderBorder\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    }\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer style=\"display: none\"> </fd-card-footer>\n</fd-card>\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$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i6$1.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCardLayoutPanelComponent, decorators: [{
             type: Component,
@@ -13076,7 +13085,7 @@ class BarsaBarPanelComponent extends LayoutPanelBaseComponent {
         FillAllLayoutControls(this.config, this.layoutControls);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaBarPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaBarPanelComponent, selector: "bsu-barsa-bar-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card>\n    <fd-card-content>\n        <bsu-barsa-base-layout-panel\n            [layoutControls]=\"layoutControls\"\n            [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n            [isSearchPanel]=\"isSearchPanel\"\n            [config]=\"config\"\n        ></bsu-barsa-base-layout-panel>\n    </fd-card-content>\n</fd-card>\n", styles: [":host div:first-child{height:auto}\n"], dependencies: [{ kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: BarsaBaseLayoutPanelComponent, selector: "bsu-barsa-base-layout-panel", inputs: ["layoutControls", "config", "maxLabelWidth", "isSearchPanel"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaBarPanelComponent, selector: "bsu-barsa-bar-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card>\n    <fd-card-content>\n        <bsu-barsa-base-layout-panel\n            [layoutControls]=\"layoutControls\"\n            [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n            [isSearchPanel]=\"isSearchPanel\"\n            [config]=\"config\"\n        ></bsu-barsa-base-layout-panel>\n    </fd-card-content>\n</fd-card>\n", styles: [":host div:first-child{height:auto}\n"], dependencies: [{ kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: BarsaBaseLayoutPanelComponent, selector: "bsu-barsa-base-layout-panel", inputs: ["layoutControls", "config", "maxLabelWidth", "isSearchPanel"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaBarPanelComponent, decorators: [{
             type: Component,
@@ -13108,7 +13117,7 @@ class BarsaFormSideContentComponent extends FormPropsBaseComponent {
         return isSmallDevice;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaFormSideContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", 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) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"afterViewInit && (isOpenQuickAccess = false)\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\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}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], 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.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i5$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { 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: "17.3.5", 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) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"afterViewInit && (isOpenQuickAccess = false)\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\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}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], 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.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i5$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaFormSideContentComponent, decorators: [{
             type: Component,
@@ -13175,7 +13184,7 @@ class BarsaGridLayoutPanelComponent extends LayoutPanelBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaGridLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaGridLayoutPanelComponent, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if (parameters?.CardMode) {\n<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n} @else { @if (config) {\n<fd-layout-grid [style.margin]=\"parameters?.CardMode ? null : parameters?.Margin\">\n    <div fdLayoutGridRow>\n        @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\n        <div\n            class=\"container\"\n            [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n            [colMd]=\"gridCol.ColMd\"\n            [colLg]=\"gridCol.ColLg\"\n            [colXl]=\"gridCol.ColXl\"\n        >\n            @if (gridCol.$LayoutGroup) {\n            <bnrc-dynamic-layout\n                [config]=\"gridCol.$LayoutGroup\"\n                [selector]=\"'bsu-ly-layout-panel'\"\n                [name]=\"'LyLayoutPanelComponent'\"\n                [module]=\"'BarsaSapUi'\"\n                [moduleFileName]=\"'BarsaSapUi'\"\n                [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n                [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n                [isSearchPanel]=\"isSearchPanel\"\n            >\n            </bnrc-dynamic-layout>\n            }\n            <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\n        </div>\n        }\n    </div>\n</fd-layout-grid>\n} }\n<ng-template #layoutGridTpl let-cardMode>\n    @if (config) {\n    <fd-layout-grid [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\n            <div\n                class=\"container\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                @if (gridCol.$LayoutGroup) {\n                <bnrc-dynamic-layout\n                    [config]=\"gridCol.$LayoutGroup\"\n                    [selector]=\"'bsu-ly-layout-panel'\"\n                    [name]=\"'LyLayoutPanelComponent'\"\n                    [module]=\"'BarsaSapUi'\"\n                    [moduleFileName]=\"'BarsaSapUi'\"\n                    [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n                    [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n                    [isSearchPanel]=\"isSearchPanel\"\n                >\n                </bnrc-dynamic-layout>\n                }\n                <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\n            </div>\n            }\n        </div>\n    </fd-layout-grid>\n    }\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host .container ::ng-deep>bsu-ly-layout-panel>fd-panel>.fd-panel>.fd-panel__content{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$3.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: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaGridLayoutPanelComponent, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if (parameters?.CardMode) {\n<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n} @else { @if (config) {\n<fd-layout-grid [style.margin]=\"parameters?.CardMode ? null : parameters?.Margin\">\n    <div fdLayoutGridRow>\n        @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\n        <div\n            class=\"container\"\n            [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n            [colMd]=\"gridCol.ColMd\"\n            [colLg]=\"gridCol.ColLg\"\n            [colXl]=\"gridCol.ColXl\"\n        >\n            @if (gridCol.$LayoutGroup) {\n            <bnrc-dynamic-layout\n                [config]=\"gridCol.$LayoutGroup\"\n                [selector]=\"'bsu-ly-layout-panel'\"\n                [name]=\"'LyLayoutPanelComponent'\"\n                [module]=\"'BarsaSapUi'\"\n                [moduleFileName]=\"'BarsaSapUi'\"\n                [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n                [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n                [isSearchPanel]=\"isSearchPanel\"\n            >\n            </bnrc-dynamic-layout>\n            }\n            <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\n        </div>\n        }\n    </div>\n</fd-layout-grid>\n} }\n<ng-template #layoutGridTpl let-cardMode>\n    @if (config) {\n    <fd-layout-grid [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\n            <div\n                class=\"container\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                @if (gridCol.$LayoutGroup) {\n                <bnrc-dynamic-layout\n                    [config]=\"gridCol.$LayoutGroup\"\n                    [selector]=\"'bsu-ly-layout-panel'\"\n                    [name]=\"'LyLayoutPanelComponent'\"\n                    [module]=\"'BarsaSapUi'\"\n                    [moduleFileName]=\"'BarsaSapUi'\"\n                    [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n                    [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n                    [isSearchPanel]=\"isSearchPanel\"\n                >\n                </bnrc-dynamic-layout>\n                }\n                <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\n            </div>\n            }\n        </div>\n    </fd-layout-grid>\n    }\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host .container ::ng-deep>bsu-ly-layout-panel>fd-panel>.fd-panel>.fd-panel__content{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$3.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: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaGridLayoutPanelComponent, decorators: [{
             type: Component,
@@ -13290,7 +13299,7 @@ class UiMultiSelectCheckboxComponent extends UiMultiSelectComboComponent {
         this._raiseValueChanged();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMultiSelectCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMultiSelectCheckboxComponent, selector: "bsu-ui-multi-select-checkbox", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\n    @for (item of dataList; track item; let i = $index; let first = $first) {\n    <div fd-form-item>\n        <fd-checkbox\n            [id]=\"id + i\"\n            (change)=\"onCheckedChange(item)\"\n            [ngModel]=\"item.checked\"\n            [disabled]=\"(disableOrReadonly$ | async)!!\"\n            [label]=\"item.txt\"\n        >\n        </fd-checkbox>\n    </div>\n    }\n</fd-form-group>\n", styles: [":host{display:block;width:100%;height:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMultiSelectCheckboxComponent, selector: "bsu-ui-multi-select-checkbox", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\n    @for (item of dataList; track item; let i = $index; let first = $first) {\n    <div fd-form-item>\n        <fd-checkbox\n            [id]=\"id + i\"\n            (change)=\"onCheckedChange(item)\"\n            [ngModel]=\"item.checked\"\n            [disabled]=\"(disableOrReadonly$ | async)!!\"\n            [label]=\"item.txt\"\n        >\n        </fd-checkbox>\n    </div>\n    }\n</fd-form-group>\n", styles: [":host{display:block;width:100%;height:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMultiSelectCheckboxComponent, decorators: [{
             type: Component,
@@ -13366,7 +13375,7 @@ class UiMultiSelectCardComponent extends UiMultiSelectComboComponent {
         this._raiseValueChanged();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMultiSelectCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMultiSelectCardComponent, selector: "bsu-ui-multi-select-card", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\n    @for (item of dataList; track item; let i = $index; let first = $first) {\n    <div fd-form-item>\n        <fd-card>\n            <fd-card-content>\n                <img\n                    width=\"90px\"\n                    [src]=\"item.fileId | picFieldSrc: 'PictureFileInfo':item.Id:item.fieldDefId\"\n                    [alt]=\"item.txt\"\n                    [attr.aria-label]=\"item.txt\"\n                    [title]=\"item.txt\"\n                />\n            </fd-card-content>\n            <fd-card-header (click)=\"onRadioClicked(item)\">\n                <fd-radio-button\n                    fd-card-title\n                    [value]=\"item.id\"\n                    [id]=\"'radio-' + id + i\"\n                    [name]=\"'radio' + id + i\"\n                    [disabled]=\"(disableOrReadonly$ | async)!!\"\n                    [ngModel]=\"value\"\n                    [selectedValue]=\"value\"\n                >\n                    {{ item.txt }}\n                </fd-radio-button>\n            </fd-card-header>\n        </fd-card>\n    </div>\n    }\n</fd-form-group>\n", styles: [":host{display:block;width:100%;height:100%}:host div[fd-form-item]{margin:0 .5rem}fd-form-group{row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: i3$5.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiMultiSelectCardComponent, selector: "bsu-ui-multi-select-card", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\n    @for (item of dataList; track item; let i = $index; let first = $first) {\n    <div fd-form-item>\n        <fd-card>\n            <fd-card-content>\n                <img\n                    width=\"90px\"\n                    [src]=\"item.fileId | picFieldSrc: 'PictureFileInfo':item.Id:item.fieldDefId\"\n                    [alt]=\"item.txt\"\n                    [attr.aria-label]=\"item.txt\"\n                    [title]=\"item.txt\"\n                />\n            </fd-card-content>\n            <fd-card-header (click)=\"onRadioClicked(item)\">\n                <fd-radio-button\n                    fd-card-title\n                    [value]=\"item.id\"\n                    [id]=\"'radio-' + id + i\"\n                    [name]=\"'radio' + id + i\"\n                    [disabled]=\"(disableOrReadonly$ | async)!!\"\n                    [ngModel]=\"value\"\n                    [selectedValue]=\"value\"\n                >\n                    {{ item.txt }}\n                </fd-radio-button>\n            </fd-card-header>\n        </fd-card>\n    </div>\n    }\n</fd-form-group>\n", styles: [":host{display:block;width:100%;height:100%}:host div[fd-form-item]{margin:0 .5rem}fd-form-group{row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: i3$5.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiMultiSelectCardComponent, decorators: [{
             type: Component,
@@ -13510,7 +13519,7 @@ class BarsaReportOneOfListComponent extends ReportViewBaseComponent {
         this.hastLastRecord.set(molist.length ? true : false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaReportOneOfListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaReportOneOfListComponent, selector: "bsu-barsa-report-one-of-list", inputs: { disabled: "disabled" }, viewQueries: [{ propertyName: "_inputGroupRef", first: true, predicate: ["InputGroupRef"], descendants: true, static: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"tw-relative\" #containerRef>\n    <input\n        fd-form-control\n        [readonly]=\"true\"\n        [ngModel]=\"!hastLastRecord() ? '' : (viewSetting.DbColumnName | rval: moDataList[0]:allColumns:true)\"\n        class=\"revert-readonly-bg\"\n    />\n    <div class=\"!tw-absolute tw-left-0 tw-top-[0.1875rem] tw-flex\">\n        @if (viewSetting.OpenInIndependentForm) {\n        <button\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"popup-window\"\n            ariaLabel=\"Open in an independent form\"\n            title=\"Open in an independent form\"\n            (click)=\"openInIndependentFormClicked()\"\n        ></button>\n        }\n        <button\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"list\"\n            ariaLabel=\"Show list\"\n            title=\"Show list\"\n            (click)=\"open(popover, dialogTemplate)\"\n        ></button>\n    </div>\n    <fd-popover\n        #popover\n        placement=\"bottom-end\"\n        [focusTrapped]=\"true\"\n        [focusAutoCapture]=\"true\"\n        [appendTo]=\"containerRef\"\n        class=\"!tw-block\"\n    >\n        <fd-popover-body [style.width.px]=\"containerRef.offsetWidth\">\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\n            <div fd-popover-body-footer>\n                <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n            </div>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n<ng-template #middle>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"customButtons.length === 0\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"customButtons\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        [title]=\"isMobile ? title : ''\"\n        [access]=\"access\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [inDialog]=\"inDialog\"\n        [hasSelected]=\"hasSelected\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [moDataListCount]=\"moDataList.length\"\n        [gridFreeColumnSizing]=\"false\"\n    ></bsu-ulv-toolbar>\n    <bsu-ui-table-view\n        [gridFreeColumnSizing]=\"false\"\n        [cartableTemplates]=\"cartableTemplates\"\n        [disableResize]=\"true\"\n        [disableHeaderContextMenu]=\"true\"\n        [parentHeight]=\"parentHeight\"\n        [fullscreen]=\"fullscreen\"\n        [selectedMo]=\"selectedMo\"\n        [rtl]=\"rtl\"\n        [inDialog]=\"inDialog\"\n        [disableFixedTableLayout]=\"true\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [cartableChildsMo]=\"cartableChildsMo\"\n        [contextView]=\"contextView\"\n        [isCheckList]=\"isCheckList\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [hasInlineDeleteButton]=\"true\"\n        [hasInlineEditButton]=\"true\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [groupby]=\"groupby\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [disableResponsive]=\"disableResponsive\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnWidth]=\"100 / columns.length\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formSetting]=\"formSetting\"\n        [typeDefId]=\"typeDefId\"\n        [reportId]=\"reportId\"\n        [listEditViewId]=\"listEditViewId\"\n        [typeViewId]=\"typeViewId\"\n        [extraRelation]=\"extraRelation\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        [fitWidth]=\"false\"\n        [hasSummary]=\"hasSummary\"\n        [newInlineEditMo]=\"newInlineEditMo\"\n        (ulvCommandClick)=\"onUlvCommand($event)\"\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"onExpandClick($event)\"\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\n    >\n    </bsu-ui-table-view>\n</ng-template>\n<ng-template #footer let-dialog=\"dialog\" let-popover=\"popover\">\n    <div fd-bar [barDesign]=\"'footer'\">\n        <div fd-bar-right>\n            <fd-button-bar\n                [label]=\"getNewButton?.text ?? ''\"\n                fdType=\"emphasized\"\n                (click)=\"onAdd(popover)\"\n                bodyClick\n                glyph=\"add\"\n            ></fd-button-bar>\n            <fd-button-bar\n                fdType=\"transparent\"\n                label=\"\u0628\u0633\u062A\u0646\"\n                bodyClick\n                (click)=\"close(dialog)\"\n                ariaLabel=\"Close\"\n            ></fd-button-bar>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 id=\"fd-dialog-header-3\" fd-title>{{ title }}</h1>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\n        </fd-dialog-header>\n        <fd-dialog-body class=\"!tw-pt-0\">\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\n        </fd-dialog-body>\n        <fd-dialog-footer>\n            <ng-container *ngTemplateOutlet=\"footer; context: { dialog: dialog }\"></ng-container>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".revert-readonly-bg{background-color:var(--sapField_Background)}bsu-ui-table-view ::ng-deep table tbody bsu-barsa-table-row:last-child ::ng-deep>tr>td{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$1.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaReportOneOfListComponent, selector: "bsu-barsa-report-one-of-list", inputs: { disabled: "disabled" }, viewQueries: [{ propertyName: "_inputGroupRef", first: true, predicate: ["InputGroupRef"], descendants: true, static: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"tw-relative\" #containerRef>\n    <input\n        fd-form-control\n        [readonly]=\"true\"\n        [ngModel]=\"!hastLastRecord() ? '' : (viewSetting.DbColumnName | rval: moDataList[0]:allColumns:true)\"\n        class=\"revert-readonly-bg\"\n    />\n    <div class=\"!tw-absolute tw-left-0 tw-top-[0.1875rem] tw-flex\">\n        @if (viewSetting.OpenInIndependentForm) {\n        <button\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"popup-window\"\n            ariaLabel=\"Open in an independent form\"\n            title=\"Open in an independent form\"\n            (click)=\"openInIndependentFormClicked()\"\n        ></button>\n        }\n        <button\n            fd-button\n            fdType=\"transparent\"\n            glyph=\"list\"\n            ariaLabel=\"Show list\"\n            title=\"Show list\"\n            (click)=\"open(popover, dialogTemplate)\"\n        ></button>\n    </div>\n    <fd-popover\n        #popover\n        placement=\"bottom-end\"\n        [focusTrapped]=\"true\"\n        [focusAutoCapture]=\"true\"\n        [appendTo]=\"containerRef\"\n        class=\"!tw-block\"\n    >\n        <fd-popover-body [style.width.px]=\"containerRef.offsetWidth\">\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\n            <div fd-popover-body-footer>\n                <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n            </div>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n<ng-template #middle>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"customButtons.length === 0\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"customButtons\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        [title]=\"isMobile ? title : ''\"\n        [access]=\"access\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [inDialog]=\"inDialog\"\n        [hasSelected]=\"hasSelected\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [moDataListCount]=\"moDataList.length\"\n        [gridFreeColumnSizing]=\"false\"\n    ></bsu-ulv-toolbar>\n    <bsu-ui-table-view\n        [gridFreeColumnSizing]=\"false\"\n        [cartableTemplates]=\"cartableTemplates\"\n        [disableResize]=\"true\"\n        [disableHeaderContextMenu]=\"true\"\n        [parentHeight]=\"parentHeight\"\n        [fullscreen]=\"fullscreen\"\n        [selectedMo]=\"selectedMo\"\n        [rtl]=\"rtl\"\n        [inDialog]=\"inDialog\"\n        [disableFixedTableLayout]=\"true\"\n        [isMultiSelect]=\"isMultiSelect\"\n        [cartableChildsMo]=\"cartableChildsMo\"\n        [contextView]=\"contextView\"\n        [isCheckList]=\"isCheckList\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [hasInlineDeleteButton]=\"true\"\n        [hasInlineEditButton]=\"true\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [groupby]=\"groupby\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [disableResponsive]=\"disableResponsive\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnWidth]=\"100 / columns.length\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formSetting]=\"formSetting\"\n        [typeDefId]=\"typeDefId\"\n        [reportId]=\"reportId\"\n        [listEditViewId]=\"listEditViewId\"\n        [typeViewId]=\"typeViewId\"\n        [extraRelation]=\"extraRelation\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        [fitWidth]=\"false\"\n        [hasSummary]=\"hasSummary\"\n        [newInlineEditMo]=\"newInlineEditMo\"\n        (ulvCommandClick)=\"onUlvCommand($event)\"\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"onExpandClick($event)\"\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\n    >\n    </bsu-ui-table-view>\n</ng-template>\n<ng-template #footer let-dialog=\"dialog\" let-popover=\"popover\">\n    <div fd-bar [barDesign]=\"'footer'\">\n        <div fd-bar-right>\n            <fd-button-bar\n                [label]=\"getNewButton?.text ?? ''\"\n                fdType=\"emphasized\"\n                (click)=\"onAdd(popover)\"\n                bodyClick\n                glyph=\"add\"\n            ></fd-button-bar>\n            <fd-button-bar\n                fdType=\"transparent\"\n                label=\"\u0628\u0633\u062A\u0646\"\n                bodyClick\n                (click)=\"close(dialog)\"\n                ariaLabel=\"Close\"\n            ></fd-button-bar>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 id=\"fd-dialog-header-3\" fd-title>{{ title }}</h1>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\n        </fd-dialog-header>\n        <fd-dialog-body class=\"!tw-pt-0\">\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\n        </fd-dialog-body>\n        <fd-dialog-footer>\n            <ng-container *ngTemplateOutlet=\"footer; context: { dialog: dialog }\"></ng-container>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".revert-readonly-bg{background-color:var(--sapField_Background)}bsu-ui-table-view ::ng-deep table tbody bsu-barsa-table-row:last-child ::ng-deep>tr>td{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$1.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaReportOneOfListComponent, decorators: [{
             type: Component,
@@ -13535,7 +13544,7 @@ class BarsaCardRowPayamComponent extends BaseViewItemPropsComponent {
         this.content = this._domSanitizer.bypassSecurityTrustHtml(`<div style="color:black;font-size:12pt;font-family:Calibri,Helvetica,sans-serif;">okkkk</div>`);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCardRowPayamComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCardRowPayamComponent, selector: "bsu-barsa-card-row-payam", usesInheritance: true, ngImport: i0, template: "<fd-card cardType=\"object\" class=\"docs-flex-item-margin\">\n    <fd-card-header (click)=\"hideContent = !hideContent\" bodyClick style=\"border-bottom: none\">\n        <fd-avatar\n            image=\"http://picsum.photos/id/1018/400\"\n            [circle]=\"true\"\n            size=\"s\"\n            ariaLabel=\"avatar image\"\n            title=\"avatar image\"\n        ></fd-avatar>\n        <h2 fd-card-title>\n            <div style=\"display: flex; column-gap: 1.275rem\">\n                <span>\u0645\u062D\u0645\u062F\u0631\u0636\u0627\u0645\u062D\u0645\u062F\u06CC</span>\n                <fd-object-attribute style=\"direction: ltr\">\u062E\u0648\u0627\u0646\u062F\u0647 \u062F\u0631: 1402/12/28 14:20 </fd-object-attribute>\n                <span fd-object-status status=\"negative\" label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\" aria-label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\"></span>\n            </div>\n            <div style=\"position: absolute; left: 1.2rem; top: 50%\"><fd-icon [glyph]=\"'attachment'\"></fd-icon></div>\n        </h2>\n\n        <h3 fd-card-subtitle>\n            @if (hideContent) {\n            <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n            } @if (!hideContent) {\n            <ng-container *ngTemplateOutlet=\"toTpl\"></ng-container>\n            }\n        </h3>\n        @if (hideContent) {\n        <span fd-card-counter><div style=\"direction: ltr\">1402/12/28 14:20</div> </span>\n        } @if (!hideContent) {\n        <span\n            fd-card-counter\n            ulvContextMenu\n            [menuItems]=\"contextMenuItems\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        ></span>\n        }\n    </fd-card-header>\n    @if (!hideContent) {\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"attachmentsTpl\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n    </fd-card-content>\n    }\n</fd-card>\n\n<ng-template #contentTpl>\n    <div style=\"padding-top: 0.5rem; margin-top: 1rem; border-top: 1px solid #ccc\" [innerHtml]=\"content\"></div>\n</ng-template>\n\n<ng-template #toTpl>\n    <div>To: \u0645\u0646</div>\n    <div>Cc: \u0645\u0646</div>\n</ng-template>\n<ng-template #attachmentsTpl>\n    <div class=\"file-viewer-attachments\">\n        @for (file of mo.F5.Files; track file) { @if (!file.IsDeleted) {\n        <bsu-file-viewer-popover\n            [file]=\"file\"\n            [files]=\"mo.F5.Files\"\n            [deviceSize]=\"deviceSize\"\n            [canDownload]=\"true\"\n            [disableRemove]=\"true\"\n            [fdType]=\"'transparent'\"\n        ></bsu-file-viewer-popover>\n        } }\n    </div>\n    @if (mo.F5.Files.length > 1) {\n    <button\n        fd-button\n        [fdType]=\"'transparent'\"\n        [label]=\"'Download' | bbbTranslate: 'All'\"\n        [glyph]=\"'download'\"\n        downloadFiles\n        [files]=\"mo.F5.Files\"\n    ></button>\n    }\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%;padding-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i5$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i5$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["status"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCardRowPayamComponent, selector: "bsu-barsa-card-row-payam", usesInheritance: true, ngImport: i0, template: "<fd-card cardType=\"object\" class=\"docs-flex-item-margin\">\n    <fd-card-header (click)=\"hideContent = !hideContent\" bodyClick style=\"border-bottom: none\">\n        <fd-avatar\n            image=\"http://picsum.photos/id/1018/400\"\n            [circle]=\"true\"\n            size=\"s\"\n            ariaLabel=\"avatar image\"\n            title=\"avatar image\"\n        ></fd-avatar>\n        <h2 fd-card-title>\n            <div style=\"display: flex; column-gap: 1.275rem\">\n                <span>\u0645\u062D\u0645\u062F\u0631\u0636\u0627\u0645\u062D\u0645\u062F\u06CC</span>\n                <fd-object-attribute style=\"direction: ltr\">\u062E\u0648\u0627\u0646\u062F\u0647 \u062F\u0631: 1402/12/28 14:20 </fd-object-attribute>\n                <span fd-object-status status=\"negative\" label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\" aria-label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\"></span>\n            </div>\n            <div style=\"position: absolute; left: 1.2rem; top: 50%\"><fd-icon [glyph]=\"'attachment'\"></fd-icon></div>\n        </h2>\n\n        <h3 fd-card-subtitle>\n            @if (hideContent) {\n            <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n            } @if (!hideContent) {\n            <ng-container *ngTemplateOutlet=\"toTpl\"></ng-container>\n            }\n        </h3>\n        @if (hideContent) {\n        <span fd-card-counter><div style=\"direction: ltr\">1402/12/28 14:20</div> </span>\n        } @if (!hideContent) {\n        <span\n            fd-card-counter\n            ulvContextMenu\n            [menuItems]=\"contextMenuItems\"\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        ></span>\n        }\n    </fd-card-header>\n    @if (!hideContent) {\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"attachmentsTpl\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n    </fd-card-content>\n    }\n</fd-card>\n\n<ng-template #contentTpl>\n    <div style=\"padding-top: 0.5rem; margin-top: 1rem; border-top: 1px solid #ccc\" [innerHtml]=\"content\"></div>\n</ng-template>\n\n<ng-template #toTpl>\n    <div>To: \u0645\u0646</div>\n    <div>Cc: \u0645\u0646</div>\n</ng-template>\n<ng-template #attachmentsTpl>\n    <div class=\"file-viewer-attachments\">\n        @for (file of mo.F5.Files; track file) { @if (!file.IsDeleted) {\n        <bsu-file-viewer-popover\n            [file]=\"file\"\n            [files]=\"mo.F5.Files\"\n            [deviceSize]=\"deviceSize\"\n            [canDownload]=\"true\"\n            [disableRemove]=\"true\"\n            [fdType]=\"'transparent'\"\n        ></bsu-file-viewer-popover>\n        } }\n    </div>\n    @if (mo.F5.Files.length > 1) {\n    <button\n        fd-button\n        [fdType]=\"'transparent'\"\n        [label]=\"'Download' | bbbTranslate: 'All'\"\n        [glyph]=\"'download'\"\n        downloadFiles\n        [files]=\"mo.F5.Files\"\n    ></button>\n    }\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%;padding-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i5$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i5$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["status"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "deviceSize", "canDownload", "disableRemove", "fdType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCardRowPayamComponent, decorators: [{
             type: Component,
@@ -13719,7 +13728,7 @@ class BarsaQuestionAnswerVoteSectionComponent extends BaseComponent {
         // }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaQuestionAnswerVoteSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaQuestionAnswerVoteSectionComponent, selector: "bsu-barsa-question-answer-vote-section", inputs: { vote: "vote", voteDowns: "voteDowns", voteUps: "voteUps" }, outputs: { voteChange: "voteChange" }, providers: [UploadService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"tw-flex tw-items-stretch tw-grow tw-shrink-0\">\n    <div class=\"tw-flex tw-flex-col tw-tems-center tw-gap-1 tw-shrink-0 tw-grow-0\">\n        <button\n            fd-button\n            [fdType]=\"vote === '' ? 'standard' : vote ? 'positive' : 'standard'\"\n            glyph=\"add\"\n            class=\"!tw-max-w-8 !tw-max-h-8 !tw-size-8 !tw-rounded-full !tw-border-2\"\n            (click)=\"onVote(true)\"\n        ></button>\n        <span class=\"tw-text-lg tw-font-bold\" dir=\"ltr\">{{ voteUps - voteDowns }}</span>\n        <button\n            fd-button\n            [fdType]=\"vote === '' ? 'standard' : !vote ? 'negative' : 'standard'\"\n            glyph=\"less\"\n            class=\"!tw-max-w-8 !tw-max-h-8 !tw-size-8 !tw-rounded-full !tw-border-2\"\n            (click)=\"onVote(false)\"\n        ></button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaQuestionAnswerVoteSectionComponent, selector: "bsu-barsa-question-answer-vote-section", inputs: { vote: "vote", voteDowns: "voteDowns", voteUps: "voteUps" }, outputs: { voteChange: "voteChange" }, providers: [UploadService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"tw-flex tw-items-stretch tw-grow tw-shrink-0\">\n    <div class=\"tw-flex tw-flex-col tw-tems-center tw-gap-1 tw-shrink-0 tw-grow-0\">\n        <button\n            fd-button\n            [fdType]=\"vote === '' ? 'standard' : vote ? 'positive' : 'standard'\"\n            glyph=\"add\"\n            class=\"!tw-max-w-8 !tw-max-h-8 !tw-size-8 !tw-rounded-full !tw-border-2\"\n            (click)=\"onVote(true)\"\n        ></button>\n        <span class=\"tw-text-lg tw-font-bold\" dir=\"ltr\">{{ voteUps - voteDowns }}</span>\n        <button\n            fd-button\n            [fdType]=\"vote === '' ? 'standard' : !vote ? 'negative' : 'standard'\"\n            glyph=\"less\"\n            class=\"!tw-max-w-8 !tw-max-h-8 !tw-size-8 !tw-rounded-full !tw-border-2\"\n            (click)=\"onVote(false)\"\n        ></button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i7$4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaQuestionAnswerVoteSectionComponent, decorators: [{
             type: Component,
@@ -13772,7 +13781,7 @@ class BarsaQuestionAnswerFormAddCommentComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaQuestionAnswerFormAddCommentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaQuestionAnswerFormAddCommentComponent, selector: "bsu-barsa-question-answer-form-add-comment", inputs: { postId: "postId" }, outputs: { addComment: "addComment" }, host: { classAttribute: "w-full" }, ngImport: i0, template: "@if (!showAddCommentTextArea) {\n<div class=\"tw-w-full tw-mt-2 tw-flex tw-gap-3\">\n    <a\n        fd-link\n        aria-label=\"Emphasized\"\n        class=\"hover:tw-cursor-pointer\"\n        (click)=\"showAddCommentTextArea = true; newCommentText = ''\"\n        >\u0627\u0631\u0633\u0627\u0644 \u0646\u0638\u0631</a\n    >\n    <ng-content></ng-content>\n</div>\n}\n<div [class.!flex]=\"showAddCommentTextArea\" class=\"tw-hidden tw-items-end tw-w-full tw-gap-4\">\n    <textarea\n        rows=\"3\"\n        class=\"tw-block tw-p-2.5 tw-w-full tw-text-sm tw-text-gray-900 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-300\"\n        placeholder=\"\u0646\u0638\u0631 \u0634\u0645\u0627...\"\n        [disabled]=\"sending\"\n        [(ngModel)]=\"newCommentText\"\n    ></textarea>\n    <div class=\"tw-flex tw-justify-end\">\n        <button fd-button fdType=\"standard\" [disabled]=\"sending || newCommentText.length < 3\" (click)=\"onAddComment()\">\n            \u0627\u0631\u0633\u0627\u0644\n        </button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaQuestionAnswerFormAddCommentComponent, selector: "bsu-barsa-question-answer-form-add-comment", inputs: { postId: "postId" }, outputs: { addComment: "addComment" }, host: { classAttribute: "w-full" }, ngImport: i0, template: "@if (!showAddCommentTextArea) {\n<div class=\"tw-w-full tw-mt-2 tw-flex tw-gap-3\">\n    <a\n        fd-link\n        aria-label=\"Emphasized\"\n        class=\"hover:tw-cursor-pointer\"\n        (click)=\"showAddCommentTextArea = true; newCommentText = ''\"\n        >\u0627\u0631\u0633\u0627\u0644 \u0646\u0638\u0631</a\n    >\n    <ng-content></ng-content>\n</div>\n}\n<div [class.!flex]=\"showAddCommentTextArea\" class=\"tw-hidden tw-items-end tw-w-full tw-gap-4\">\n    <textarea\n        rows=\"3\"\n        class=\"tw-block tw-p-2.5 tw-w-full tw-text-sm tw-text-gray-900 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-300\"\n        placeholder=\"\u0646\u0638\u0631 \u0634\u0645\u0627...\"\n        [disabled]=\"sending\"\n        [(ngModel)]=\"newCommentText\"\n    ></textarea>\n    <div class=\"tw-flex tw-justify-end\">\n        <button fd-button fdType=\"standard\" [disabled]=\"sending || newCommentText.length < 3\" (click)=\"onAddComment()\">\n            \u0627\u0631\u0633\u0627\u0644\n        </button>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaQuestionAnswerFormAddCommentComponent, decorators: [{
             type: Component,
@@ -13998,7 +14007,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
 
 class BarsaCustomInlineEditComponent extends ReportViewBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCustomInlineEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCustomInlineEditComponent, selector: "bsu-barsa-custom-inline-edit", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "@for (mo of moDataList; track _trackByRow(index, mo); let index = $index; let odd = $odd) {\n<div style=\"display: flex; align-items: center\" [style.background-color]=\"odd ? null : 'var(--sapBaseColor)'\">\n    <bsu-barsa-custom-inline-edit-row\n        [mo]=\"mo\"\n        [moDataList]=\"moDataList\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        [hideOpenIcon]=\"hideOpenIcon\"\n        [showRowNumber]=\"contextView?.Grid_ShowRowNumber\"\n        [isChecked]=\"true\"\n        [visibility]=\"mo.$Visibility\"\n        [expanded]=\"mo.$Expanded\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [level]=\"mo.$Level\"\n        [parentExpanded]=\"mo.$Parent?.$Expanded\"\n        [moDataListCount]=\"moDataList.length\"\n        [columnsCount]=\"columnsCount.length\"\n        [typeDefId]=\"typeDefId\"\n        [extraRelation]=\"extraRelation\"\n        [formSetting]=\"formSetting\"\n        [index]=\"index\"\n        [setting]=\"viewSetting\"\n        [columns]=\"columns\"\n        [isNewInlineMo]=\"mo.$NewInlineMo\"\n        [access]=\"access\"\n        [inlineEditMode]=\"true\"\n        [allowInlineEdit]=\"true\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [allColumns]=\"allColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [canView]=\"canView\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [navigationArrow]=\"navigationArrow\"\n        [isCheckList]=\"isCheckList\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (deselectAll)=\"onDeselectAll()\"\n        (rowClick)=\"onRowClick($event)\"\n        (ulvCommand)=\"onUlvCommand($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\n    >\n    </bsu-barsa-custom-inline-edit-row>\n    <button\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"delete\"\n        (click)=\"rowCheck.emit({mo, index}); contextMenuItems[0].handler(contextMenuItems[0])\"\n    ></button>\n</div>\n}\n<div style=\"margin-top: 0.5rem\">\n    <button fd-button (click)=\"createNewMo.emit()\">\u0627\u0641\u0632\u0648\u062F\u0646</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;padding-bottom:.275rem}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: BarsaCustomInlineEditRowComponent, selector: "bsu-barsa-custom-inline-edit-row" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaCustomInlineEditComponent, selector: "bsu-barsa-custom-inline-edit", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "@for (mo of moDataList; track _trackByRow(index, mo); let index = $index; let odd = $odd) {\n<div style=\"display: flex; align-items: center\" [style.background-color]=\"odd ? null : 'var(--sapBaseColor)'\">\n    <bsu-barsa-custom-inline-edit-row\n        [mo]=\"mo\"\n        [moDataList]=\"moDataList\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        [hideOpenIcon]=\"hideOpenIcon\"\n        [showRowNumber]=\"contextView?.Grid_ShowRowNumber\"\n        [isChecked]=\"true\"\n        [visibility]=\"mo.$Visibility\"\n        [expanded]=\"mo.$Expanded\"\n        [styleIndex]=\"mo.$StyleIndex\"\n        [level]=\"mo.$Level\"\n        [parentExpanded]=\"mo.$Parent?.$Expanded\"\n        [moDataListCount]=\"moDataList.length\"\n        [columnsCount]=\"columnsCount.length\"\n        [typeDefId]=\"typeDefId\"\n        [extraRelation]=\"extraRelation\"\n        [formSetting]=\"formSetting\"\n        [index]=\"index\"\n        [setting]=\"viewSetting\"\n        [columns]=\"columns\"\n        [isNewInlineMo]=\"mo.$NewInlineMo\"\n        [access]=\"access\"\n        [inlineEditMode]=\"true\"\n        [allowInlineEdit]=\"true\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [allColumns]=\"allColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [canView]=\"canView\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n        [navigationArrow]=\"navigationArrow\"\n        [isCheckList]=\"isCheckList\"\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (deselectAll)=\"onDeselectAll()\"\n        (rowClick)=\"onRowClick($event)\"\n        (ulvCommand)=\"onUlvCommand($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\n    >\n    </bsu-barsa-custom-inline-edit-row>\n    <button\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"delete\"\n        (click)=\"rowCheck.emit({mo, index}); contextMenuItems[0].handler(contextMenuItems[0])\"\n    ></button>\n</div>\n}\n<div style=\"margin-top: 0.5rem\">\n    <button fd-button (click)=\"createNewMo.emit()\">\u0627\u0641\u0632\u0648\u062F\u0646</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;padding-bottom:.275rem}\n"], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: BarsaCustomInlineEditRowComponent, selector: "bsu-barsa-custom-inline-edit-row" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaCustomInlineEditComponent, decorators: [{
             type: Component,
@@ -14018,7 +14027,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
 
 class BarsaChatThreadComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatThreadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatThreadComponent, selector: "bsu-barsa-chat-thread", inputs: { thread: "thread" }, host: { classAttribute: "tw-w-full tw-h-[4.5rem] tw-flex tw-gap-2 tw-border-b tw-border-b-gray-200 dark:tw-border-b-gray-600 tw-p-2 tw-cursor-pointer tw-bg-default hover:tw-bg-zinc-100 hover:dark:tw-bg-black tw-transition-all" }, ngImport: i0, template: "<div class=\"tw-relative tw-grow-0 tw-shrink-0 tw-size-14\">\r\n    <img class=\"tw-w-full tw-h-full tw-rounded-full\" [src]=\"thread.avatar\" />\r\n    @if (thread.status === 2) {\r\n    <div\r\n        class=\"tw-absolute tw-bottom-0 tw-left-0 tw-border-2 tw-border-default tw-size-4 tw-rounded-full\"\r\n        [ngClass]=\"{\r\n    'tw-bg-gray-300': thread.status === 0,\r\n    'tw-bg-gray-700': thread.status === 1,\r\n    'tw-bg-green-600': thread.status === 2,\r\n    'tw-bg-red-600': thread.status === 3,\r\n    }\"\r\n    ></div>\r\n    }\r\n</div>\r\n<div class=\"tw-grow tw-shrink tw-flex tw-flex-col tw-gap-0.5\">\r\n    <span class=\"tw-font-bold tw-text-base tw-text-sm\">{{ thread.title }}</span>\r\n    <span class=\"tw-text-gray-500 dark:tw-text-gray-300 tw-line-clamp-2 tw-text-xs\">{{ thread.lastMessage.text }}</span>\r\n</div>\r\n<div class=\"tw-grow-0 tw-shrink-0 tw-flex tw-flex-col tw-justify-between tw-items-center\">\r\n    @if (thread.unreadCount) {\r\n    <div\r\n        class=\"tw-text-white tw-rounded-full tw-text-sm tw-px-1.5\"\r\n        [ngClass]=\"{\r\n            'tw-bg-blue-500': !thread.muted,\r\n            'tw-bg-zinc-500': thread.muted\r\n        }\"\r\n    >\r\n        {{ thread.unreadCount }}\r\n    </div>\r\n    } @else {\r\n    <div></div>\r\n    }\r\n    <div>\r\n        <fd-popover placement=\"bottom-end\" title=\"bottom-end\" (click)=\"$event.stopPropagation()\">\r\n            <fd-popover-control>\r\n                <button fd-button fdType=\"transparent\" [fdCompact]=\"true\" glyph=\"navigation-down-arrow\"></button>\r\n            </fd-popover-control>\r\n            <fd-popover-body minWidth=\"10rem\">\r\n                <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"bell-2\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u0628\u06CC\u200C\u0635\u062F\u0627 \u06A9\u0631\u062F\u0646</span>\r\n                    </label>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"pushpin-on\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u0633\u0646\u062C\u0627\u0642 \u06A9\u0631\u062F\u0646</span>\r\n                    </label>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\r\n                    </label>\r\n                </div>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n    </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatThreadComponent, selector: "bsu-barsa-chat-thread", inputs: { thread: "thread" }, host: { classAttribute: "tw-w-full tw-h-[4.5rem] tw-flex tw-gap-2 tw-border-b tw-border-b-gray-200 dark:tw-border-b-gray-600 tw-p-2 tw-cursor-pointer tw-bg-default hover:tw-bg-zinc-100 hover:dark:tw-bg-black tw-transition-all" }, ngImport: i0, template: "<div class=\"tw-relative tw-grow-0 tw-shrink-0 tw-size-14\">\r\n    <img class=\"tw-w-full tw-h-full tw-rounded-full\" [src]=\"thread.avatar\" />\r\n    @if (thread.status === 2) {\r\n    <div\r\n        class=\"tw-absolute tw-bottom-0 tw-left-0 tw-border-2 tw-border-default tw-size-4 tw-rounded-full\"\r\n        [ngClass]=\"{\r\n    'tw-bg-gray-300': thread.status === 0,\r\n    'tw-bg-gray-700': thread.status === 1,\r\n    'tw-bg-green-600': thread.status === 2,\r\n    'tw-bg-red-600': thread.status === 3,\r\n    }\"\r\n    ></div>\r\n    }\r\n</div>\r\n<div class=\"tw-grow tw-shrink tw-flex tw-flex-col tw-gap-0.5\">\r\n    <span class=\"tw-font-bold tw-text-base tw-text-sm\">{{ thread.title }}</span>\r\n    <span class=\"tw-text-gray-500 dark:tw-text-gray-300 tw-line-clamp-2 tw-text-xs\">{{ thread.lastMessage.text }}</span>\r\n</div>\r\n<div class=\"tw-grow-0 tw-shrink-0 tw-flex tw-flex-col tw-justify-between tw-items-center\">\r\n    @if (thread.unreadCount) {\r\n    <div\r\n        class=\"tw-text-white tw-rounded-full tw-text-sm tw-px-1.5\"\r\n        [ngClass]=\"{\r\n            'tw-bg-blue-500': !thread.muted,\r\n            'tw-bg-zinc-500': thread.muted\r\n        }\"\r\n    >\r\n        {{ thread.unreadCount }}\r\n    </div>\r\n    } @else {\r\n    <div></div>\r\n    }\r\n    <div>\r\n        <fd-popover placement=\"bottom-end\" title=\"bottom-end\" (click)=\"$event.stopPropagation()\">\r\n            <fd-popover-control>\r\n                <button fd-button fdType=\"transparent\" [fdCompact]=\"true\" glyph=\"navigation-down-arrow\"></button>\r\n            </fd-popover-control>\r\n            <fd-popover-body minWidth=\"10rem\">\r\n                <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"bell-2\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u0628\u06CC\u200C\u0635\u062F\u0627 \u06A9\u0631\u062F\u0646</span>\r\n                    </label>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"pushpin-on\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u0633\u0646\u062C\u0627\u0642 \u06A9\u0631\u062F\u0646</span>\r\n                    </label>\r\n                    <label\r\n                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    >\r\n                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\r\n                        <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\r\n                    </label>\r\n                </div>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n    </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatThreadComponent, decorators: [{
             type: Component,
@@ -14043,7 +14052,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
 
 class BarsaChatThreadsListToolbarComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatThreadsListToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaChatThreadsListToolbarComponent, selector: "bsu-barsa-chat-threads-list-toolbar", host: { classAttribute: "tw-relative tw-shrink-0 tw-grow-0 tw-w-full tw-h-16 tw-flex tw-justify-between tw-items-center tw-px-4 tw-bg-zinc-200/[.7] dark:tw-bg-zinc-700/[.7]" }, ngImport: i0, template: "<div>\r\n    <img src=\"https://picsum.photos/100?workAround=1234\" class=\"tw-size-12 tw-rounded-full\" />\r\n</div>\r\n<div class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-text-base\">\r\n    \u062F\u0631 \u062D\u0627\u0644 \u0627\u062A\u0635\u0627\u0644...\r\n</div>\r\n<div>\r\n    <button fd-button fdType=\"transparent\" glyph=\"edit\"></button>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.5", type: BarsaChatThreadsListToolbarComponent, selector: "bsu-barsa-chat-threads-list-toolbar", host: { classAttribute: "tw-relative tw-shrink-0 tw-grow-0 tw-w-full tw-h-16 tw-flex tw-justify-between tw-items-center tw-px-4 tw-bg-zinc-200/[.7] dark:tw-bg-zinc-700/[.7]" }, ngImport: i0, template: "<div>\r\n    <img src=\"https://picsum.photos/100?workAround=1234\" class=\"tw-size-12 tw-rounded-full\" />\r\n</div>\r\n<div class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-text-base\">\r\n    \u062F\u0631 \u062D\u0627\u0644 \u0627\u062A\u0635\u0627\u0644...\r\n</div>\r\n<div>\r\n    <button fd-button fdType=\"transparent\" glyph=\"edit\"></button>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatThreadsListToolbarComponent, decorators: [{
             type: Component,
@@ -14245,7 +14254,7 @@ class BarsaChatComponent extends FormBaseComponent {
         return array;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatComponent, selector: "bsu-barsa-chat", inputs: { simple: "simple" }, providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-from-[#5d6e7f] tw-to-[#354a5f] dark:tw-from-[#253443] dark:tw-to-[#10161c]\"\n    fillEmptySpace\n    [class.tw-h-screen]=\"!simple\"\n    [class.tw-justify-center]=\"simple\"\n>\n    @if (!simple) {\n    <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\n    }\n    <div\n        class=\"tw-h-full tw-flex 2xl:tw-container max-w-[80rem] tw-shrink-0 tw-relative\"\n        [ngClass]=\"{\n            'tw-grow 2xl:tw-grow-0': !simple,\n            'tw-w-full': simple\n        }\"\n    >\n        @if (!simple) {\n        <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0 md:tw-p-6\">\n            <div\n                class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden tw-border-l tw-border-l-gray-300 md:tw-rounded-2xl md:tw-border md:tw-border-l-gray-300 md:tw-border-gray-300 dark:tw-border-l-gray-600 md:dark:tw-border-l-gray-600 md:dark:tw-border-gray-600\"\n            >\n                <bsu-barsa-chat-threads-list-toolbar></bsu-barsa-chat-threads-list-toolbar>\n                <bsu-barsa-chat-threads-list>\n                    @for (thread of threads; track thread.id) {\n                    <bsu-barsa-chat-thread [thread]=\"thread\" (click)=\"selectThread(thread)\"></bsu-barsa-chat-thread>\n                    }\n                </bsu-barsa-chat-threads-list>\n            </div>\n        </div>\n        } @else {\n        <div\n            class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\n        ></div>\n        }\n        <div\n            class=\"tw-grow tw-shrink tw-relative\"\n            [ngClass]=\"{\n                'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': !simple,\n                'tw-flex': simple\n            }\"\n        >\n            @if (selectedThread()) {\n            <div\n                @inContentAnimation\n                class=\"tw-h-full tw-w-full tw-flex tw-flex-col tw-relative md:tw-border-gray-300 md:dark:tw-border-gray-600 tw-overflow-hidden\"\n                [ngClass]=\"{\n                    'md:tw-border md:tw-rounded-2xl': !simple\n                }\"\n            >\n                <bsu-barsa-chat-content-toolbar\n                    [title]=\"selectedThread().title\"\n                    [subtitle]=\"'\u0645\u062D\u0645\u062F \u0645\u062D\u0645\u062F\u06CC'\"\n                    [avatar]=\"selectedThread().avatar\"\n                    [status]=\"selectedThread().status\"\n                ></bsu-barsa-chat-content-toolbar>\n                <bsu-barsa-chat-content id=\"chat-container\">\n                    @if(layout94$ | async;as layout94){ @if ('\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94; as configUi) {\n                    <bsu-layout-control [config]=\"configUi\"></bsu-layout-control>\n                    } }\n                </bsu-barsa-chat-content>\n                <div\n                    class=\"tw-w-full\"\n                    [ngClass]=\"{\n                        'tw-relative': !simple,\n                        '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': simple\n                    }\"\n                >\n                    @if (replyingMessage()) {\n                    <div\n                        @inOutReplyingMessage\n                        class=\"tw-w-full tw-px-2 tw-py-1 tw-border-r-4 tw-border-r-bubble-mine tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\n                    >\n                        <button\n                            fd-button\n                            fdType=\"transparent\"\n                            glyph=\"decline\"\n                            class=\"tw-grow-0 tw-shrink-0\"\n                            (click)=\"replyingMessage.set(null)\"\n                        ></button>\n                        <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\n                            <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\n                            <span class=\"tw-truncate\">{{\n                                replyingMessage().text ?? replyingMessage().file?.name ?? replyingMessage().image?.name\n                            }}</span>\n                        </div>\n                        <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\n                    </div>\n                    }\n                    <div\n                        class=\"tw-w-full tw-p-2 tw-flex tw-gap-2 tw-border-t tw-border-t-gray-300 dark:tw-border-t-gray-600 tw-bg-default tw-items-end tw-z-10\"\n                    >\n                        <fd-popover placement=\"top-start\" title=\"top-start\">\n                            <fd-popover-control>\n                                <button\n                                    fd-button\n                                    fdType=\"transparent\"\n                                    glyph=\"attachment\"\n                                    class=\"!tw-rounded-full tw-shrink-0 tw-grow-0 !tw-size-10 !tw-min-h-10 !tw-max-h-10 !tw-min-w-10 !tw-max-w-10\"\n                                    (click)=\"addAttachment()\"\n                                ></button>\n                            </fd-popover-control>\n                            <fd-popover-body minWidth=\"10rem\">\n                                <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\n                                    <label\n                                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                    >\n                                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"camera\"></fd-icon>\n                                        <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u0639\u06A9\u0633</span>\n                                        <input class=\"tw-hidden\" type=\"file\" id=\"img\" name=\"img\" accept=\"image/*\" />\n                                    </label>\n                                    <label\n                                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                    >\n                                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"add-document\"></fd-icon>\n                                        <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u0641\u0627\u06CC\u0644</span>\n                                        <input class=\"tw-hidden\" type=\"file\" id=\"file\" name=\"file\" accept=\"file/*\" />\n                                    </label>\n                                </div>\n                            </fd-popover-body>\n                        </fd-popover>\n                        <div class=\"tw-inline-flex tw-relative tw-grow tw-shrink\">\n                            <fd-feed-input [attr.aria-label]=\"'\u0645\u062A\u0646 \u067E\u06CC\u0627\u0645'\" class=\"tw-flex-1\">\n                                <fd-avatar\n                                    fdFeedInputAvatar\n                                    size=\"s\"\n                                    [label]=\"'\u0631\u0627\u0647\u0628\u0631'\"\n                                    [image]=\"''\"\n                                    [placeholder]=\"true\"\n                                ></fd-avatar>\n                                <textarea\n                                    id=\"chat-textarea\"\n                                    fd-form-control\n                                    fdFeedInputTextarea\n                                    placeholder=\"\u0645\u062A\u0646 \u067E\u06CC\u0627\u0645\"\n                                    [fdFeedInputTextareaMaxRows]=\"2\"\n                                    (input)=\"onTextChange($event)\"\n                                ></textarea>\n                                <button\n                                    fdFeedInputButton\n                                    [attr.aria-label]=\"'Send' | bbbTranslate\"\n                                    [title]=\"'Send' | bbbTranslate\"\n                                    (click)=\"sendMessage()\"\n                                ></button>\n                            </fd-feed-input>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            } @else {\n            <div\n                class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\n            >\n                <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" />\n                <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\n                <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\n                <!--            </span>-->\n            </div>\n            }\n        </div>\n    </div>\n    @if (!simple) {\n    <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\n    }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$7.FeedInputComponent, selector: "fd-feed-input", inputs: ["disabled"] }, { kind: "directive", type: i5$7.FeedInputTextareaDirective, selector: "[fdFeedInputTextarea]", inputs: ["fdFeedInputTextareaMaxRows"], outputs: ["valueChange"] }, { kind: "directive", type: i5$7.FeedInputButtonDirective, selector: "[fdFeedInputButton]" }, { kind: "directive", type: i5$7.FeedInputAvatarDirective, selector: "[fdFeedInputAvatar]", inputs: ["class", "placeholder"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: BarsaChatContentComponent, selector: "bsu-barsa-chat-content" }, { kind: "component", type: BarsaChatThreadComponent, selector: "bsu-barsa-chat-thread", inputs: ["thread"] }, { kind: "component", type: BarsaChatThreadsListComponent, selector: "bsu-barsa-chat-threads-list" }, { kind: "component", type: BarsaChatThreadsListToolbarComponent, selector: "bsu-barsa-chat-threads-list-toolbar" }, { kind: "component", type: BarsaChatContentToolbarComponent, selector: "bsu-barsa-chat-content-toolbar", inputs: ["avatar", "title", "subtitle", "status"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatComponent, selector: "bsu-barsa-chat", inputs: { simple: "simple" }, providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-from-[#5d6e7f] tw-to-[#354a5f] dark:tw-from-[#253443] dark:tw-to-[#10161c]\"\n    fillEmptySpace\n    [class.tw-h-screen]=\"!simple\"\n    [class.tw-justify-center]=\"simple\"\n>\n    @if (!simple) {\n    <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\n    }\n    <div\n        class=\"tw-h-full tw-flex 2xl:tw-container max-w-[80rem] tw-shrink-0 tw-relative\"\n        [ngClass]=\"{\n            'tw-grow 2xl:tw-grow-0': !simple,\n            'tw-w-full': simple\n        }\"\n    >\n        @if (!simple) {\n        <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0 md:tw-p-6\">\n            <div\n                class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden tw-border-l tw-border-l-gray-300 md:tw-rounded-2xl md:tw-border md:tw-border-l-gray-300 md:tw-border-gray-300 dark:tw-border-l-gray-600 md:dark:tw-border-l-gray-600 md:dark:tw-border-gray-600\"\n            >\n                <bsu-barsa-chat-threads-list-toolbar></bsu-barsa-chat-threads-list-toolbar>\n                <bsu-barsa-chat-threads-list>\n                    @for (thread of threads; track thread.id) {\n                    <bsu-barsa-chat-thread [thread]=\"thread\" (click)=\"selectThread(thread)\"></bsu-barsa-chat-thread>\n                    }\n                </bsu-barsa-chat-threads-list>\n            </div>\n        </div>\n        } @else {\n        <div\n            class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\n        ></div>\n        }\n        <div\n            class=\"tw-grow tw-shrink tw-relative\"\n            [ngClass]=\"{\n                'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': !simple,\n                'tw-flex': simple\n            }\"\n        >\n            @if (selectedThread()) {\n            <div\n                @inContentAnimation\n                class=\"tw-h-full tw-w-full tw-flex tw-flex-col tw-relative md:tw-border-gray-300 md:dark:tw-border-gray-600 tw-overflow-hidden\"\n                [ngClass]=\"{\n                    'md:tw-border md:tw-rounded-2xl': !simple\n                }\"\n            >\n                <bsu-barsa-chat-content-toolbar\n                    [title]=\"selectedThread().title\"\n                    [subtitle]=\"'\u0645\u062D\u0645\u062F \u0645\u062D\u0645\u062F\u06CC'\"\n                    [avatar]=\"selectedThread().avatar\"\n                    [status]=\"selectedThread().status\"\n                ></bsu-barsa-chat-content-toolbar>\n                <bsu-barsa-chat-content id=\"chat-container\">\n                    @if(layout94$ | async;as layout94){ @if ('\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94; as configUi) {\n                    <bsu-layout-control [config]=\"configUi\"></bsu-layout-control>\n                    } }\n                </bsu-barsa-chat-content>\n                <div\n                    class=\"tw-w-full\"\n                    [ngClass]=\"{\n                        'tw-relative': !simple,\n                        '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': simple\n                    }\"\n                >\n                    @if (replyingMessage()) {\n                    <div\n                        @inOutReplyingMessage\n                        class=\"tw-w-full tw-px-2 tw-py-1 tw-border-r-4 tw-border-r-bubble-mine tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\n                    >\n                        <button\n                            fd-button\n                            fdType=\"transparent\"\n                            glyph=\"decline\"\n                            class=\"tw-grow-0 tw-shrink-0\"\n                            (click)=\"replyingMessage.set(null)\"\n                        ></button>\n                        <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\n                            <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\n                            <span class=\"tw-truncate\">{{\n                                replyingMessage().text ?? replyingMessage().file?.name ?? replyingMessage().image?.name\n                            }}</span>\n                        </div>\n                        <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\n                    </div>\n                    }\n                    <div\n                        class=\"tw-w-full tw-p-2 tw-flex tw-gap-2 tw-border-t tw-border-t-gray-300 dark:tw-border-t-gray-600 tw-bg-default tw-items-end tw-z-10\"\n                    >\n                        <fd-popover placement=\"top-start\" title=\"top-start\">\n                            <fd-popover-control>\n                                <button\n                                    fd-button\n                                    fdType=\"transparent\"\n                                    glyph=\"attachment\"\n                                    class=\"!tw-rounded-full tw-shrink-0 tw-grow-0 !tw-size-10 !tw-min-h-10 !tw-max-h-10 !tw-min-w-10 !tw-max-w-10\"\n                                    (click)=\"addAttachment()\"\n                                ></button>\n                            </fd-popover-control>\n                            <fd-popover-body minWidth=\"10rem\">\n                                <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\n                                    <label\n                                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                    >\n                                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"camera\"></fd-icon>\n                                        <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u0639\u06A9\u0633</span>\n                                        <input class=\"tw-hidden\" type=\"file\" id=\"img\" name=\"img\" accept=\"image/*\" />\n                                    </label>\n                                    <label\n                                        class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                    >\n                                        <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"add-document\"></fd-icon>\n                                        <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u0641\u0627\u06CC\u0644</span>\n                                        <input class=\"tw-hidden\" type=\"file\" id=\"file\" name=\"file\" accept=\"file/*\" />\n                                    </label>\n                                </div>\n                            </fd-popover-body>\n                        </fd-popover>\n                        <div class=\"tw-inline-flex tw-relative tw-grow tw-shrink\">\n                            <fd-feed-input [attr.aria-label]=\"'\u0645\u062A\u0646 \u067E\u06CC\u0627\u0645'\" class=\"tw-flex-1\">\n                                <fd-avatar\n                                    fdFeedInputAvatar\n                                    size=\"s\"\n                                    [label]=\"'\u0631\u0627\u0647\u0628\u0631'\"\n                                    [image]=\"''\"\n                                    [placeholder]=\"true\"\n                                ></fd-avatar>\n                                <textarea\n                                    id=\"chat-textarea\"\n                                    fd-form-control\n                                    fdFeedInputTextarea\n                                    placeholder=\"\u0645\u062A\u0646 \u067E\u06CC\u0627\u0645\"\n                                    [fdFeedInputTextareaMaxRows]=\"2\"\n                                    (input)=\"onTextChange($event)\"\n                                ></textarea>\n                                <button\n                                    fdFeedInputButton\n                                    [attr.aria-label]=\"'Send' | bbbTranslate\"\n                                    [title]=\"'Send' | bbbTranslate\"\n                                    (click)=\"sendMessage()\"\n                                ></button>\n                            </fd-feed-input>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            } @else {\n            <div\n                class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\n            >\n                <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" />\n                <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\n                <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\n                <!--            </span>-->\n            </div>\n            }\n        </div>\n    </div>\n    @if (!simple) {\n    <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\n    }\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$7.FeedInputComponent, selector: "fd-feed-input", inputs: ["disabled"] }, { kind: "directive", type: i5$7.FeedInputTextareaDirective, selector: "[fdFeedInputTextarea]", inputs: ["fdFeedInputTextareaMaxRows"], outputs: ["valueChange"] }, { kind: "directive", type: i5$7.FeedInputButtonDirective, selector: "[fdFeedInputButton]" }, { kind: "directive", type: i5$7.FeedInputAvatarDirective, selector: "[fdFeedInputAvatar]", inputs: ["class", "placeholder"] }, { kind: "component", type: i1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: BarsaChatContentComponent, selector: "bsu-barsa-chat-content" }, { kind: "component", type: BarsaChatThreadComponent, selector: "bsu-barsa-chat-thread", inputs: ["thread"] }, { kind: "component", type: BarsaChatThreadsListComponent, selector: "bsu-barsa-chat-threads-list" }, { kind: "component", type: BarsaChatThreadsListToolbarComponent, selector: "bsu-barsa-chat-threads-list-toolbar" }, { kind: "component", type: BarsaChatContentToolbarComponent, selector: "bsu-barsa-chat-content-toolbar", inputs: ["avatar", "title", "subtitle", "status"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], animations: [
             trigger('inContentAnimation', [
                 transition(':enter', [
                     style({ opacity: 0, transform: 'scale(50%, 50%)' }),
@@ -14339,7 +14348,7 @@ class BarsaChatMessageComponent {
         return { ...image, displayWidth, displayHeight };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaChatMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatMessageComponent, selector: "bsu-barsa-chat-message", inputs: { message: "message", showSender: "showSender", nextIsSame: "nextIsSame", pervIsSame: "pervIsSame", badge: "badge", nextHasBadge: "nextHasBadge", badgeLabel: "badgeLabel" }, outputs: { reply: "reply" }, ngImport: i0, template: "<div\n    class=\"tw-w-full tw-px-4 tw-flex tw-flex-wrap\"\n    [ngClass]=\"{\n'tw-pt-1': pervIsSame,\n'tw-pt-3': !pervIsSame,\n}\"\n>\n    @if (badge) {\n    <div class=\"tw-w-full tw-pb-6 tw-pt-5\">\n        <div class=\"tw-w-fit tw-bg-zinc-500 tw-text-white tw-px-4 tw-mx-auto tw-rounded-full tw-text-md\">\n            {{ badgeLabel }}\n        </div>\n    </div>\n    }\n    <div\n        class=\"tw-w-full tw-flex tw-gap-2 tw-items-end tw-relative\"\n        [ngClass]=\"{\n'tw-justify-start': message.owner.id === userId,\n'tw-flex-row-reverse': message.owner.id !== userId,\n'tw-ms-14': (nextIsSame && !nextHasBadge) && message.owner.id === userId,\n'tw-me-14': (nextIsSame && !nextHasBadge) && message.owner.id !== userId,\n    }\"\n    >\n        @if (!nextIsSame || nextHasBadge) {\n        <fd-avatar\n            size=\"s\"\n            [label]=\"message.owner.avatar ? '' : message.owner?.name\"\n            [circle]=\"true\"\n            [image]=\"message.owner?.avatar\"\n            [placeholder]=\"message.owner.avatar ? false : true\"\n        ></fd-avatar>\n        } @if (!nextIsSame || nextHasBadge) {\n        <div\n            class=\"tw-bg-transparent tw-overflow-hidden tw-size-3 tw-absolute tw-bottom-0 tw-border-[6px] tw-border-t-transparent\"\n            [ngClass]=\"{\n                'tw-right-11 tw-border-b-bubble-mine tw-border-l-bubble-mine tw-border-r-transparent':\n                    message.owner.id === userId,\n                'tw-left-11 tw-border-b-default tw-border-r-default tw-border-l-transparent':\n                    message.owner.id !== userId\n            }\"\n        ></div>\n        }\n        <div\n            @inPaneAnimation\n            class=\"tw-max-w-[80%] tw-min-w-40 tw-rounded-2xl tw-text-base tw-relative tw-overflow-hidden\"\n            [ngClass]=\"{\n                '!tw-rounded-br-none':\n                    message.owner.id === userId && (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\n                '!tw-rounded-bl-none':\n                    message.owner.id !== userId && (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\n                '!tw-rounded-tr-none': message.owner.id === userId && pervIsSame && !badge,\n                '!tw-rounded-tl-none': message.owner.id !== userId && pervIsSame && !badge\n            }\"\n        >\n            @if (showSender && (!pervIsSame || badge)) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId && !message.image,\n'tw-bg-default': message.owner.id !== userId && !message.image,\n'tw-absolute tw-top-0 tw-right-0 tw-pb-8 tw-w-full tw-rounded-tr-2xl tw-bg-gradient-to-b tw-to-transparent': message.image,\n'tw-from-bubble-mine': message.owner.id === userId && message.image,\n'tw-from-default': message.owner.id !== userId && message.image,\n                    }\"\n                class=\"tw-font-bold tw-text-base tw-px-3 tw-pt-2 tw-z-10\"\n            >\n                {{ message.owner.name }}\n            </div>\n            } @if (message.image) { @if (imageRatio(message.image); as image) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine/[.3]': message.owner.id === userId,\n'tw-bg-default/[.3]': message.owner.id !== userId,\n                    }\"\n                class=\"tw-flex tw-justify-center tw-items-center tw-bg-zinc-500/[.3] tw-relative\"\n            >\n                <a\n                    [download]=\"message.image.name\"\n                    href=\"assets/bg-chat.jpg\"\n                    target=\"_blank\"\n                    class=\"tw-absolute tw-w-full tw-h-full tw-bg-black/[.4] dark:tw-bg-white/[.4] tw-opacity-0 hover:tw-opacity-100 tw-transition-all tw-cursor-pointer tw-flex tw-justify-center tw-items-center\"\n                >\n                    <fd-icon class=\"!tw-text-default !tw-text-3xl\" glyph=\"download\"></fd-icon>\n                </a>\n                <img\n                    [ngStyle]=\"{\n                        width: image.displayWidth + 'px',\n                        height: image.displayHeight + 'px'\n                    }\"\n                    [src]=\"image.url\"\n                />\n            </div>\n            } } @if (message.file?.name) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default': message.owner.id !== userId,\n                    }\"\n                class=\"tw-px-2 tw-pt-2 w-full tw-flex tw-gap-2\"\n            >\n                <a\n                    [download]=\"message.file?.FileName\"\n                    href=\"assets/bg-chat.jpg\"\n                    target=\"_blank\"\n                    class=\"tw-shrink-0 tw-row-0 tw-size-12 tw-rounded-lg tw-bg-orange-400 tw-flex tw-justify-center tw-items-center tw-cursor-pointer tw-transition-all hover:tw-bg-orange-600\"\n                >\n                    <span class=\"tw-font-bold leading-6 tw-text-lg tw-text-white\">\n                        {{ message.file?.Type }}\n                    </span>\n                </a>\n                <div class=\"tw-flex tw-flex-col\">\n                    <span class=\"tw-font-bold tw-text-md tw-text-base tw-w-full tw-truncate\">\n                        {{ message.file?.FileName }}</span\n                    >\n                    <span class=\"tw-text-sm tw-text-gray-500 dark:tw-text-gray-400 tw-w-full tw-truncate\">\n                        {{ message.file?.Size }}</span\n                    >\n                </div>\n            </div>\n            } @if (message.text) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default': message.owner.id !== userId,\n                    }\"\n                class=\"tw-whitespace-pre-line tw-px-3 tw-pt-1\"\n                [innerHTML]=\"message.text\"\n            ></div>\n            }\n            <div\n                class=\"tw-flex tw-w-full tw-px-2 tw-pt-1 tw-pb-2 tw-items-center tw-gap-2 tw-justify-end\"\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default tw-flex-row-reverse': message.owner.id !== userId,\n}\"\n            >\n                <span class=\"tw-text-xs tw-text-gray-500 dark:tw-text-gray-300\">{{\n                    message.createdAt | utilDateToHhMm\n                }}</span>\n                <fd-popover placement=\"bottom-end\" title=\"bottom-end\">\n                    <fd-popover-control>\n                        <button\n                            fd-button\n                            fdType=\"transparent\"\n                            [fdCompact]=\"true\"\n                            glyph=\"navigation-down-arrow\"\n                        ></button>\n                    </fd-popover-control>\n                    <fd-popover-body minWidth=\"10rem\">\n                        <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                (click)=\"reply.emit(message)\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"undo\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u067E\u0627\u0633\u062E \u062F\u0627\u062F\u0646</span>\n                            </label>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"forward\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u06A9\u0631\u062F\u0646</span>\n                            </label>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\n                            </label>\n                        </div>\n                    </fd-popover-body>\n                </fd-popover>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: UtilDateToHhMmPipe, name: "utilDateToHhMm" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaChatMessageComponent, selector: "bsu-barsa-chat-message", inputs: { message: "message", showSender: "showSender", nextIsSame: "nextIsSame", pervIsSame: "pervIsSame", badge: "badge", nextHasBadge: "nextHasBadge", badgeLabel: "badgeLabel" }, outputs: { reply: "reply" }, ngImport: i0, template: "<div\n    class=\"tw-w-full tw-px-4 tw-flex tw-flex-wrap\"\n    [ngClass]=\"{\n'tw-pt-1': pervIsSame,\n'tw-pt-3': !pervIsSame,\n}\"\n>\n    @if (badge) {\n    <div class=\"tw-w-full tw-pb-6 tw-pt-5\">\n        <div class=\"tw-w-fit tw-bg-zinc-500 tw-text-white tw-px-4 tw-mx-auto tw-rounded-full tw-text-md\">\n            {{ badgeLabel }}\n        </div>\n    </div>\n    }\n    <div\n        class=\"tw-w-full tw-flex tw-gap-2 tw-items-end tw-relative\"\n        [ngClass]=\"{\n'tw-justify-start': message.owner.id === userId,\n'tw-flex-row-reverse': message.owner.id !== userId,\n'tw-ms-14': (nextIsSame && !nextHasBadge) && message.owner.id === userId,\n'tw-me-14': (nextIsSame && !nextHasBadge) && message.owner.id !== userId,\n    }\"\n    >\n        @if (!nextIsSame || nextHasBadge) {\n        <fd-avatar\n            size=\"s\"\n            [label]=\"message.owner.avatar ? '' : message.owner?.name\"\n            [circle]=\"true\"\n            [image]=\"message.owner?.avatar\"\n            [placeholder]=\"message.owner.avatar ? false : true\"\n        ></fd-avatar>\n        } @if (!nextIsSame || nextHasBadge) {\n        <div\n            class=\"tw-bg-transparent tw-overflow-hidden tw-size-3 tw-absolute tw-bottom-0 tw-border-[6px] tw-border-t-transparent\"\n            [ngClass]=\"{\n                'tw-right-11 tw-border-b-bubble-mine tw-border-l-bubble-mine tw-border-r-transparent':\n                    message.owner.id === userId,\n                'tw-left-11 tw-border-b-default tw-border-r-default tw-border-l-transparent':\n                    message.owner.id !== userId\n            }\"\n        ></div>\n        }\n        <div\n            @inPaneAnimation\n            class=\"tw-max-w-[80%] tw-min-w-40 tw-rounded-2xl tw-text-base tw-relative tw-overflow-hidden\"\n            [ngClass]=\"{\n                '!tw-rounded-br-none':\n                    message.owner.id === userId && (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\n                '!tw-rounded-bl-none':\n                    message.owner.id !== userId && (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\n                '!tw-rounded-tr-none': message.owner.id === userId && pervIsSame && !badge,\n                '!tw-rounded-tl-none': message.owner.id !== userId && pervIsSame && !badge\n            }\"\n        >\n            @if (showSender && (!pervIsSame || badge)) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId && !message.image,\n'tw-bg-default': message.owner.id !== userId && !message.image,\n'tw-absolute tw-top-0 tw-right-0 tw-pb-8 tw-w-full tw-rounded-tr-2xl tw-bg-gradient-to-b tw-to-transparent': message.image,\n'tw-from-bubble-mine': message.owner.id === userId && message.image,\n'tw-from-default': message.owner.id !== userId && message.image,\n                    }\"\n                class=\"tw-font-bold tw-text-base tw-px-3 tw-pt-2 tw-z-10\"\n            >\n                {{ message.owner.name }}\n            </div>\n            } @if (message.image) { @if (imageRatio(message.image); as image) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine/[.3]': message.owner.id === userId,\n'tw-bg-default/[.3]': message.owner.id !== userId,\n                    }\"\n                class=\"tw-flex tw-justify-center tw-items-center tw-bg-zinc-500/[.3] tw-relative\"\n            >\n                <a\n                    [download]=\"message.image.name\"\n                    href=\"assets/bg-chat.jpg\"\n                    target=\"_blank\"\n                    class=\"tw-absolute tw-w-full tw-h-full tw-bg-black/[.4] dark:tw-bg-white/[.4] tw-opacity-0 hover:tw-opacity-100 tw-transition-all tw-cursor-pointer tw-flex tw-justify-center tw-items-center\"\n                >\n                    <fd-icon class=\"!tw-text-default !tw-text-3xl\" glyph=\"download\"></fd-icon>\n                </a>\n                <img\n                    [ngStyle]=\"{\n                        width: image.displayWidth + 'px',\n                        height: image.displayHeight + 'px'\n                    }\"\n                    [src]=\"image.url\"\n                />\n            </div>\n            } } @if (message.file?.name) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default': message.owner.id !== userId,\n                    }\"\n                class=\"tw-px-2 tw-pt-2 w-full tw-flex tw-gap-2\"\n            >\n                <a\n                    [download]=\"message.file?.FileName\"\n                    href=\"assets/bg-chat.jpg\"\n                    target=\"_blank\"\n                    class=\"tw-shrink-0 tw-row-0 tw-size-12 tw-rounded-lg tw-bg-orange-400 tw-flex tw-justify-center tw-items-center tw-cursor-pointer tw-transition-all hover:tw-bg-orange-600\"\n                >\n                    <span class=\"tw-font-bold leading-6 tw-text-lg tw-text-white\">\n                        {{ message.file?.Type }}\n                    </span>\n                </a>\n                <div class=\"tw-flex tw-flex-col\">\n                    <span class=\"tw-font-bold tw-text-md tw-text-base tw-w-full tw-truncate\">\n                        {{ message.file?.FileName }}</span\n                    >\n                    <span class=\"tw-text-sm tw-text-gray-500 dark:tw-text-gray-400 tw-w-full tw-truncate\">\n                        {{ message.file?.Size }}</span\n                    >\n                </div>\n            </div>\n            } @if (message.text) {\n            <div\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default': message.owner.id !== userId,\n                    }\"\n                class=\"tw-whitespace-pre-line tw-px-3 tw-pt-1\"\n                [innerHTML]=\"message.text\"\n            ></div>\n            }\n            <div\n                class=\"tw-flex tw-w-full tw-px-2 tw-pt-1 tw-pb-2 tw-items-center tw-gap-2 tw-justify-end\"\n                [ngClass]=\"{\n'tw-bg-bubble-mine': message.owner.id === userId,\n'tw-bg-default tw-flex-row-reverse': message.owner.id !== userId,\n}\"\n            >\n                <span class=\"tw-text-xs tw-text-gray-500 dark:tw-text-gray-300\">{{\n                    message.createdAt | utilDateToHhMm\n                }}</span>\n                <fd-popover placement=\"bottom-end\" title=\"bottom-end\">\n                    <fd-popover-control>\n                        <button\n                            fd-button\n                            fdType=\"transparent\"\n                            [fdCompact]=\"true\"\n                            glyph=\"navigation-down-arrow\"\n                        ></button>\n                    </fd-popover-control>\n                    <fd-popover-body minWidth=\"10rem\">\n                        <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                                (click)=\"reply.emit(message)\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"undo\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u067E\u0627\u0633\u062E \u062F\u0627\u062F\u0646</span>\n                            </label>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"forward\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u06A9\u0631\u062F\u0646</span>\n                            </label>\n                            <label\n                                class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\n                            >\n                                <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\n                                <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\n                            </label>\n                        </div>\n                    </fd-popover-body>\n                </fd-popover>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: UtilDateToHhMmPipe, name: "utilDateToHhMm" }], animations: [
             trigger('inPaneAnimation', [
                 transition(':enter', [
                     style({ opacity: 0, transform: 'scale(0, 0)' }),