barsa-sap-ui 0.0.2 → 0.0.4

package/fesm2015/barsa-sap-ui.mjs

@@ -1,13 +1,13 @@
 import * as i0 from '@angular/core';
 import { Component, ChangeDetectionStrategy, Input, ElementRef, ViewChild, HostBinding, EventEmitter, Output, ViewEncapsulation, ViewChildren, Inject, Optional, Self, TemplateRef, HostListener, Pipe, Directive, ViewContainerRef, SkipSelf, NgModule, 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, BaseUlvSettingComponent, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, GetAllColumnsSorted, getControlSizeMode, getGridSettings, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, BaseDirective, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, BaseViewItemPropsComponent, LayoutPanelBaseComponent, BaseViewContentPropsComponent, enumValueToStringSize, UlvMainService, isFunction, FilesValidationHelper, getValidExtension, isImage, getImagePath, getIcon, UploadService, FormToolbarBaseComponent, FormBaseComponent, ContainerService, PageBaseComponent, getHeaderValue, ContainerComponent, FormPropsBaseComponent, LogService as LogService$1, NumberBaseComponent, FormService, BaseFormToolbaritemPropsComponent, getDeviceIsPhone, getDeviceIsTablet, PortalService, BaseModule, BarsaNovinRayCoreModule, DIALOG_SERVICE } from 'barsa-novin-ray-core';
+import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, LayoutService, BaseUlvSettingComponent, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, GetAllColumnsSorted, getControlSizeMode, getGridSettings, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, BaseDirective, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, BaseViewItemPropsComponent, LayoutPanelBaseComponent, BaseViewContentPropsComponent, enumValueToStringSize, DateRanges, LogService, UlvMainService, isFunction, FilesValidationHelper, getValidExtension, isImage, getImagePath, getIcon, UploadService, FormToolbarBaseComponent, FormBaseComponent, ContainerService, PageBaseComponent, getHeaderValue, ContainerComponent, FormPropsBaseComponent, NumberBaseComponent, FormService, BaseFormToolbaritemPropsComponent, getDeviceIsPhone, getDeviceIsTablet, PortalService, BaseModule, BarsaNovinRayCoreModule, DIALOG_SERVICE } from 'barsa-novin-ray-core';
 import moment from 'moment';
 import jmoment from 'moment-jalaali';
 import { merge, of, BehaviorSubject, Subject, combineLatest, forkJoin, takeUntil as takeUntil$1, fromEvent, filter as filter$1 } from 'rxjs';
 import { tap, filter, map, debounceTime, distinctUntilChanged, withLatestFrom, takeUntil, exhaustMap, finalize, switchMap, mergeMap, delay, catchError } from 'rxjs/operators';
 import * as i1$1 from '@fundamental-ngx/core';
-import { TableComponent, ToolbarComponent, RadioButtonComponent, DynamicPageComponent, FileUploaderComponent, MultiInputComponent, TabPanelComponent, WizardComponent, WizardStepComponent, ComboboxComponent, InlineHelpDirective, ContentDensityEnum, ContentDensityService, ThemesService, RtlService, FundamentalNgxCoreModule, FacetModule, WizardModule, DialogService, ContentDensityModule, ContentDensityMode } from '@fundamental-ngx/core';
+import { TableComponent, ToolbarComponent, RadioButtonComponent, DynamicPageComponent, FileUploaderComponent, MultiInputComponent, TabPanelComponent, WizardComponent, WizardStepComponent, ComboboxComponent, InlineHelpDirective, ContentDensityMode, GlobalContentDensityService, ThemesService, RtlService, FundamentalNgxCoreModule, FacetModule, WizardModule, DialogService, ContentDensityModule } from '@fundamental-ngx/core';
 import { SortDirection, TableDataProvider, SelectionMode, FundamentalNgxPlatformModule, PlatformDynamicPageModule, PlatformTextAreaModule, PlatformSearchFieldModule } from '@fundamental-ngx/platform';
 import * as i2$2 from '@angular/platform-browser';
 import * as i1 from '@angular/common';
@@ -35,7 +35,6 @@ import * as i4$3 from '@fundamental-ngx/core/split-button';
 import * as i7$1 from '@fundamental-ngx/core/toolbar';
 import * as i8 from '@fundamental-ngx/platform/shared';
 import * as i7$2 from '@fundamental-ngx/platform/button';
-import { BaseComponent as BaseComponent$1, BarsaApi as BarsaApi$1, DateMiladiService as DateMiladiService$1, DateHijriService as DateHijriService$1, DateShamsiService as DateShamsiService$1, FieldBaseComponent as FieldBaseComponent$1, DateRanges, DateService as DateService$1, LogService } from 'dist/barsa-novin-ray-core';
 import * as i1$3 from 'barsa-calendar';
 import { CalendarService, BarsaCalendarModule } from 'barsa-calendar';
 import * as i3$3 from '@fundamental-ngx/core/layout-panel';
@@ -44,18 +43,18 @@ import * as i7$3 from '@fundamental-ngx/core/popover';
 import * as i1$4 from '@fundamental-ngx/core/illustrated-message';
 import * as i3$4 from '@fundamental-ngx/core/avatar';
 import * as i4$4 from '@fundamental-ngx/core/layout-grid';
-import * as i3$5 from '@fundamental-ngx/core/link';
+import * as i5$2 from '@fundamental-ngx/core/link';
 import * as i7$4 from '@fundamental-ngx/core/card';
 import * as i9 from '@fundamental-ngx/core/quick-view';
 import * as i9$1 from '@fundamental-ngx/core/message-strip';
-import * as i5$2 from '@fundamental-ngx/core/notification';
+import * as i5$3 from '@fundamental-ngx/core/notification';
 import * as i6$3 from '@fundamental-ngx/core/input-group';
 import * as i11 from '@fundamental-ngx/core/radio';
-import * as i3$6 from '@angular/router';
+import * as i3$5 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import * as i4$5 from '@fundamental-ngx/core/breadcrumb';
 import * as i6$4 from '@fundamental-ngx/core/dynamic-page';
-import * as i5$3 from 'ngx-color/swatches';
+import * as i5$4 from 'ngx-color/swatches';
 import { ColorSwatchesModule } from 'ngx-color/swatches';
 import * as i6$5 from 'ngx-color/chrome';
 import { ColorChromeModule } from 'ngx-color/chrome';
@@ -63,7 +62,7 @@ import * as i7$5 from '@angular/cdk/clipboard';
 import { ClipboardModule } from '@angular/cdk/clipboard';
 import * as i4$6 from '@fundamental-ngx/core/file-uploader';
 import * as i7$6 from '@fundamental-ngx/core/object-identifier';
-import * as i5$4 from '@fundamental-ngx/core/object-number';
+import * as i5$5 from '@fundamental-ngx/core/object-number';
 import * as i6$6 from '@fundamental-ngx/core/object-status';
 import * as i10 from '@fundamental-ngx/core/token';
 import * as i10$1 from '@fundamental-ngx/platform/slider';
@@ -74,15 +73,15 @@ import * as i16 from '@fundamental-ngx/core/text';
 import * as i18 from '@fundamental-ngx/core/progress-indicator';
 import * as i8$2 from '@fundamental-ngx/core/multi-input';
 import * as i2$5 from '@fundamental-ngx/core/combobox';
-import * as i5$5 from '@fundamental-ngx/platform/dynamic-page';
+import * as i5$6 from '@fundamental-ngx/platform/dynamic-page';
 import * as i7$8 from '@fundamental-ngx/platform/menu';
 import * as i8$3 from '@fundamental-ngx/platform/split-menu-button';
 import * as i2$6 from '@fundamental-ngx/core/wizard';
 import * as i7$9 from '@fundamental-ngx/core/segmented-button';
-import * as i3$7 from '@fundamental-ngx/core/pagination';
-import * as i3$8 from '@fundamental-ngx/core/panel';
+import * as i3$6 from '@fundamental-ngx/core/pagination';
+import * as i3$7 from '@fundamental-ngx/core/panel';
 import * as i1$5 from '@fundamental-ngx/core/switch';
-import * as i3$9 from '@fundamental-ngx/core/inline-help';
+import * as i3$8 from '@fundamental-ngx/core/inline-help';
 import { CdkTableModule } from '@angular/cdk/table';
 
 class ProgressIndicatorComponent extends BaseComponent {
@@ -351,9 +350,17 @@ class LayoutControlComponent extends LayoutItemBaseComponent {
             this.minHeight = '2rem';
         }
     }
+    ngOnChanges(changes) {
+        super.ngOnChanges(changes);
+        const { flex } = changes;
+        if (flex) {
+            this._setFlex(flex.currentValue);
+        }
+    }
     ngOnInit() {
         var _a, _b;
         super.ngOnInit();
+        this._setFlex(this.flex);
         if (this.inlineEdit) {
             this.minHeight = 'auto';
         }
@@ -451,9 +458,14 @@ class LayoutControlComponent extends LayoutItemBaseComponent {
             this._renderer2.removeClass(this.el.nativeElement, 'hide-form-item');
         }
     }
+    _setFlex(flex) {
+        if (typeof flex !== 'undefined') {
+            this._renderer2.setStyle(this.el.nativeElement, 'flex', flex);
+        }
+    }
 }
 LayoutControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LayoutControlComponent, deps: [{ token: i2.FormPanelService }, { token: i0.ElementRef }, { token: i1$1.ContentDensityService }, { token: i2$2.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i2.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
-LayoutControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: { inlineEdit: "inlineEdit", caption: "caption", focusControl: "focusControl", showLabel: "showLabel", maxLabelWidth: "maxLabelWidth", hasHorizontalText: "hasHorizontalText", contentDensity: "contentDensity", RefreshLabel: "RefreshLabel", SetVisible: "SetVisible" }, host: { properties: { "class.layout-control": "this.layoutControlClass", "class.row-direction": "this.isRowDirection", "class.row-reverse-direction": "this.isRowReverseDirection", "class.column-direction": "this.isColumnDirection", "class.column-reverse-direction": "this.isColumnReverseDirection", "class.container-field": "this.isContainer", "style.max-width": "this.maxWidth", "style.min-width": "this.minWidth", "style.min-height": "this.minHeight", "style.height": "this.height", "attr.isChekbox": "this.isCheckbox", "attr.isButton": "this.isSinglePicture", "attr.minWidth": "this.attrMinWidth", "attr.controlId": "this.attrControlId", "attr.caption": "this.attrCaption" } }, providers: [LayoutService], viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, static: true }, { propertyName: "tempLabelRef", first: true, predicate: ["tempLabelRef"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!hide\">\n    <ng-container *ngIf=\"labelVisible && !isCheckbox\">\n        <bsu-ly-label\n            [attr.labelWidth]=\"labelWidth\"\n            [attr.canvasWidth]=\"canvasWidth\"\n            [attrRtl]\n            [class.no-padding]=\"config.Padding[0] === 0\"\n            [config]=\"config\"\n            [caption]=\"labelCaption\"\n            [originalWidth]=\"labelWidth\"\n            [style.min-width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [style.width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [isMandatory]=\"isMandatory\"\n            [fieldIcon]=\"fieldIcon\"\n            [originalXtype]=\"originalXtype\"\n            [textVisible]=\"textVisible\"\n            [isColumn]=\"isColumnDirection || isColumnReverseDirection\"\n        ></bsu-ly-label>\n    </ng-container>\n    <label [attr.visible]=\"labelVisible\" class=\"horizontal-label\" [innerHtml]=\"emptyText\"></label>\n    <bnrc-field-ui\n        [attr.xtype]=\"config.FieldUi.originalXtype\"\n        [attr.fieldWidth]=\"layoutControlWidth\"\n        [attr.isCheckbox]=\"isCheckbox\"\n        [style.flex-grow]=\"isCheckbox ? 1 : 0\"\n        [class.no-padding]=\"config.Padding[0] === 0\"\n        [customField]=\"config.FieldUi\"\n        [layoutInfo]=\"config\"\n        [inlineEdit]=\"inlineEdit\"\n        [focusControl]=\"focusControl\"\n        [isSearchPanel]=\"isSearchPanel\"\n        [style.height]=\"isUlv ? '100%' : 'auto'\"\n        [attr.isulv]=\"isUlv\"\n    ></bnrc-field-ui>\n</ng-container>\n", styles: [":host{width:100%;display:flex}.form-item-label-container{display:flex;position:relative}.lbl-temp{position:absolute;visibility:hidden}bsu-ly-label{padding:0 5px;margin:auto}bnrc-field-ui{padding:0 5px;margin:auto}bnrc-field-ui[xtype=\"Ui.CheckBox\"]{padding:0}@media screen and (max-width: 599px){:host{height:auto}bnrc-field-ui{height:auto}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "layoutInfo", "inlineEdit", "focusControl"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: LyLabelComponent, selector: "bsu-ly-label", inputs: ["originalWidth", "minWidth", "caption", "isColumn", "isMandatory", "fieldIcon", "originalXtype", "textVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LayoutControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: { inlineEdit: "inlineEdit", caption: "caption", focusControl: "focusControl", showLabel: "showLabel", maxLabelWidth: "maxLabelWidth", hasHorizontalText: "hasHorizontalText", contentDensity: "contentDensity", flex: "flex", RefreshLabel: "RefreshLabel", SetVisible: "SetVisible" }, host: { properties: { "class.layout-control": "this.layoutControlClass", "class.row-direction": "this.isRowDirection", "class.row-reverse-direction": "this.isRowReverseDirection", "class.column-direction": "this.isColumnDirection", "class.column-reverse-direction": "this.isColumnReverseDirection", "class.container-field": "this.isContainer", "style.max-width": "this.maxWidth", "style.min-width": "this.minWidth", "style.min-height": "this.minHeight", "style.height": "this.height", "attr.isChekbox": "this.isCheckbox", "attr.isButton": "this.isSinglePicture", "attr.minWidth": "this.attrMinWidth", "attr.controlId": "this.attrControlId", "attr.caption": "this.attrCaption" } }, providers: [LayoutService], viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, static: true }, { propertyName: "tempLabelRef", first: true, predicate: ["tempLabelRef"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!hide\">\n    <ng-container *ngIf=\"labelVisible && !isCheckbox\">\n        <bsu-ly-label\n            [attr.labelWidth]=\"labelWidth\"\n            [attr.canvasWidth]=\"canvasWidth\"\n            [attrRtl]\n            [class.no-padding]=\"config.Padding[0] === 0\"\n            [config]=\"config\"\n            [caption]=\"labelCaption\"\n            [originalWidth]=\"labelWidth\"\n            [style.min-width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [style.width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [isMandatory]=\"isMandatory\"\n            [fieldIcon]=\"fieldIcon\"\n            [originalXtype]=\"originalXtype\"\n            [textVisible]=\"textVisible\"\n            [isColumn]=\"isColumnDirection || isColumnReverseDirection\"\n        ></bsu-ly-label>\n    </ng-container>\n    <label [attr.visible]=\"labelVisible\" class=\"horizontal-label\" [innerHtml]=\"emptyText\"></label>\n    <bnrc-field-ui\n        [attr.xtype]=\"config.FieldUi.originalXtype\"\n        [attr.fieldWidth]=\"layoutControlWidth\"\n        [attr.isCheckbox]=\"isCheckbox\"\n        [style.flex-grow]=\"isCheckbox ? 1 : 0\"\n        [class.no-padding]=\"config.Padding[0] === 0\"\n        [customField]=\"config.FieldUi\"\n        [layoutInfo]=\"config\"\n        [inlineEdit]=\"inlineEdit\"\n        [focusControl]=\"focusControl\"\n        [isSearchPanel]=\"isSearchPanel\"\n        [style.height]=\"isUlv ? '100%' : 'auto'\"\n        [attr.isulv]=\"isUlv\"\n    ></bnrc-field-ui>\n</ng-container>\n", styles: [":host{width:100%;display:flex}.form-item-label-container{display:flex;position:relative}.lbl-temp{position:absolute;visibility:hidden}bsu-ly-label{padding:0 5px;margin:auto}bnrc-field-ui{padding:0 5px;margin:auto}bnrc-field-ui[xtype=\"Ui.CheckBox\"]{padding:0}@media screen and (max-width: 599px){:host{height:auto}bnrc-field-ui{height:auto}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "layoutInfo", "inlineEdit", "focusControl"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: LyLabelComponent, selector: "bsu-ly-label", inputs: ["originalWidth", "minWidth", "caption", "isColumn", "isMandatory", "fieldIcon", "originalXtype", "textVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LayoutControlComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-layout-control', providers: [LayoutService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!hide\">\n    <ng-container *ngIf=\"labelVisible && !isCheckbox\">\n        <bsu-ly-label\n            [attr.labelWidth]=\"labelWidth\"\n            [attr.canvasWidth]=\"canvasWidth\"\n            [attrRtl]\n            [class.no-padding]=\"config.Padding[0] === 0\"\n            [config]=\"config\"\n            [caption]=\"labelCaption\"\n            [originalWidth]=\"labelWidth\"\n            [style.min-width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [style.width]=\"\n                isCheckbox ? 'auto' : isColumnDirection || isColumnReverseDirection ? '100%' : maxLabelWidth + 'px'\n            \"\n            [isMandatory]=\"isMandatory\"\n            [fieldIcon]=\"fieldIcon\"\n            [originalXtype]=\"originalXtype\"\n            [textVisible]=\"textVisible\"\n            [isColumn]=\"isColumnDirection || isColumnReverseDirection\"\n        ></bsu-ly-label>\n    </ng-container>\n    <label [attr.visible]=\"labelVisible\" class=\"horizontal-label\" [innerHtml]=\"emptyText\"></label>\n    <bnrc-field-ui\n        [attr.xtype]=\"config.FieldUi.originalXtype\"\n        [attr.fieldWidth]=\"layoutControlWidth\"\n        [attr.isCheckbox]=\"isCheckbox\"\n        [style.flex-grow]=\"isCheckbox ? 1 : 0\"\n        [class.no-padding]=\"config.Padding[0] === 0\"\n        [customField]=\"config.FieldUi\"\n        [layoutInfo]=\"config\"\n        [inlineEdit]=\"inlineEdit\"\n        [focusControl]=\"focusControl\"\n        [isSearchPanel]=\"isSearchPanel\"\n        [style.height]=\"isUlv ? '100%' : 'auto'\"\n        [attr.isulv]=\"isUlv\"\n    ></bnrc-field-ui>\n</ng-container>\n", styles: [":host{width:100%;display:flex}.form-item-label-container{display:flex;position:relative}.lbl-temp{position:absolute;visibility:hidden}bsu-ly-label{padding:0 5px;margin:auto}bnrc-field-ui{padding:0 5px;margin:auto}bnrc-field-ui[xtype=\"Ui.CheckBox\"]{padding:0}@media screen and (max-width: 599px){:host{height:auto}bnrc-field-ui{height:auto}}\n"] }]
@@ -525,6 +537,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 type: Input
             }], contentDensity: [{
                 type: Input
+            }], flex: [{
+                type: Input
             }], RefreshLabel: [{
                 type: Input
             }], SetVisible: [{
@@ -1569,10 +1583,10 @@ class MaskComponent extends BaseComponent {
     }
 }
 MaskComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MaskComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MaskComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MaskComponent, selector: "bsu-mask", inputs: { size: "size", marginTop: "marginTop" }, usesInheritance: true, ngImport: i0, template: "<!-- <ui5-busyindicator  active size=\"Medium\" ></ui5-busyindicator> -->\n\n<fd-busy-indicator [style.margin-top]=\"marginTop ?? '20%'\" [loading]=\"true\" [size]=\"size\"></fd-busy-indicator>\n", styles: [":host{width:100%;height:100%;position:absolute;left:0;top:0;z-index:100;display:flex;align-items:start;justify-content:center;background-color:#cccccc6e}\n"], dependencies: [{ kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MaskComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MaskComponent, selector: "bsu-mask", inputs: { size: "size", marginTop: "marginTop" }, usesInheritance: true, ngImport: i0, template: "<!-- <ui5-busyindicator  active size=\"Medium\" ></ui5-busyindicator> -->\n\n<fd-busy-indicator [style.margin-top]=\"marginTop ?? '20%'\" [loading]=\"true\" [size]=\"size\"></fd-busy-indicator>\n", styles: [":host{width:100%;height:100%;position:absolute;left:0;top:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;background-color:#cccccc6e}\n"], dependencies: [{ kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MaskComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-mask', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- <ui5-busyindicator  active size=\"Medium\" ></ui5-busyindicator> -->\n\n<fd-busy-indicator [style.margin-top]=\"marginTop ?? '20%'\" [loading]=\"true\" [size]=\"size\"></fd-busy-indicator>\n", styles: [":host{width:100%;height:100%;position:absolute;left:0;top:0;z-index:100;display:flex;align-items:start;justify-content:center;background-color:#cccccc6e}\n"] }]
+            args: [{ selector: 'bsu-mask', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- <ui5-busyindicator  active size=\"Medium\" ></ui5-busyindicator> -->\n\n<fd-busy-indicator [style.margin-top]=\"marginTop ?? '20%'\" [loading]=\"true\" [size]=\"size\"></fd-busy-indicator>\n", styles: [":host{width:100%;height:100%;position:absolute;left:0;top:0;z-index:100;display:flex;align-items:flex-start;justify-content:center;background-color:#cccccc6e}\n"] }]
         }], propDecorators: { size: [{
                 type: Input
             }], marginTop: [{
@@ -2516,7 +2530,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 args: [TemplateRef, { static: true }]
             }] } });
 
-class BarsaAspViewerComponent extends BaseComponent$1 {
+class BarsaAspViewerComponent extends BaseComponent {
     constructor(el, renderer) {
         super();
         this.el = el;
@@ -2591,10 +2605,10 @@ class BarsaAspViewerComponent extends BaseComponent$1 {
                 '&FrameId=' +
                 frameId +
                 '&Language=' +
-                BarsaApi$1.BBB.CurrentCulture +
+                BarsaApi.BBB.CurrentCulture +
                 '&CtrlIsPressed=' +
                 this.ctrlIsPressed;
-        const value = BarsaApi$1.Ext.util.JSON.encode(params);
+        const value = BarsaApi.Ext.util.JSON.encode(params);
         this.hidden.nativeElement.value = escape(value);
         form.submit();
     }
@@ -2786,7 +2800,7 @@ class ColumnMatrixRendererComponent extends BaseComponent {
     }
 }
 ColumnMatrixRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ColumnMatrixRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ColumnMatrixRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ColumnMatrixRendererComponent, selector: "bsu-column-matrix-renderer", inputs: { value: "value", valueCaption: "valueCaption", formLayout: "formLayout", columnCaption: "columnCaption", uiControl: "uiControl", valueType: "valueType", isActive: "isActive", height: "height" }, outputs: { cellClick: "cellClick", changeToEdit: "changeToEdit" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container>\n    <ng-container *ngIf=\"!isActive; else formControl\">\n        <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #renderGeneral>\n    <div (click)=\"cellClick.emit()\" class=\"render-general\">\n        <fd-popover #popover [fillControlMode]=\"'equal'\">\n            <fd-popover-control style=\"display: flex; flex-direction: column; justify-content: center; min-width: 100%\">\n                <span\n                    style=\"min-width: 100%; height: inherit\"\n                    #popoverControlEl\n                    (keydown.enter)=\"onEdit()\"\n                    (mouseover)=\"onOpenPopover($event, popoverControlEl)\"\n                    (mouseleave)=\"popover.close()\"\n                    [class.break-anywhere]=\"breakValueAnywhere\"\n                    >{{ value | matrixValue: valueType:uiControl }}</span\n                >\n            </fd-popover-control>\n            <fd-popover-body>\n                <span [class.break-anywhere]=\"breakValueAnywhere\">{{ value | matrixValue: valueType:uiControl }}</span>\n            </fd-popover-body>\n        </fd-popover>\n    </div>\n</ng-template>\n\n<ng-template #formControl>\n    <bsu-layout-control\n        *ngIf=\"uiControl\"\n        [caption]=\"valueCaption\"\n        [config]=\"uiControl\"\n        [focusControl]=\"true\"\n        [showLabel]=\"false\"\n    >\n    </bsu-layout-control>\n</ng-template>\n", styles: [":host{flex:1;width:inherit}.break-anywhere{line-break:anywhere}.render-general{width:100%;height:100%}::ng-deep fd-popover,::ng-deep fd-popover-control,::ng-deep .fd-popover__control{height:inherit;min-width:100%}fd-popover-body{margin-top:5px}fd-popover-body ::ng-deep .fd-popover__popper--cdk-custom{padding:5px}fd-popover-body span{white-space:break-spaces;padding:5px}bsu-layout-control{min-width:100%!important}bsu-layout-control span{height:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "RefreshLabel", "SetVisible"] }, { kind: "pipe", type: MatrixValuePipe, name: "matrixValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ColumnMatrixRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ColumnMatrixRendererComponent, selector: "bsu-column-matrix-renderer", inputs: { value: "value", valueCaption: "valueCaption", formLayout: "formLayout", columnCaption: "columnCaption", uiControl: "uiControl", valueType: "valueType", isActive: "isActive", height: "height" }, outputs: { cellClick: "cellClick", changeToEdit: "changeToEdit" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container>\n    <ng-container *ngIf=\"!isActive; else formControl\">\n        <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #renderGeneral>\n    <div (click)=\"cellClick.emit()\" class=\"render-general\">\n        <fd-popover #popover [fillControlMode]=\"'equal'\">\n            <fd-popover-control style=\"display: flex; flex-direction: column; justify-content: center; min-width: 100%\">\n                <span\n                    style=\"min-width: 100%; height: inherit\"\n                    #popoverControlEl\n                    (keydown.enter)=\"onEdit()\"\n                    (mouseover)=\"onOpenPopover($event, popoverControlEl)\"\n                    (mouseleave)=\"popover.close()\"\n                    [class.break-anywhere]=\"breakValueAnywhere\"\n                    >{{ value | matrixValue: valueType:uiControl }}</span\n                >\n            </fd-popover-control>\n            <fd-popover-body>\n                <span [class.break-anywhere]=\"breakValueAnywhere\">{{ value | matrixValue: valueType:uiControl }}</span>\n            </fd-popover-body>\n        </fd-popover>\n    </div>\n</ng-template>\n\n<ng-template #formControl>\n    <bsu-layout-control\n        *ngIf=\"uiControl\"\n        [caption]=\"valueCaption\"\n        [config]=\"uiControl\"\n        [focusControl]=\"true\"\n        [showLabel]=\"false\"\n    >\n    </bsu-layout-control>\n</ng-template>\n", styles: [":host{flex:1;width:inherit}.break-anywhere{line-break:anywhere}.render-general{width:100%;height:100%}::ng-deep fd-popover,::ng-deep fd-popover-control,::ng-deep .fd-popover__control{height:inherit;min-width:100%}fd-popover-body{margin-top:5px}fd-popover-body ::ng-deep .fd-popover__popper--cdk-custom{padding:5px}fd-popover-body span{white-space:break-spaces;padding:5px}bsu-layout-control{min-width:100%!important}bsu-layout-control span{height:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"] }, { kind: "pipe", type: MatrixValuePipe, name: "matrixValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ColumnMatrixRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-column-matrix-renderer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n    <ng-container *ngIf=\"!isActive; else formControl\">\n        <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n    </ng-container>\n</ng-container>\n\n<ng-template #renderGeneral>\n    <div (click)=\"cellClick.emit()\" class=\"render-general\">\n        <fd-popover #popover [fillControlMode]=\"'equal'\">\n            <fd-popover-control style=\"display: flex; flex-direction: column; justify-content: center; min-width: 100%\">\n                <span\n                    style=\"min-width: 100%; height: inherit\"\n                    #popoverControlEl\n                    (keydown.enter)=\"onEdit()\"\n                    (mouseover)=\"onOpenPopover($event, popoverControlEl)\"\n                    (mouseleave)=\"popover.close()\"\n                    [class.break-anywhere]=\"breakValueAnywhere\"\n                    >{{ value | matrixValue: valueType:uiControl }}</span\n                >\n            </fd-popover-control>\n            <fd-popover-body>\n                <span [class.break-anywhere]=\"breakValueAnywhere\">{{ value | matrixValue: valueType:uiControl }}</span>\n            </fd-popover-body>\n        </fd-popover>\n    </div>\n</ng-template>\n\n<ng-template #formControl>\n    <bsu-layout-control\n        *ngIf=\"uiControl\"\n        [caption]=\"valueCaption\"\n        [config]=\"uiControl\"\n        [focusControl]=\"true\"\n        [showLabel]=\"false\"\n    >\n    </bsu-layout-control>\n</ng-template>\n", styles: [":host{flex:1;width:inherit}.break-anywhere{line-break:anywhere}.render-general{width:100%;height:100%}::ng-deep fd-popover,::ng-deep fd-popover-control,::ng-deep .fd-popover__control{height:inherit;min-width:100%}fd-popover-body{margin-top:5px}fd-popover-body ::ng-deep .fd-popover__popper--cdk-custom{padding:5px}fd-popover-body span{white-space:break-spaces;padding:5px}bsu-layout-control{min-width:100%!important}bsu-layout-control span{height:inherit}\n"] }]
@@ -3814,7 +3828,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 type: Output
             }] } });
 
-class NoDataComponent extends BaseComponent$1 {
+class NoDataComponent extends BaseComponent {
     constructor() {
         super(...arguments);
         this.sceneConfig = {
@@ -4025,7 +4039,7 @@ class ColumnRendererComponent extends BaseComponent {
     }
 }
 ColumnRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ColumnRendererComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-ColumnRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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", rtl: "rtl", deviceName: "deviceName", deviceSize: "deviceSize" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"column\">\n    <ng-container *ngTemplateOutlet=\"editMode ? formControlTemplate : renderCellTemplate\"> </ng-container>\n</ng-container>\n<ng-template #renderCellTemplate>\n    <ng-container [ngSwitch]=\"column.FieldTypeId\">\n        <ng-container *ngSwitchCase=\"'42'\">\n            <ng-container *ngTemplateOutlet=\"renderCellImage\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'33'\">\n            <ng-container *ngTemplateOutlet=\"renderCellFileInfo\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'5'\">\n            <ng-container\n                *ngTemplateOutlet=\"column.Extra?.ShowCheckInGrid ? renderCellChecbox : renderChecboxImage\"\n            ></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n<ng-template #renderGeneral>\n    <div style=\"display: flex; width: 100%; height: 100%; align-items: center; justify-content: start\">\n        <img [attr.rtl]=\"rtl\" *ngIf=\"icon\" [src]=\"icon\" />\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        <span *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\" class=\"ellapsis\">{{ value | bbbTranslate }}</span>\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    <bsu-layout-control\n        *ngIf=\"controlUi\"\n        [inlineEdit]=\"true\"\n        [caption]=\"column.Caption\"\n        [config]=\"controlUi\"\n        [focusControl]=\"index === 0 && (isChecked || isNewInlineMo)\"\n        [showLabel]=\"formLayoutShowLabel\"\n    ></bsu-layout-control>\n</ng-template>\n<ng-template #renderCellFileInfo>\n    <fd-avatar\n        *ngIf=\"mo[column.Name]\"\n        [transparent]=\"true\"\n        [size]=\"deviceSize === 's' ? 's' : 'm'\"\n        [image]=\"mo[column.Name] | picFieldSrc: 'PictureFileInfo':null:column.FieldDefId\"\n    ></fd-avatar>\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    <ng-container *ngIf=\"column.Extra?.TrueImage === ''\">{{ value }}</ng-container>\n    <img\n        *ngIf=\"column.Extra?.TrueImage !== ''\"\n        [src]=\"mo[column.Name] ? column.Extra?.TrueImage : column.Extra?.FalseImage\"\n        aling=\"middle\"\n    />\n</ng-template>\n<ng-template #renderCellImage>\n    <fd-avatar\n        *ngIf=\"mo[column.Name] && mo[column.Name]['Url']\"\n        [size]=\"column.FieldTypeId === '42' ? 'xs' : deviceSize === 's' ? 's' : 'm'\"\n        [transparent]=\"true\"\n        [image]=\"mo[column.Name]['Url']\"\n    ></fd-avatar>\n</ng-template>\n", styles: [":host{display:contents;overflow:hidden;padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "RefreshLabel", "SetVisible"] }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ColumnRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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", rtl: "rtl", deviceName: "deviceName", deviceSize: "deviceSize" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"column\">\n    <ng-container *ngTemplateOutlet=\"editMode ? formControlTemplate : renderCellTemplate\"> </ng-container>\n</ng-container>\n<ng-template #renderCellTemplate>\n    <ng-container [ngSwitch]=\"column.FieldTypeId\">\n        <ng-container *ngSwitchCase=\"'42'\">\n            <ng-container *ngTemplateOutlet=\"renderCellImage\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'33'\">\n            <ng-container *ngTemplateOutlet=\"renderCellFileInfo\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'5'\">\n            <ng-container\n                *ngTemplateOutlet=\"column.Extra?.ShowCheckInGrid ? renderCellChecbox : renderChecboxImage\"\n            ></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n<ng-template #renderGeneral>\n    <div style=\"display: flex; width: 100%; height: 100%; align-items: center; justify-content: start\">\n        <img [attr.rtl]=\"rtl\" *ngIf=\"icon\" [src]=\"icon\" />\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        <span *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\" class=\"ellapsis\">{{ value | bbbTranslate }}</span>\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    <bsu-layout-control\n        *ngIf=\"controlUi\"\n        [inlineEdit]=\"true\"\n        [caption]=\"column.Caption\"\n        [config]=\"controlUi\"\n        [focusControl]=\"index === 0 && (isChecked || isNewInlineMo)\"\n        [showLabel]=\"formLayoutShowLabel\"\n    ></bsu-layout-control>\n</ng-template>\n<ng-template #renderCellFileInfo>\n    <fd-avatar\n        *ngIf=\"mo[column.Name]\"\n        [transparent]=\"true\"\n        [size]=\"deviceSize === 's' ? 's' : 'm'\"\n        [image]=\"mo[column.Name] | picFieldSrc: 'PictureFileInfo':null:column.FieldDefId\"\n    ></fd-avatar>\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    <ng-container *ngIf=\"column.Extra?.TrueImage === ''\">{{ value }}</ng-container>\n    <img\n        *ngIf=\"column.Extra?.TrueImage !== ''\"\n        [src]=\"mo[column.Name] ? column.Extra?.TrueImage : column.Extra?.FalseImage\"\n        aling=\"middle\"\n    />\n</ng-template>\n<ng-template #renderCellImage>\n    <fd-avatar\n        *ngIf=\"mo[column.Name] && mo[column.Name]['Url']\"\n        [size]=\"column.FieldTypeId === '42' ? 'xs' : deviceSize === 's' ? 's' : 'm'\"\n        [transparent]=\"true\"\n        [image]=\"mo[column.Name]['Url']\"\n    ></fd-avatar>\n</ng-template>\n", styles: [":host{display:contents;overflow:hidden;padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"] }, { 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: "14.2.7", ngImport: i0, type: ColumnRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-column-renderer,[colRenderer]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"column\">\n    <ng-container *ngTemplateOutlet=\"editMode ? formControlTemplate : renderCellTemplate\"> </ng-container>\n</ng-container>\n<ng-template #renderCellTemplate>\n    <ng-container [ngSwitch]=\"column.FieldTypeId\">\n        <ng-container *ngSwitchCase=\"'42'\">\n            <ng-container *ngTemplateOutlet=\"renderCellImage\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'33'\">\n            <ng-container *ngTemplateOutlet=\"renderCellFileInfo\"></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'5'\">\n            <ng-container\n                *ngTemplateOutlet=\"column.Extra?.ShowCheckInGrid ? renderCellChecbox : renderChecboxImage\"\n            ></ng-container>\n        </ng-container>\n        <ng-container *ngSwitchDefault>\n            <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n<ng-template #renderGeneral>\n    <div style=\"display: flex; width: 100%; height: 100%; align-items: center; justify-content: start\">\n        <img [attr.rtl]=\"rtl\" *ngIf=\"icon\" [src]=\"icon\" />\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        <span *ngIf=\"column.Extra?.IconDisplayTypeEnum !== 'Image'\" class=\"ellapsis\">{{ value | bbbTranslate }}</span>\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    <bsu-layout-control\n        *ngIf=\"controlUi\"\n        [inlineEdit]=\"true\"\n        [caption]=\"column.Caption\"\n        [config]=\"controlUi\"\n        [focusControl]=\"index === 0 && (isChecked || isNewInlineMo)\"\n        [showLabel]=\"formLayoutShowLabel\"\n    ></bsu-layout-control>\n</ng-template>\n<ng-template #renderCellFileInfo>\n    <fd-avatar\n        *ngIf=\"mo[column.Name]\"\n        [transparent]=\"true\"\n        [size]=\"deviceSize === 's' ? 's' : 'm'\"\n        [image]=\"mo[column.Name] | picFieldSrc: 'PictureFileInfo':null:column.FieldDefId\"\n    ></fd-avatar>\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    <ng-container *ngIf=\"column.Extra?.TrueImage === ''\">{{ value }}</ng-container>\n    <img\n        *ngIf=\"column.Extra?.TrueImage !== ''\"\n        [src]=\"mo[column.Name] ? column.Extra?.TrueImage : column.Extra?.FalseImage\"\n        aling=\"middle\"\n    />\n</ng-template>\n<ng-template #renderCellImage>\n    <fd-avatar\n        *ngIf=\"mo[column.Name] && mo[column.Name]['Url']\"\n        [size]=\"column.FieldTypeId === '42' ? 'xs' : deviceSize === 's' ? 's' : 'm'\"\n        [transparent]=\"true\"\n        [image]=\"mo[column.Name]['Url']\"\n    ></fd-avatar>\n</ng-template>\n", styles: [":host{display:contents;overflow:hidden;padding:0}\n"] }]
@@ -4108,10 +4122,10 @@ class ReportNewTopFormComponent extends BaseViewItemPropsComponent {
     }
 }
 ReportNewTopFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ReportNewTopFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ReportNewTopFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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: "<bsu-ly-layout-container-of-root\n    *ngIf=\"layout$ | async as layout94\"\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\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:end}button{margin:.3rem 5px .5rem;max-width:170px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.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.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ReportNewTopFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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: "<bsu-ly-layout-container-of-root\n    *ngIf=\"layout$ | async as layout94\"\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.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.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ReportNewTopFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-report-new-top-form', changeDetection: ChangeDetectionStrategy.OnPush, providers: [FormPanelService], template: "<bsu-ly-layout-container-of-root\n    *ngIf=\"layout$ | async as layout94\"\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\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:end}button{margin:.3rem 5px .5rem;max-width:170px}\n"] }]
+            args: [{ selector: 'bsu-report-new-top-form', changeDetection: ChangeDetectionStrategy.OnPush, providers: [FormPanelService], template: "<bsu-ly-layout-container-of-root\n    *ngIf=\"layout$ | async as layout94\"\n    [config]=\"layout94\"\n    [isPanel]=\"false\"\n    [isRoot]=\"true\"\n></bsu-ly-layout-container-of-root>\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"] }]
         }], propDecorators: { selectedMo: [{
                 type: Input
             }], add: [{
@@ -4441,7 +4455,7 @@ class CardItemComponent extends BaseViewItemPropsComponent {
     }
 }
 CardItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: CardItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-CardItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, usesInheritance: true, ngImport: i0, template: "<fd-card\n    cardType=\"quickView\"\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    <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify *ngIf=\"!noContent || contextMenuItems\">\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [mo]=\"mo\" [hostEl]=\"divEl\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplate;\n                    context: {\n                        $implicit: mo,\n                        index: this.index\n                    }\n                \"\n            ></ng-container>\n        </div>\n        <ng-container *ngIf=\"contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\">\n            <div\n                ulvContextMenu\n                [allColumns]=\"allColumns\"\n                [footerMode]=\"true\"\n                [menuItems]=\"contextMenuItems\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [mo]=\"mo\"\n                (commandClick)=\"onUlvCommand()\"\n            ></div>\n        </ng-container>\n    </fd-card-content>\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n    ><div\n        *ngIf=\"column\"\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [mo]=\"mo\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\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()\"\n            (keyup.esc)=\"onEditFormPanelCancel()\"\n            (keydown.Tab)=\"onTabKeyDown()\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n    <fd-quick-view [id]=\"'id'\" *ngIf=\"!noContent\">\n        <fd-quick-view-group>\n            <fd-quick-view-subheader\n                *ngIf=\"setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField\"\n            >\n                <fd-avatar\n                    *ngIf=\"setting.AvatarField || setting.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]=\"avatarSize ? avatarSize : deviceSize === 's' ? 's' : 'm'\"\n                    [glyph]=\"\n                        setting.Avatar ||\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n                <fd-quick-view-subheader-title *ngIf=\"setting.TitleField\">\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                <fd-quick-view-subheader-subtitle *ngIf=\"setting.SubtitleField\">\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            </fd-quick-view-subheader>\n            <fd-quick-view-group-item *ngFor=\"let column of setting.FieldListMapped\">\n                <ng-container *ngIf=\"column\">\n                    <fd-quick-view-group-item-label>\n                        {{ column.Caption }}\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                </ng-container>\n            </fd-quick-view-group-item>\n            <fd-quick-view-group-item>\n                <fd-quick-view-group-item-content *ngIf=\"setting.DescriptionField\">\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                <fd-quick-view-group-item-content\n                    class=\"action\"\n                    *ngIf=\"setting.ActionFieldNameField\"\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            </fd-quick-view-group-item>\n        </fd-quick-view-group>\n    </fd-quick-view>\n</ng-template>\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.ContentComponent\"\n        [mo]=\"mo\"\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    <fd-card-header\n        *ngIf=\"\n            isCheckList ||\n            deviceName !== 'desktop' ||\n            (contextMenuItems && contextMenuItems.length > 0 && !contextMenuInFooter)\n        \"\n    >\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                <fd-checkbox\n                    *ngIf=\"isCheckList\"\n                    [name]=\"mo.$Caption\"\n                    [ngModel]=\"isChecked\"\n                    (ngModelChange)=\"onRowCheck()\"\n                ></fd-checkbox>\n                <div\n                    *ngIf=\"!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\"\n                    ulvContextMenu\n                    [allColumns]=\"allColumns\"\n                    [menuItems]=\"contextMenuItems\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></div>\n            </div>\n            <ng-container *ngIf=\"canView\">\n                <button\n                    fd-button\n                    class=\"view-btn\"\n                    (click)=\"onRowClick()\"\n                    [glyph]=\"navigationArrow\"\n                    fdType=\"transparent\"\n                ></button>\n            </ng-container>\n        </div>\n    </fd-card-header>\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        [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 fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.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", "column", "index", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$5.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]" }, { kind: "component", type: i4.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { kind: "component", type: i9.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i9.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i9.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i9.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i9.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i9.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i9.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i9.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i9.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", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "rtl", "deviceName", "deviceSize"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "mo", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+CardItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, usesInheritance: true, ngImport: i0, template: "<fd-card\n    cardType=\"quickView\"\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    <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify *ngIf=\"!noContent || contextMenuItems\">\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [mo]=\"mo\" [hostEl]=\"divEl\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplate;\n                    context: {\n                        $implicit: mo,\n                        index: this.index\n                    }\n                \"\n            ></ng-container>\n        </div>\n        <ng-container *ngIf=\"contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\">\n            <div\n                ulvContextMenu\n                [allColumns]=\"allColumns\"\n                [footerMode]=\"true\"\n                [menuItems]=\"contextMenuItems\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [mo]=\"mo\"\n                (commandClick)=\"onUlvCommand()\"\n            ></div>\n        </ng-container>\n    </fd-card-content>\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n    ><div\n        *ngIf=\"column\"\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [mo]=\"mo\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\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()\"\n            (keyup.esc)=\"onEditFormPanelCancel()\"\n            (keydown.Tab)=\"onTabKeyDown()\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n    <fd-quick-view [id]=\"'id'\" *ngIf=\"!noContent\">\n        <fd-quick-view-group>\n            <fd-quick-view-subheader\n                *ngIf=\"setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField\"\n            >\n                <fd-avatar\n                    *ngIf=\"setting.AvatarField || setting.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]=\"avatarSize ? avatarSize : deviceSize === 's' ? 's' : 'm'\"\n                    [glyph]=\"\n                        setting.Avatar ||\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n                <fd-quick-view-subheader-title *ngIf=\"setting.TitleField\">\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                <fd-quick-view-subheader-subtitle *ngIf=\"setting.SubtitleField\">\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            </fd-quick-view-subheader>\n            <fd-quick-view-group-item *ngFor=\"let column of setting.FieldListMapped\">\n                <ng-container *ngIf=\"column\">\n                    <fd-quick-view-group-item-label>\n                        {{ column.Caption }}\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                </ng-container>\n            </fd-quick-view-group-item>\n            <fd-quick-view-group-item>\n                <fd-quick-view-group-item-content *ngIf=\"setting.DescriptionField\">\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                <fd-quick-view-group-item-content\n                    class=\"action\"\n                    *ngIf=\"setting.ActionFieldNameField\"\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            </fd-quick-view-group-item>\n        </fd-quick-view-group>\n    </fd-quick-view>\n</ng-template>\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.ContentComponent\"\n        [mo]=\"mo\"\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    <fd-card-header\n        *ngIf=\"\n            isCheckList ||\n            deviceName !== 'desktop' ||\n            (contextMenuItems && contextMenuItems.length > 0 && !contextMenuInFooter)\n        \"\n    >\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                <fd-checkbox\n                    *ngIf=\"isCheckList\"\n                    [name]=\"mo.$Caption\"\n                    [ngModel]=\"isChecked\"\n                    (ngModelChange)=\"onRowCheck()\"\n                ></fd-checkbox>\n                <div\n                    *ngIf=\"!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\"\n                    ulvContextMenu\n                    [allColumns]=\"allColumns\"\n                    [menuItems]=\"contextMenuItems\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></div>\n            </div>\n            <ng-container *ngIf=\"canView\">\n                <button\n                    fd-button\n                    class=\"view-btn\"\n                    (click)=\"onRowClick()\"\n                    [glyph]=\"navigationArrow\"\n                    fdType=\"transparent\"\n                ></button>\n            </ng-container>\n        </div>\n    </fd-card-header>\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        [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 fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.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", "column", "index", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$2.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]" }, { kind: "component", type: i4.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { kind: "component", type: i9.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i9.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i9.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i9.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i9.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i9.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i9.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i9.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i9.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", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "rtl", "deviceName", "deviceSize"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "mo", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: CardItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-card-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-card\n    cardType=\"quickView\"\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    <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify *ngIf=\"!noContent || contextMenuItems\">\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [mo]=\"mo\" [hostEl]=\"divEl\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplate;\n                    context: {\n                        $implicit: mo,\n                        index: this.index\n                    }\n                \"\n            ></ng-container>\n        </div>\n        <ng-container *ngIf=\"contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\">\n            <div\n                ulvContextMenu\n                [allColumns]=\"allColumns\"\n                [footerMode]=\"true\"\n                [menuItems]=\"contextMenuItems\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [mo]=\"mo\"\n                (commandClick)=\"onUlvCommand()\"\n            ></div>\n        </ng-container>\n    </fd-card-content>\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n    ><div\n        *ngIf=\"column\"\n        #divEl\n        [applyConditionalFormats]=\"conditionalFormats\"\n        [mo]=\"mo\"\n        [hostEl]=\"divEl\"\n        [dbName]=\"column.Name\"\n    >\n        <bsu-column-renderer\n            [mo]=\"mo\"\n            [column]=\"column\"\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()\"\n            (keyup.esc)=\"onEditFormPanelCancel()\"\n            (keydown.Tab)=\"onTabKeyDown()\"\n            [formLayoutShowLabel]=\"true\"\n        ></bsu-column-renderer>\n    </div>\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n    <fd-quick-view [id]=\"'id'\" *ngIf=\"!noContent\">\n        <fd-quick-view-group>\n            <fd-quick-view-subheader\n                *ngIf=\"setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField\"\n            >\n                <fd-avatar\n                    *ngIf=\"setting.AvatarField || setting.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]=\"avatarSize ? avatarSize : deviceSize === 's' ? 's' : 'm'\"\n                    [glyph]=\"\n                        setting.Avatar ||\n                        (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n                    \"\n                >\n                </fd-avatar>\n                <fd-quick-view-subheader-title *ngIf=\"setting.TitleField\">\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                <fd-quick-view-subheader-subtitle *ngIf=\"setting.SubtitleField\">\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            </fd-quick-view-subheader>\n            <fd-quick-view-group-item *ngFor=\"let column of setting.FieldListMapped\">\n                <ng-container *ngIf=\"column\">\n                    <fd-quick-view-group-item-label>\n                        {{ column.Caption }}\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                </ng-container>\n            </fd-quick-view-group-item>\n            <fd-quick-view-group-item>\n                <fd-quick-view-group-item-content *ngIf=\"setting.DescriptionField\">\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                <fd-quick-view-group-item-content\n                    class=\"action\"\n                    *ngIf=\"setting.ActionFieldNameField\"\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            </fd-quick-view-group-item>\n        </fd-quick-view-group>\n    </fd-quick-view>\n</ng-template>\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n    <bnrc-dynamic-item-component\n        [component]=\"setting.ContentComponent\"\n        [mo]=\"mo\"\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    <fd-card-header\n        *ngIf=\"\n            isCheckList ||\n            deviceName !== 'desktop' ||\n            (contextMenuItems && contextMenuItems.length > 0 && !contextMenuInFooter)\n        \"\n    >\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                <fd-checkbox\n                    *ngIf=\"isCheckList\"\n                    [name]=\"mo.$Caption\"\n                    [ngModel]=\"isChecked\"\n                    (ngModelChange)=\"onRowCheck()\"\n                ></fd-checkbox>\n                <div\n                    *ngIf=\"!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0\"\n                    ulvContextMenu\n                    [allColumns]=\"allColumns\"\n                    [menuItems]=\"contextMenuItems\"\n                    [conditionalFormats]=\"conditionalFormats\"\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                    [mo]=\"mo\"\n                    (commandClick)=\"onUlvCommand()\"\n                ></div>\n            </div>\n            <ng-container *ngIf=\"canView\">\n                <button\n                    fd-button\n                    class=\"view-btn\"\n                    (click)=\"onRowClick()\"\n                    [glyph]=\"navigationArrow\"\n                    fdType=\"transparent\"\n                ></button>\n            </ng-container>\n        </div>\n    </fd-card-header>\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        [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 fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-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"] }]
@@ -4668,7 +4682,7 @@ class BarsaTableRowComponent extends BaseViewItemPropsComponent {
     }
 }
 BarsaTableRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaTableRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-BarsaTableRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", detailsComponent: "detailsComponent", detailsColumns: "detailsColumns", detailsText: "detailsText", columnComponents: "columnComponents" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<tr\n    [class.row-error]=\"hasError\"\n    [class.showdetails-on]=\"!detailsCollapsed\"\n    #trEl\n    *ngIf=\"(!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [activable]=\"false\"\n    [hoverable]=\"false\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage\"\n>\n    <ng-container *ngIf=\"mo.$Group || mo.$Group === ''; else renderRow\">\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            [attr.colspan]=\"canView ? columnsCount + 1 : columnsCount\"\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    </ng-container>\n    <ng-template #renderRow>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n        </td>\n        <td\n            fd-table-cell\n            class=\"single-select\"\n            *ngIf=\"!isCheckList\"\n            (click)=\"onRowCheck()\"\n            style=\"padding: 0; text-align: center\"\n        >\n            <ng-container\n                *ngIf=\"inlineEditMode && allowInlineEdit && (hasError || saving || saved); else iconStateTemplate\"\n            >\n                <fd-icon *ngIf=\"hasError\" class=\"save-error\" glyph=\"error\"></fd-icon>\n                <fd-busy-indicator\n                    *ngIf=\"saving\"\n                    [loading]=\"true\"\n                    [size]=\"'s'\"\n                    title=\"record saving\"\n                ></fd-busy-indicator>\n                <fd-icon *ngIf=\"saved\" class=\"save-success\" glyph=\"accept\"></fd-icon>\n            </ng-container>\n            <ng-template #iconStateTemplate>\n                <fd-icon *ngIf=\"mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></fd-icon>\n                <fd-icon *ngIf=\"inlineEditMode && allowInlineEdit && isChecked\" glyph=\"edit\"></fd-icon>\n            </ng-template>\n        </td>\n        <td\n            #tdEl\n            *ngFor=\"let column of columns; let columnIndex = index; trackBy: _trackByColumn\"\n            fd-table-cell\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"tdEl\"\n            [mo]=\"mo\"\n            [dbName]=\"column.Name\"\n            [focusable]=\"false\"\n            (click)=\"onRowCheck()\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </td>\n        <td\n            class=\"col-context-menu\"\n            *ngIf=\"contextMenuItems?.length && (!inlineEditMode || !allowInlineEdit)\"\n            fd-table-cell\n        >\n            <bsu-ulv-context-menu\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [conditionalFormats]=\"conditionalFormats\"\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        <td\n            class=\"col-details\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"showDetailsInRow && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                *ngIf=\"detailsComponent?.Selector || cartableParams?.moId\"\n                fd-button\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n                [fdType]=\"'transparent'\"\n                (click)=\"onRowDetails()\"\n            ></button>\n        </td>\n        <td\n            class=\"col-view\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"!hideOpenIcon && canView && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                fd-button\n                [glyph]=\"navigationArrow\"\n                [navigation]=\"true\"\n                [fdType]=\"'transparent'\"\n                role=\"presentation\"\n                (click)=\"onRowClick()\"\n            ></button>\n        </td>\n    </ng-template>\n</tr>\n\n<tr\n    #trEl\n    *ngIf=\"secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [secondary]=\"true\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <td fd-table-cell class=\"single-select\" *ngIf=\"!isCheckList\" (click)=\"onRowCheck()\"></td>\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\">\n        <p\n            #pEl\n            fd-table-text\n            *ngFor=\"let column of secondaryColumns; let columnIndex = index; trackBy: _trackByColumn\"\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"pEl\"\n            [mo]=\"mo\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr *ngIf=\"!detailsCollapsed && cartableParams?.moId\" fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                (click)=\"OnCartableFormClick($event)\"\n                class=\"cartable-template\"\n                [params]=\"cartableParams\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector; else detailsColumnsTemplate\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Parameters\"\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-container>\n    </td>\n</tr>\n<ng-template #detailsColumnsTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            detailsFormItems;\n            context: {\n                $implicit: detailsColumns,\n                mo: mo,\n                inlineEditMode: inlineEditMode,\n                isNewInlineMo: isNewInlineMo,\n                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template\n    #detailsFormItems\n    let-detailsColumns\n    let-mo=\"mo\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-isNewInlineMo=\"inline\"\n    let-layout$=\"layout$\"\n>\n    <div class=\"form-items\">\n        <div fd-form-item *ngFor=\"let column of detailsColumns; let columnIndex = index\">\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </div>\n    </div>\n</ng-template>\n<tr *ngIf=\"bruleActionMessage && inlineEditMode\" fd-table-row>\n    <td fd-table-cell [attr.colspan]=\"columns.length + 1\">\n        <fd-message-strip\n            *ngIf=\"bruleActionMessage.MessageType === 2\"\n            [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\"\n            [dismissible]=\"false\"\n        >\n            {{ bruleActionMessage.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\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    <div\n        [class.inlineEditMode]=\"inlineEditMode\"\n        style=\"display: flex; width: 100%\"\n        [style.column-gap]=\"column.$MergedFieldsToColumn?.length ? '0.2rem' : null\"\n    >\n        <ng-container *ngIf=\"column.$CustomComponent; else columnRendererTpl\">\n            <bnrc-dynamic-item-component\n                [component]=\"column.$CustomComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"column.$CustomComponent.Settings\"\n                [column]=\"column\"\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-container>\n        <ng-template #columnRendererTpl>\n            <bsu-column-renderer\n                [mo]=\"mo\"\n                [column]=\"column\"\n                [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n                [isChecked]=\"isChecked\"\n                [isNewInlineMo]=\"isNewInlineMo\"\n                [index]=\"index\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [formLayoutShowLabel]=\"false\"\n                [deviceSize]=\"deviceSize\"\n                [controlUi]=\"column.Caption | controlUi: layout94\"\n                (keyup.control.enter)=\"onEditFormPanelSave()\"\n                (keyup.esc)=\"onEditFormPanelCancel()\"\n                (keydown.Tab)=\"onTabKeyDown()\"\n            ></bsu-column-renderer>\n        </ng-template>\n\n        <ng-container *ngIf=\"isChecked && inlineEditMode && allowInlineEdit\">\n            <ng-container *ngFor=\"let fieldCaption of column.$MergedFieldsToColumn\">\n                <ng-container *ngIf=\"fieldCaption | controlUi: layout94 as layoutConfig\">\n                    <bsu-layout-control\n                        [caption]=\"fieldCaption\"\n                        [config]=\"layoutConfig\"\n                        [showLabel]=\"false\"\n                        [inlineEdit]=\"true\"\n                        (keyup.control.enter)=\"onEditFormPanelSave()\"\n                        (keyup.esc)=\"onEditFormPanelCancel()\"\n                        (keydown.Tab)=\"onTabKeyDown()\"\n                    ></bsu-layout-control>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}: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}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)}.showdetails-on td{border-bottom:none!important}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "column", "index", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i5$1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "directive", type: i8$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i8$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i8$1.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "RefreshLabel", "SetVisible"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "rtl", "deviceName", "deviceSize"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "mo", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BarsaTableRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", detailsComponent: "detailsComponent", detailsColumns: "detailsColumns", detailsText: "detailsText", columnComponents: "columnComponents" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<tr\n    [class.row-error]=\"hasError\"\n    [class.showdetails-on]=\"!detailsCollapsed\"\n    #trEl\n    *ngIf=\"(!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [activable]=\"false\"\n    [hoverable]=\"false\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage\"\n>\n    <ng-container *ngIf=\"mo.$Group || mo.$Group === ''; else renderRow\">\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            [attr.colspan]=\"canView ? columnsCount + 1 : columnsCount\"\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    </ng-container>\n    <ng-template #renderRow>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n        </td>\n        <td\n            fd-table-cell\n            class=\"single-select\"\n            *ngIf=\"!isCheckList\"\n            (click)=\"onRowCheck()\"\n            style=\"padding: 0; text-align: center\"\n        >\n            <ng-container\n                *ngIf=\"inlineEditMode && allowInlineEdit && (hasError || saving || saved); else iconStateTemplate\"\n            >\n                <fd-icon *ngIf=\"hasError\" class=\"save-error\" glyph=\"error\"></fd-icon>\n                <fd-busy-indicator\n                    *ngIf=\"saving\"\n                    [loading]=\"true\"\n                    [size]=\"'s'\"\n                    title=\"record saving\"\n                ></fd-busy-indicator>\n                <fd-icon *ngIf=\"saved\" class=\"save-success\" glyph=\"accept\"></fd-icon>\n            </ng-container>\n            <ng-template #iconStateTemplate>\n                <fd-icon *ngIf=\"mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></fd-icon>\n                <fd-icon *ngIf=\"inlineEditMode && allowInlineEdit && isChecked\" glyph=\"edit\"></fd-icon>\n            </ng-template>\n        </td>\n        <td\n            #tdEl\n            *ngFor=\"let column of columns; let columnIndex = index; trackBy: _trackByColumn\"\n            fd-table-cell\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"tdEl\"\n            [mo]=\"mo\"\n            [dbName]=\"column.Name\"\n            [focusable]=\"false\"\n            (click)=\"onRowCheck()\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </td>\n        <td\n            class=\"col-context-menu\"\n            *ngIf=\"contextMenuItems?.length && (!inlineEditMode || !allowInlineEdit)\"\n            fd-table-cell\n        >\n            <bsu-ulv-context-menu\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [conditionalFormats]=\"conditionalFormats\"\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        <td\n            class=\"col-details\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"showDetailsInRow && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                *ngIf=\"detailsComponent?.Selector || cartableParams?.moId\"\n                fd-button\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n                [fdType]=\"'transparent'\"\n                (click)=\"onRowDetails()\"\n            ></button>\n        </td>\n        <td\n            class=\"col-view\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"!hideOpenIcon && canView && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                fd-button\n                [glyph]=\"navigationArrow\"\n                [navigation]=\"true\"\n                [fdType]=\"'transparent'\"\n                role=\"presentation\"\n                (click)=\"onRowClick()\"\n            ></button>\n        </td>\n    </ng-template>\n</tr>\n\n<tr\n    #trEl\n    *ngIf=\"secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [secondary]=\"true\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <td fd-table-cell class=\"single-select\" *ngIf=\"!isCheckList\" (click)=\"onRowCheck()\"></td>\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\">\n        <p\n            #pEl\n            fd-table-text\n            *ngFor=\"let column of secondaryColumns; let columnIndex = index; trackBy: _trackByColumn\"\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"pEl\"\n            [mo]=\"mo\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr *ngIf=\"!detailsCollapsed && cartableParams?.moId\" fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                (click)=\"OnCartableFormClick($event)\"\n                class=\"cartable-template\"\n                [params]=\"cartableParams\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector; else detailsColumnsTemplate\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Parameters\"\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-container>\n    </td>\n</tr>\n<ng-template #detailsColumnsTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            detailsFormItems;\n            context: {\n                $implicit: detailsColumns,\n                mo: mo,\n                inlineEditMode: inlineEditMode,\n                isNewInlineMo: isNewInlineMo,\n                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template\n    #detailsFormItems\n    let-detailsColumns\n    let-mo=\"mo\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-isNewInlineMo=\"inline\"\n    let-layout$=\"layout$\"\n>\n    <div class=\"form-items\">\n        <div fd-form-item *ngFor=\"let column of detailsColumns; let columnIndex = index\">\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </div>\n    </div>\n</ng-template>\n<tr *ngIf=\"bruleActionMessage && inlineEditMode\" fd-table-row>\n    <td fd-table-cell [attr.colspan]=\"columns.length + 1\">\n        <fd-message-strip\n            *ngIf=\"bruleActionMessage.MessageType === 2\"\n            [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\"\n            [dismissible]=\"false\"\n        >\n            {{ bruleActionMessage.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\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    <div\n        [class.inlineEditMode]=\"inlineEditMode\"\n        style=\"display: flex; width: 100%\"\n        [style.column-gap]=\"column.$MergedFieldsToColumn?.length ? '0.2rem' : null\"\n    >\n        <ng-container *ngIf=\"column.$CustomComponent; else columnRendererTpl\">\n            <bnrc-dynamic-item-component\n                [component]=\"column.$CustomComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"column.$CustomComponent.Settings\"\n                [column]=\"column\"\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-container>\n        <ng-template #columnRendererTpl>\n            <bsu-column-renderer\n                [mo]=\"mo\"\n                [column]=\"column\"\n                [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n                [isChecked]=\"isChecked\"\n                [isNewInlineMo]=\"isNewInlineMo\"\n                [index]=\"index\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [formLayoutShowLabel]=\"false\"\n                [deviceSize]=\"deviceSize\"\n                [controlUi]=\"column.Caption | controlUi: layout94\"\n                (keyup.control.enter)=\"onEditFormPanelSave()\"\n                (keyup.esc)=\"onEditFormPanelCancel()\"\n                (keydown.Tab)=\"onTabKeyDown()\"\n            ></bsu-column-renderer>\n        </ng-template>\n\n        <ng-container *ngIf=\"isChecked && inlineEditMode && allowInlineEdit\">\n            <ng-container *ngFor=\"let fieldCaption of column.$MergedFieldsToColumn\">\n                <ng-container *ngIf=\"fieldCaption | controlUi: layout94 as layoutConfig\">\n                    <bsu-layout-control\n                        [caption]=\"fieldCaption\"\n                        [config]=\"layoutConfig\"\n                        [showLabel]=\"false\"\n                        [inlineEdit]=\"true\"\n                        (keyup.control.enter)=\"onEditFormPanelSave()\"\n                        (keyup.esc)=\"onEditFormPanelCancel()\"\n                        (keydown.Tab)=\"onTabKeyDown()\"\n                    ></bsu-layout-control>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}: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}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)}.showdetails-on td{border-bottom:none!important}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "column", "index", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i5$1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "directive", type: i8$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i8$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i8$1.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "rtl", "deviceName", "deviceSize"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "mo", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaTableRowComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-barsa-table-row', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<tr\n    [class.row-error]=\"hasError\"\n    [class.showdetails-on]=\"!detailsCollapsed\"\n    #trEl\n    *ngIf=\"(!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [activable]=\"false\"\n    [hoverable]=\"false\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage\"\n>\n    <ng-container *ngIf=\"mo.$Group || mo.$Group === ''; else renderRow\">\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            [attr.colspan]=\"canView ? columnsCount + 1 : columnsCount\"\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    </ng-container>\n    <ng-template #renderRow>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n        </td>\n        <td\n            fd-table-cell\n            class=\"single-select\"\n            *ngIf=\"!isCheckList\"\n            (click)=\"onRowCheck()\"\n            style=\"padding: 0; text-align: center\"\n        >\n            <ng-container\n                *ngIf=\"inlineEditMode && allowInlineEdit && (hasError || saving || saved); else iconStateTemplate\"\n            >\n                <fd-icon *ngIf=\"hasError\" class=\"save-error\" glyph=\"error\"></fd-icon>\n                <fd-busy-indicator\n                    *ngIf=\"saving\"\n                    [loading]=\"true\"\n                    [size]=\"'s'\"\n                    title=\"record saving\"\n                ></fd-busy-indicator>\n                <fd-icon *ngIf=\"saved\" class=\"save-success\" glyph=\"accept\"></fd-icon>\n            </ng-container>\n            <ng-template #iconStateTemplate>\n                <fd-icon *ngIf=\"mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></fd-icon>\n                <fd-icon *ngIf=\"inlineEditMode && allowInlineEdit && isChecked\" glyph=\"edit\"></fd-icon>\n            </ng-template>\n        </td>\n        <td\n            #tdEl\n            *ngFor=\"let column of columns; let columnIndex = index; trackBy: _trackByColumn\"\n            fd-table-cell\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"tdEl\"\n            [mo]=\"mo\"\n            [dbName]=\"column.Name\"\n            [focusable]=\"false\"\n            (click)=\"onRowCheck()\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </td>\n        <td\n            class=\"col-context-menu\"\n            *ngIf=\"contextMenuItems?.length && (!inlineEditMode || !allowInlineEdit)\"\n            fd-table-cell\n        >\n            <bsu-ulv-context-menu\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [conditionalFormats]=\"conditionalFormats\"\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        <td\n            class=\"col-details\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"showDetailsInRow && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                *ngIf=\"detailsComponent?.Selector || cartableParams?.moId\"\n                fd-button\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n                [fdType]=\"'transparent'\"\n                (click)=\"onRowDetails()\"\n            ></button>\n        </td>\n        <td\n            class=\"col-view\"\n            fd-table-cell\n            [fitContent]=\"true\"\n            *ngIf=\"!hideOpenIcon && canView && (!inlineEditMode || !allowInlineEdit)\"\n        >\n            <button\n                fd-button\n                [glyph]=\"navigationArrow\"\n                [navigation]=\"true\"\n                [fdType]=\"'transparent'\"\n                role=\"presentation\"\n                (click)=\"onRowClick()\"\n            ></button>\n        </td>\n    </ng-template>\n</tr>\n\n<tr\n    #trEl\n    *ngIf=\"secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false\"\n    fd-table-row\n    [secondary]=\"true\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [mo]=\"mo\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <td fd-table-cell class=\"single-select\" *ngIf=\"!isCheckList\" (click)=\"onRowCheck()\"></td>\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\">\n        <p\n            #pEl\n            fd-table-text\n            *ngFor=\"let column of secondaryColumns; let columnIndex = index; trackBy: _trackByColumn\"\n            [applyConditionalFormats]=\"conditionalFormats\"\n            [hostEl]=\"pEl\"\n            [mo]=\"mo\"\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr *ngIf=\"!detailsCollapsed && cartableParams?.moId\" fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\">\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                (click)=\"OnCartableFormClick($event)\"\n                class=\"cartable-template\"\n                [params]=\"cartableParams\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <td fd-table-cell (click)=\"onRowCheck()\"></td>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length + 1 + (contextMenuItems.length ? 1 : 0) + (canView ? 1 : 0) + (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector; else detailsColumnsTemplate\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Parameters\"\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-container>\n    </td>\n</tr>\n<ng-template #detailsColumnsTemplate>\n    <ng-container\n        *ngTemplateOutlet=\"\n            detailsFormItems;\n            context: {\n                $implicit: detailsColumns,\n                mo: mo,\n                inlineEditMode: inlineEditMode,\n                isNewInlineMo: isNewInlineMo,\n                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template\n    #detailsFormItems\n    let-detailsColumns\n    let-mo=\"mo\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-isNewInlineMo=\"inline\"\n    let-layout$=\"layout$\"\n>\n    <div class=\"form-items\">\n        <div fd-form-item *ngFor=\"let column of detailsColumns; let columnIndex = index\">\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 || isNewInlineMo,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </div>\n    </div>\n</ng-template>\n<tr *ngIf=\"bruleActionMessage && inlineEditMode\" fd-table-row>\n    <td fd-table-cell [attr.colspan]=\"columns.length + 1\">\n        <fd-message-strip\n            *ngIf=\"bruleActionMessage.MessageType === 2\"\n            [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\"\n            [dismissible]=\"false\"\n        >\n            {{ bruleActionMessage.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\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    <div\n        [class.inlineEditMode]=\"inlineEditMode\"\n        style=\"display: flex; width: 100%\"\n        [style.column-gap]=\"column.$MergedFieldsToColumn?.length ? '0.2rem' : null\"\n    >\n        <ng-container *ngIf=\"column.$CustomComponent; else columnRendererTpl\">\n            <bnrc-dynamic-item-component\n                [component]=\"column.$CustomComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"column.$CustomComponent.Settings\"\n                [column]=\"column\"\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-container>\n        <ng-template #columnRendererTpl>\n            <bsu-column-renderer\n                [mo]=\"mo\"\n                [column]=\"column\"\n                [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n                [isChecked]=\"isChecked\"\n                [isNewInlineMo]=\"isNewInlineMo\"\n                [index]=\"index\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [formLayoutShowLabel]=\"false\"\n                [deviceSize]=\"deviceSize\"\n                [controlUi]=\"column.Caption | controlUi: layout94\"\n                (keyup.control.enter)=\"onEditFormPanelSave()\"\n                (keyup.esc)=\"onEditFormPanelCancel()\"\n                (keydown.Tab)=\"onTabKeyDown()\"\n            ></bsu-column-renderer>\n        </ng-template>\n\n        <ng-container *ngIf=\"isChecked && inlineEditMode && allowInlineEdit\">\n            <ng-container *ngFor=\"let fieldCaption of column.$MergedFieldsToColumn\">\n                <ng-container *ngIf=\"fieldCaption | controlUi: layout94 as layoutConfig\">\n                    <bsu-layout-control\n                        [caption]=\"fieldCaption\"\n                        [config]=\"layoutConfig\"\n                        [showLabel]=\"false\"\n                        [inlineEdit]=\"true\"\n                        (keyup.control.enter)=\"onEditFormPanelSave()\"\n                        (keyup.esc)=\"onEditFormPanelCancel()\"\n                        (keydown.Tab)=\"onTabKeyDown()\"\n                    ></bsu-layout-control>\n                </ng-container>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}: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}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)}.showdetails-on td{border-bottom:none!important}.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}\n"] }]
@@ -4788,7 +4802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 args: ['style.height.px']
             }] } });
 
-class UlNotifyPopupComponent extends BaseComponent$1 {
+class UlNotifyPopupComponent extends BaseComponent {
     constructor(_notificationService, el, renderer, domSanitizer) {
         super();
         this._notificationService = _notificationService;
@@ -4812,7 +4826,7 @@ class UlNotifyPopupComponent extends BaseComponent$1 {
             Width: 800,
             MessageHeight: 60
         };
-        BarsaApi$1.Ul.NotifyPopup.on({
+        BarsaApi.Ul.NotifyPopup.on({
             Show: this._showPopup.bind(this)
         });
     }
@@ -4852,14 +4866,14 @@ class UlNotifyPopupComponent extends BaseComponent$1 {
         let callback = () => { };
         if (mo) {
             callback = () => {
-                BarsaApi$1.Bw.Form.Show({
+                BarsaApi.Bw.Form.Show({
                     Mo: mo
                 });
             };
         }
         else if (otherOptions) {
             callback = () => {
-                BarsaApi$1.Bw.Form.Show({
+                BarsaApi.Bw.Form.Show({
                     MoId: otherOptions.MoId,
                     TypeDefId: otherOptions.TypeDefId
                 });
@@ -4885,7 +4899,7 @@ class UlNotifyPopupComponent extends BaseComponent$1 {
     }
 }
 UlNotifyPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UlNotifyPopupComponent, deps: [{ token: i1$1.NotificationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i2$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-UlNotifyPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UlNotifyPopupComponent, selector: "bsu-ul-notify-popup", viewQueries: [{ propertyName: "popupTemplate", first: true, predicate: ["popup"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-notification #popup>\r\n    <fd-notification-body [dir]=\"notification.data?.isRtl ? 'rtl' : 'ltr'\" (click)=\"notification.data?.callback()\">\r\n        <fd-avatar [circle]=\"true\" size=\"xs\" [image]=\"notification.data?.image\"></fd-avatar>\r\n        <fd-notification-content>\r\n            <fd-notification-header>\r\n                <div fd-notification-indicator type=\"success\"></div>\r\n                <h2 fd-notification-title [unread]=\"true\">\r\n                    {{ notification.data?.title }}\r\n                </h2>\r\n            </fd-notification-header>\r\n\r\n            <p fd-notification-paragraph [innerHtml]=\"notification.data?.msg\"></p>\r\n        </fd-notification-content>\r\n\r\n        <fd-notification-actions>\r\n            <button\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                glyph=\"decline\"\r\n                title=\"close\"\r\n                [compact]=\"true\"\r\n                (click)=\"notification.close()\"\r\n            ></button>\r\n        </fd-notification-actions>\r\n    </fd-notification-body>\r\n</ng-template>\r\n", styles: ["fd-notification-body{overflow-y:hidden}:host ::ng-deep .unset-positions{top:unset!important;left:unset!important;right:unset!important;bottom:unset!important}:host ::ng-deep .top-left{top:5rem!important;left:2rem!important}:host ::ng-deep .top-right{top:5rem!important;right:2rem!important}:host ::ng-deep .bottom-left{bottom:2rem!important;left:2rem!important}:host ::ng-deep .bottom-right{bottom:2rem!important;right:2rem!important}:host ::ng-deep .center-top{top:5rem!important;right:50%!important}:host ::ng-deep .center-bottom{bottom:2rem!important;right:50%!important}\n"], dependencies: [{ kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$1.DeprecatedButtonContentDensityDirective, selector: "[fd-button][compact]" }, { kind: "component", type: i5$2.NotificationHeaderComponent, selector: "fd-notification-header", inputs: ["uniqueId"] }, { kind: "component", type: i5$2.NotificationBodyComponent, selector: "fd-notification-body" }, { kind: "component", type: i5$2.NotificationActionsComponent, selector: "fd-notification-actions" }, { kind: "component", type: i5$2.NotificationContentComponent, selector: "fd-notification-content" }, { kind: "directive", type: i5$2.NotificationTitleDirective, selector: "[fdNotificationTitle], [fd-notification-title]", inputs: ["unread"] }, { kind: "directive", type: i5$2.NotificationIndicatorDirective, selector: "[fdNotificationIndicator], [fd-notification-indicator]", inputs: ["type", "class"] }, { kind: "directive", type: i5$2.NotificationParagraphDirective, selector: "[fdNotificationParagraph], [fd-notification-paragraph]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UlNotifyPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UlNotifyPopupComponent, selector: "bsu-ul-notify-popup", viewQueries: [{ propertyName: "popupTemplate", first: true, predicate: ["popup"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-notification #popup>\r\n    <fd-notification-body [dir]=\"notification.data?.isRtl ? 'rtl' : 'ltr'\" (click)=\"notification.data?.callback()\">\r\n        <fd-avatar [circle]=\"true\" size=\"xs\" [image]=\"notification.data?.image\"></fd-avatar>\r\n        <fd-notification-content>\r\n            <fd-notification-header>\r\n                <div fd-notification-indicator type=\"success\"></div>\r\n                <h2 fd-notification-title [unread]=\"true\">\r\n                    {{ notification.data?.title }}\r\n                </h2>\r\n            </fd-notification-header>\r\n\r\n            <p fd-notification-paragraph [innerHtml]=\"notification.data?.msg\"></p>\r\n        </fd-notification-content>\r\n\r\n        <fd-notification-actions>\r\n            <button\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                glyph=\"decline\"\r\n                title=\"close\"\r\n                [compact]=\"true\"\r\n                (click)=\"notification.close()\"\r\n            ></button>\r\n        </fd-notification-actions>\r\n    </fd-notification-body>\r\n</ng-template>\r\n", styles: ["fd-notification-body{overflow-y:hidden}:host ::ng-deep .unset-positions{top:unset!important;left:unset!important;right:unset!important;bottom:unset!important}:host ::ng-deep .top-left{top:5rem!important;left:2rem!important}:host ::ng-deep .top-right{top:5rem!important;right:2rem!important}:host ::ng-deep .bottom-left{bottom:2rem!important;left:2rem!important}:host ::ng-deep .bottom-right{bottom:2rem!important;right:2rem!important}:host ::ng-deep .center-top{top:5rem!important;right:50%!important}:host ::ng-deep .center-bottom{bottom:2rem!important;right:50%!important}\n"], dependencies: [{ kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$1.DeprecatedButtonContentDensityDirective, selector: "[fd-button][compact]" }, { kind: "component", type: i5$3.NotificationHeaderComponent, selector: "fd-notification-header", inputs: ["uniqueId"] }, { kind: "component", type: i5$3.NotificationBodyComponent, selector: "fd-notification-body" }, { kind: "component", type: i5$3.NotificationActionsComponent, selector: "fd-notification-actions" }, { kind: "component", type: i5$3.NotificationContentComponent, selector: "fd-notification-content" }, { kind: "directive", type: i5$3.NotificationTitleDirective, selector: "[fdNotificationTitle], [fd-notification-title]", inputs: ["unread"] }, { kind: "directive", type: i5$3.NotificationIndicatorDirective, selector: "[fdNotificationIndicator], [fd-notification-indicator]", inputs: ["type", "class"] }, { kind: "directive", type: i5$3.NotificationParagraphDirective, selector: "[fdNotificationParagraph], [fd-notification-paragraph]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UlNotifyPopupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-ul-notify-popup', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template let-notification #popup>\r\n    <fd-notification-body [dir]=\"notification.data?.isRtl ? 'rtl' : 'ltr'\" (click)=\"notification.data?.callback()\">\r\n        <fd-avatar [circle]=\"true\" size=\"xs\" [image]=\"notification.data?.image\"></fd-avatar>\r\n        <fd-notification-content>\r\n            <fd-notification-header>\r\n                <div fd-notification-indicator type=\"success\"></div>\r\n                <h2 fd-notification-title [unread]=\"true\">\r\n                    {{ notification.data?.title }}\r\n                </h2>\r\n            </fd-notification-header>\r\n\r\n            <p fd-notification-paragraph [innerHtml]=\"notification.data?.msg\"></p>\r\n        </fd-notification-content>\r\n\r\n        <fd-notification-actions>\r\n            <button\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                glyph=\"decline\"\r\n                title=\"close\"\r\n                [compact]=\"true\"\r\n                (click)=\"notification.close()\"\r\n            ></button>\r\n        </fd-notification-actions>\r\n    </fd-notification-body>\r\n</ng-template>\r\n", styles: ["fd-notification-body{overflow-y:hidden}:host ::ng-deep .unset-positions{top:unset!important;left:unset!important;right:unset!important;bottom:unset!important}:host ::ng-deep .top-left{top:5rem!important;left:2rem!important}:host ::ng-deep .top-right{top:5rem!important;right:2rem!important}:host ::ng-deep .bottom-left{bottom:2rem!important;left:2rem!important}:host ::ng-deep .bottom-right{bottom:2rem!important;right:2rem!important}:host ::ng-deep .center-top{top:5rem!important;right:50%!important}:host ::ng-deep .center-bottom{bottom:2rem!important;right:50%!important}\n"] }]
@@ -4895,21 +4909,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
             }] } });
 
 function getDateService(logService) {
-    const culture = BarsaApi$1.LoginFormData.Culture;
+    const culture = BarsaApi.LoginFormData.Culture;
     switch (culture) {
         case 'fa-IR':
-            return new DateShamsiService$1(logService);
+            return new DateShamsiService(logService);
         case 'ar-AE':
-            return new DateHijriService$1(logService);
+            return new DateHijriService(logService);
         default:
-            return new DateMiladiService$1(logService);
+            return new DateMiladiService(logService);
     }
 }
-class UiDateRangeExComponent extends FieldBaseComponent$1 {
+class UiDateRangeExComponent extends FieldBaseComponent {
     constructor() {
         super(...arguments);
         this.valueStr = '';
-        this.value = new BarsaApi$1.Common.DateRangeData();
+        this.value = new BarsaApi.Common.DateRangeData();
         this.dateRanges = DateRanges;
     }
     get _isValidPopover() {
@@ -5000,45 +5014,45 @@ class UiDateRangeExComponent extends FieldBaseComponent$1 {
                 this.valueStr = this._getNextYear();
                 break;
             default:
-                this.valueStr = BarsaApi$1.BBB.DateR_None;
+                this.valueStr = BarsaApi.BBB.DateR_None;
                 this._decorateDateRangePicker();
         }
     }
     _getToday() {
-        return BarsaApi$1.BBB.DateR_Today + ': ' + this._dateService.getDayStr('Today');
+        return BarsaApi.BBB.DateR_Today + ': ' + this._dateService.getDayStr('Today');
     }
     _getThisWeek() {
-        return BarsaApi$1.BBB.DateR_ThisWeek + ': ' + this._dateService.getWeekStr('ThisWeek');
+        return BarsaApi.BBB.DateR_ThisWeek + ': ' + this._dateService.getWeekStr('ThisWeek');
     }
     _getThisMonth() {
-        return BarsaApi$1.BBB.DateR_ThisMonth + ': ' + this._dateService.getMonthStr('ThisMonth');
+        return BarsaApi.BBB.DateR_ThisMonth + ': ' + this._dateService.getMonthStr('ThisMonth');
     }
     _getThisYear() {
-        return BarsaApi$1.BBB.DateR_ThisYear + ': ' + this._dateService.getYearStr('ThisYear');
+        return BarsaApi.BBB.DateR_ThisYear + ': ' + this._dateService.getYearStr('ThisYear');
     }
     _getDaysBefore() {
-        return BarsaApi$1.BBB.DateR_DaysBefore + ': ' + this._dateService.getDayStr('DaysBefore');
+        return BarsaApi.BBB.DateR_DaysBefore + ': ' + this._dateService.getDayStr('DaysBefore');
     }
     _getPrevWeek() {
-        return BarsaApi$1.BBB.DateR_PrevWeek + ': ' + this._dateService.getWeekStr('PrevWeek');
+        return BarsaApi.BBB.DateR_PrevWeek + ': ' + this._dateService.getWeekStr('PrevWeek');
     }
     _getPrevMonth() {
-        return BarsaApi$1.BBB.DateR_PrevMonth + ': ' + this._dateService.getMonthStr('PrevMonth');
+        return BarsaApi.BBB.DateR_PrevMonth + ': ' + this._dateService.getMonthStr('PrevMonth');
     }
     _getPrevYear() {
-        return BarsaApi$1.BBB.DateR_PrevYear + ': ' + this._dateService.getYearStr('PrevYear');
+        return BarsaApi.BBB.DateR_PrevYear + ': ' + this._dateService.getYearStr('PrevYear');
     }
     _getDaysAfter() {
-        return BarsaApi$1.BBB.DateR_DaysAfter + ': ' + this._dateService.getDayStr('DaysAfter');
+        return BarsaApi.BBB.DateR_DaysAfter + ': ' + this._dateService.getDayStr('DaysAfter');
     }
     _getNextWeek() {
-        return BarsaApi$1.BBB.DateR_NextWeek + ': ' + this._dateService.getWeekStr('NextWeek');
+        return BarsaApi.BBB.DateR_NextWeek + ': ' + this._dateService.getWeekStr('NextWeek');
     }
     _getNextMonth() {
-        return BarsaApi$1.BBB.DateR_NextMonth + ': ' + this._dateService.getMonthStr('NextMonth');
+        return BarsaApi.BBB.DateR_NextMonth + ': ' + this._dateService.getMonthStr('NextMonth');
     }
     _getNextYear() {
-        return BarsaApi$1.BBB.DateR_NextYear + ': ' + this._dateService.getYearStr('NextYear');
+        return BarsaApi.BBB.DateR_NextYear + ': ' + this._dateService.getYearStr('NextYear');
     }
     _decorateDateRangePicker() {
         setTimeout(() => {
@@ -5054,7 +5068,7 @@ class UiDateRangeExComponent extends FieldBaseComponent$1 {
 UiDateRangeExComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiDateRangeExComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
 UiDateRangeExComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiDateRangeExComponent, selector: "bsu-ui-date-range-ex", providers: [
         {
-            provide: DateService$1,
+            provide: DateService,
             useFactory: getDateService,
             deps: [LogService]
         }
@@ -5063,7 +5077,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
             type: Component,
             args: [{ selector: 'bsu-ui-date-range-ex', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
-                            provide: DateService$1,
+                            provide: DateService,
                             useFactory: getDateService,
                             deps: [LogService]
                         }
@@ -5352,7 +5366,7 @@ class ReportNavigatorComponent extends BaseComponent {
         };
     }
 }
-ReportNavigatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ReportNavigatorComponent, deps: [{ token: i3$6.ActivatedRoute }, { token: i2.PortalService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ReportNavigatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ReportNavigatorComponent, deps: [{ token: i3$5.ActivatedRoute }, { token: i2.PortalService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 ReportNavigatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ReportNavigatorComponent, selector: "bsu-report-navigator", viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: `<ng-container #containerRef></ng-container>
         <bsu-mask *ngIf="(loading$ | async) === true"></bsu-mask> `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ReportNavigatorComponent, decorators: [{
@@ -5363,7 +5377,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
         <bsu-mask *ngIf="(loading$ | async) === true"></bsu-mask> `,
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }], ctorParameters: function () { return [{ type: i3$6.ActivatedRoute }, { type: i2.PortalService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { containerRef: [{
+        }], ctorParameters: function () { return [{ type: i3$5.ActivatedRoute }, { type: i2.PortalService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { containerRef: [{
                 type: ViewChild,
                 args: ['containerRef', { static: true, read: ViewContainerRef }]
             }] } });
@@ -5443,12 +5457,12 @@ class BreadcrumbComponent extends BaseComponent {
         }
     }
 }
-BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i3$6.Router }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: { breadCrumb: "breadCrumb", allBreadCrumb: "allBreadCrumb", isLast: "isLast", index: "index" }, usesInheritance: true, ngImport: i0, template: "<a *ngIf=\"!isLast\" fd-breadcrumb-link (click)=\"onBreadcrumb()\">{{ breadCrumb.label | bbbTranslate }}</a>\n<span *ngIf=\"isLast\">{{ breadCrumb.label | bbbTranslate }}</span>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$5.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i3$5.Router }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: { breadCrumb: "breadCrumb", allBreadCrumb: "allBreadCrumb", isLast: "isLast", index: "index" }, usesInheritance: true, ngImport: i0, template: "<a *ngIf=\"!isLast\" fd-breadcrumb-link (click)=\"onBreadcrumb()\">{{ breadCrumb.label | bbbTranslate }}</a>\n<span *ngIf=\"isLast\">{{ breadCrumb.label | bbbTranslate }}</span>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$2.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<a *ngIf=\"!isLast\" fd-breadcrumb-link (click)=\"onBreadcrumb()\">{{ breadCrumb.label | bbbTranslate }}</a>\n<span *ngIf=\"isLast\">{{ breadCrumb.label | bbbTranslate }}</span>\n" }]
-        }], ctorParameters: function () { return [{ type: i3$6.Router }]; }, propDecorators: { breadCrumb: [{
+        }], ctorParameters: function () { return [{ type: i3$5.Router }]; }, propDecorators: { breadCrumb: [{
                 type: Input
             }], allBreadCrumb: [{
                 type: Input
@@ -5812,12 +5826,12 @@ class UiUlvMainUiComponent extends BaseComponent {
         });
     }
 }
-UiUlvMainUiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiUlvMainUiComponent, deps: [{ token: i1$1.DialogService }, { token: i2.UlvMainService }, { token: i0.ElementRef }, { token: i3$6.Router }, { token: i2.PortalService }, { token: i0.ChangeDetectorRef }, { token: i1$1.ContentDensityService }, { token: i2.BreadcrumbService }], target: i0.ɵɵFactoryTarget.Component });
+UiUlvMainUiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiUlvMainUiComponent, deps: [{ token: i1$1.DialogService }, { token: i2.UlvMainService }, { token: i0.ElementRef }, { token: i3$5.Router }, { token: i2.PortalService }, { token: i0.ChangeDetectorRef }, { token: i1$1.ContentDensityService }, { token: i2.BreadcrumbService }], target: i0.ɵɵFactoryTarget.Component });
 UiUlvMainUiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: { context: "context", isReportPage: "isReportPage", inDialog: "inDialog", layoutInfo: "layoutInfo", fullscreen: "fullscreen" }, host: { properties: { "class.control-readonly": "this.readonly", "class.control-disabled": "this.disable", "class.margin-ulv": "this.marginUlv" } }, providers: [UlvMainService], viewQueries: [{ propertyName: "searchPanelComponent", first: true, predicate: SearchPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bsu-barsa-ulv-main\n    [attr.isReportPage]=\"isReportPage\"\n    [viewerControl]=\"viewer$ | async\"\n    [loading]=\"(mask$ | async) === true\"\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\n    [isReportPage]=\"isReportPage\"\n    [deviceSize]=\"(deviceSize$ | async)!!\"\n    [title]=\"title\"\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\n    [rtl]=\"(rtl$ | async)!!\"\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\n    [context]=\"context\"\n    [contentDensity]=\"contentDensity$ | async\"\n    (close)=\"onClose()\"\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\n    (openManageFilters)=\"onOpenManageFilters()\"\n    (collapsedChange)=\"onCollapsedChange($event)\"\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\n    (filterSave)=\"onFilterSave()\"\n    (filterSaveAs)=\"onFilterSaveAs()\"\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\n    (manageFilters)=\"onManageFilters()\"\n    (clearSearch)=\"onClearSearch()\"\n    (search)=\"onSearch()\"\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\n>\n</bsu-barsa-ulv-main>\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;cursor:default}:host ::ng-deep bsu-barsa-ulv-main[isReportPage=true] bsu-barsa-asp-viewer{height:100vh!important}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"], dependencies: [{ kind: "component", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: ["viewerControl", "loading", "viewerLoading", "isReportPage", "deviceSize", "title", "searchPanelUi", "breadCrumbs", "allSearchPanelSettings", "isAnonymous", "rtl", "selectedSearchPanelSettings", "searchPanelMoChanged", "selectedSearchPanelSettingsId", "hideSearchPanel", "pagingSetting", "contentDensity", "context"], outputs: ["close", "searchPanelMoChange", "openManageFilters", "collapsedChange", "hideSearchPanelClick", "filterSave", "filterSaveAs", "showFilterFieldsSetting", "manageFilters", "clearSearch", "search", "selectSearchPanelSettings"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiUlvMainUiComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-ui-ulv-main-ui', providers: [UlvMainService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<bsu-barsa-ulv-main\n    [attr.isReportPage]=\"isReportPage\"\n    [viewerControl]=\"viewer$ | async\"\n    [loading]=\"(mask$ | async) === true\"\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\n    [isReportPage]=\"isReportPage\"\n    [deviceSize]=\"(deviceSize$ | async)!!\"\n    [title]=\"title\"\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\n    [rtl]=\"(rtl$ | async)!!\"\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\n    [context]=\"context\"\n    [contentDensity]=\"contentDensity$ | async\"\n    (close)=\"onClose()\"\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\n    (openManageFilters)=\"onOpenManageFilters()\"\n    (collapsedChange)=\"onCollapsedChange($event)\"\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\n    (filterSave)=\"onFilterSave()\"\n    (filterSaveAs)=\"onFilterSaveAs()\"\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\n    (manageFilters)=\"onManageFilters()\"\n    (clearSearch)=\"onClearSearch()\"\n    (search)=\"onSearch()\"\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\n>\n</bsu-barsa-ulv-main>\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;cursor:default}:host ::ng-deep bsu-barsa-ulv-main[isReportPage=true] bsu-barsa-asp-viewer{height:100vh!important}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.DialogService }, { type: i2.UlvMainService }, { type: i0.ElementRef }, { type: i3$6.Router }, { type: i2.PortalService }, { type: i0.ChangeDetectorRef }, { type: i1$1.ContentDensityService }, { type: i2.BreadcrumbService }]; }, propDecorators: { context: [{
+        }], ctorParameters: function () { return [{ type: i1$1.DialogService }, { type: i2.UlvMainService }, { type: i0.ElementRef }, { type: i3$5.Router }, { type: i2.PortalService }, { type: i0.ChangeDetectorRef }, { type: i1$1.ContentDensityService }, { type: i2.BreadcrumbService }]; }, propDecorators: { context: [{
                 type: Input
             }], isReportPage: [{
                 type: Input
@@ -5874,10 +5888,10 @@ class UiColorUiComponent extends FieldBaseComponent {
     }
 }
 UiColorUiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiColorUiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-UiColorUiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiColorUiComponent, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"readonly$ | async; else editable\" class=\"read-only\">\r\n    <div [style.background-color]=\"value\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n\r\n<ng-template #editable>\r\n    <fd-popover #popover>\r\n        <fd-popover-control>\r\n            <button [style.background-color]=\"value\" fd-button></button>\r\n        </fd-popover-control>\r\n\r\n        <fd-popover-body>\r\n            <color-chrome\r\n                *ngIf=\"!isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                className=\"color-box\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-chrome>\r\n            <color-swatches\r\n                *ngIf=\"isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-swatches>\r\n            <fd-toolbar style=\"background-color: white\">\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Ok' | bbbTranslate\"\r\n                    (click)=\"onApply(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"switchText\"\r\n                    (click)=\"onSwatchClick()\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [".read-only{display:flex;justify-content:start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$1.DeprecatedButtonContentDensityDirective, selector: "[fd-button][compact]" }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i7$1.ToolbarSpacerComponent, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i5$3.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i6$5.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i7$5.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UiColorUiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiColorUiComponent, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"readonly$ | async; else editable\" class=\"read-only\">\r\n    <div [style.background-color]=\"value\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n\r\n<ng-template #editable>\r\n    <fd-popover #popover>\r\n        <fd-popover-control>\r\n            <button [style.background-color]=\"value\" fd-button></button>\r\n        </fd-popover-control>\r\n\r\n        <fd-popover-body>\r\n            <color-chrome\r\n                *ngIf=\"!isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                className=\"color-box\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-chrome>\r\n            <color-swatches\r\n                *ngIf=\"isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-swatches>\r\n            <fd-toolbar style=\"background-color: white\">\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Ok' | bbbTranslate\"\r\n                    (click)=\"onApply(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"switchText\"\r\n                    (click)=\"onSwatchClick()\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [".read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$1.DeprecatedButtonContentDensityDirective, selector: "[fd-button][compact]" }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i7$1.ToolbarSpacerComponent, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i5$4.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i6$5.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i7$5.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiColorUiComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-color-ui', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"readonly$ | async; else editable\" class=\"read-only\">\r\n    <div [style.background-color]=\"value\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n\r\n<ng-template #editable>\r\n    <fd-popover #popover>\r\n        <fd-popover-control>\r\n            <button [style.background-color]=\"value\" fd-button></button>\r\n        </fd-popover-control>\r\n\r\n        <fd-popover-body>\r\n            <color-chrome\r\n                *ngIf=\"!isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                className=\"color-box\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-chrome>\r\n            <color-swatches\r\n                *ngIf=\"isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-swatches>\r\n            <fd-toolbar style=\"background-color: white\">\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Ok' | bbbTranslate\"\r\n                    (click)=\"onApply(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"switchText\"\r\n                    (click)=\"onSwatchClick()\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [".read-only{display:flex;justify-content:start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"] }]
+            args: [{ selector: 'bsu-ui-color-ui', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"readonly$ | async; else editable\" class=\"read-only\">\r\n    <div [style.background-color]=\"value\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n\r\n<ng-template #editable>\r\n    <fd-popover #popover>\r\n        <fd-popover-control>\r\n            <button [style.background-color]=\"value\" fd-button></button>\r\n        </fd-popover-control>\r\n\r\n        <fd-popover-body>\r\n            <color-chrome\r\n                *ngIf=\"!isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                className=\"color-box\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-chrome>\r\n            <color-swatches\r\n                *ngIf=\"isVisibleSwatches\"\r\n                [color]=\"value\"\r\n                (colorChange)=\"onColorChang($event)\"\r\n            ></color-swatches>\r\n            <fd-toolbar style=\"background-color: white\">\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"'Ok' | bbbTranslate\"\r\n                    (click)=\"onApply(popover)\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n                <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                <button\r\n                    fd-toolbar-item\r\n                    fd-button\r\n                    [label]=\"switchText\"\r\n                    (click)=\"onSwatchClick()\"\r\n                    [compact]=\"true\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [".read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"] }]
         }] });
 
 class BarsaDateTimePickerComponent extends FieldBaseComponent {
@@ -6759,7 +6773,7 @@ class UiFileLinearListBoxComponent extends DeviceInfoFieldBaseComponent {
     }
 }
 UiFileLinearListBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiFileLinearListBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-UiFileLinearListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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: "<ng-container *ngIf=\"value\">\n    <div class=\"token-container\">\n        <div class=\"token-wrapper\">\n            <ng-container *ngFor=\"let file of value; trackBy: trackById\">\n                <fd-popover *ngIf=\"!file.IsDeleted\">\n                    <fd-popover-control>\n                        <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\n                            >{{ file.FileName }}\n                            <ng-container *ngIf=\"file.IsNew\">\n                                <span\n                                    *ngIf=\"valueExtra[file.Id].UploadState !== 'Complete'\"\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                                <fd-object-number\n                                    *ngIf=\"valueExtra[file.Id].Progress\"\n                                    [number]=\"valueExtra[file.Id].Progress || 0\"\n                                    unit=\"%\"\n                                    status=\"informative\"\n                                ></fd-object-number>\n\n                                <ng-container *ngIf=\"valueExtra[file.Id].UploadState === 'Uploading'\">\n                                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\n                                </ng-container>\n                            </ng-container>\n                        </fd-token>\n                    </fd-popover-control>\n                    <fd-popover-body>\n                        <ul\n                            fd-list\n                            *ngIf=\"\n                                valueExtra[file.Id].UploadState !== 'Error' ||\n                                valueExtra[file.Id].UploadState === 'Complete'\n                            \"\n                        >\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                    </fd-popover-body>\n                </fd-popover>\n            </ng-container>\n            <div style=\"display: flex\">\n                <div style=\"position: relative; width: 3rem\" *ngIf=\"loading\">\n                    <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\n                </div>\n                <fd-file-uploader\n                    *ngIf=\"value | canUploadFile: maxFileCount:(disable$ | async)!!:(readonly$ | async)!!\"\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            </div>\n        </div>\n    </div>\n</ng-container>\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}.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: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i4$6.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: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "class", "role"] }, { kind: "directive", type: i6.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "component", type: i5$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i6$6.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i10.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "pipe", type: i1.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 });
+UiFileLinearListBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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: "<ng-container *ngIf=\"value\">\n    <div class=\"token-container\">\n        <div class=\"token-wrapper\">\n            <ng-container *ngFor=\"let file of value; trackBy: trackById\">\n                <fd-popover *ngIf=\"!file.IsDeleted\">\n                    <fd-popover-control>\n                        <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\n                            >{{ file.FileName }}\n                            <ng-container *ngIf=\"file.IsNew\">\n                                <span\n                                    *ngIf=\"valueExtra[file.Id].UploadState !== 'Complete'\"\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                                <fd-object-number\n                                    *ngIf=\"valueExtra[file.Id].Progress\"\n                                    [number]=\"valueExtra[file.Id].Progress || 0\"\n                                    unit=\"%\"\n                                    status=\"informative\"\n                                ></fd-object-number>\n\n                                <ng-container *ngIf=\"valueExtra[file.Id].UploadState === 'Uploading'\">\n                                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\n                                </ng-container>\n                            </ng-container>\n                        </fd-token>\n                    </fd-popover-control>\n                    <fd-popover-body>\n                        <ul\n                            fd-list\n                            *ngIf=\"\n                                valueExtra[file.Id].UploadState !== 'Error' ||\n                                valueExtra[file.Id].UploadState === 'Complete'\n                            \"\n                        >\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                    </fd-popover-body>\n                </fd-popover>\n            </ng-container>\n            <div style=\"display: flex\">\n                <div style=\"position: relative; width: 3rem\" *ngIf=\"loading\">\n                    <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\n                </div>\n                <fd-file-uploader\n                    *ngIf=\"value | canUploadFile: maxFileCount:(disable$ | async)!!:(readonly$ | async)!!\"\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            </div>\n        </div>\n    </div>\n</ng-container>\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}.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: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i4$6.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: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "class", "role"] }, { kind: "directive", type: i6.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "component", type: i5$5.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i6$6.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i10.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "pipe", type: i1.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: "14.2.7", ngImport: i0, type: UiFileLinearListBoxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-ui-file-linear-list-box', providers: [UploadService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"value\">\n    <div class=\"token-container\">\n        <div class=\"token-wrapper\">\n            <ng-container *ngFor=\"let file of value; trackBy: trackById\">\n                <fd-popover *ngIf=\"!file.IsDeleted\">\n                    <fd-popover-control>\n                        <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\n                            >{{ file.FileName }}\n                            <ng-container *ngIf=\"file.IsNew\">\n                                <span\n                                    *ngIf=\"valueExtra[file.Id].UploadState !== 'Complete'\"\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                                <fd-object-number\n                                    *ngIf=\"valueExtra[file.Id].Progress\"\n                                    [number]=\"valueExtra[file.Id].Progress || 0\"\n                                    unit=\"%\"\n                                    status=\"informative\"\n                                ></fd-object-number>\n\n                                <ng-container *ngIf=\"valueExtra[file.Id].UploadState === 'Uploading'\">\n                                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\n                                </ng-container>\n                            </ng-container>\n                        </fd-token>\n                    </fd-popover-control>\n                    <fd-popover-body>\n                        <ul\n                            fd-list\n                            *ngIf=\"\n                                valueExtra[file.Id].UploadState !== 'Error' ||\n                                valueExtra[file.Id].UploadState === 'Complete'\n                            \"\n                        >\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                    </fd-popover-body>\n                </fd-popover>\n            </ng-container>\n            <div style=\"display: flex\">\n                <div style=\"position: relative; width: 3rem\" *ngIf=\"loading\">\n                    <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\n                </div>\n                <fd-file-uploader\n                    *ngIf=\"value | canUploadFile: maxFileCount:(disable$ | async)!!:(readonly$ | async)!!\"\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            </div>\n        </div>\n    </div>\n</ng-container>\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}.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"] }]
@@ -7047,10 +7061,10 @@ class LyLayoutContainerComponent extends LayoutPanelBaseComponent {
     }
 }
 LyLayoutContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyLayoutContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LyLayoutContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyLayoutContainerComponent, selector: "bsu-ly-layout-container", inputs: { renderItems: "renderItems", isRoot: "isRoot", SetVisible: "SetVisible", SetEnable: "SetEnable", SetReadonly: "SetReadonly" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.display": "this.display", "style.flex": "this.flex" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\r\n<ng-container *ngFor=\"let item of config | filterToolbarControl\">\r\n    <ng-container [ngSwitch]=\"item.xtype\">\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: {\r\n                        $implicit: item,\r\n                        name: 'LyLayoutContainerComponent',\r\n                        selector: 'bsu-ly-layout-container'\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\r\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        dynamicLayout;\r\n                        context: {\r\n                            $implicit: item,\r\n                            selector: 'bsu-ly-horizontal-layout',\r\n                            name: 'LyLayoutHorizontalComponent'\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n            </ng-container>\r\n            <ng-template #verticalJoin>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        dynamicLayout;\r\n                        context: {\r\n                            $implicit: item,\r\n                            selector: 'bsu-ly-vertical-layout',\r\n                            name: 'LyLayoutVerticalComponent'\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: {\r\n                        $implicit: item,\r\n                        selector: 'bsu-layout-control',\r\n                        name: 'LayoutControlComponent'\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-container>\r\n<ng-template #dynamicLayout let-config let-selector=\"selector\"  let-name=\"name\">\r\n\r\n    <bnrc-dynamic-layout\r\n        [config]=\"config\"\r\n        [selector]=\"selector\"\r\n        [name]=\"name\"\r\n        [module]=\"'BarsaSapUi'\"\r\n        [moduleFileName]=\"'BarsaSapUi'\"\r\n        [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n        [isSearchPanel]=\"isSearchPanel\"\r\n    >\r\n    </bnrc-dynamic-layout>\r\n</ng-template>\r\n\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyLayoutContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyLayoutContainerComponent, selector: "bsu-ly-layout-container", inputs: { renderItems: "renderItems", isRoot: "isRoot", SetVisible: "SetVisible", SetEnable: "SetEnable", SetReadonly: "SetReadonly" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.display": "this.display", "style.flex": "this.flex" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\n<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\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</ng-template>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyLayoutContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-layout-container', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\r\n<ng-container *ngFor=\"let item of config | filterToolbarControl\">\r\n    <ng-container [ngSwitch]=\"item.xtype\">\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: {\r\n                        $implicit: item,\r\n                        name: 'LyLayoutContainerComponent',\r\n                        selector: 'bsu-ly-layout-container'\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\r\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        dynamicLayout;\r\n                        context: {\r\n                            $implicit: item,\r\n                            selector: 'bsu-ly-horizontal-layout',\r\n                            name: 'LyLayoutHorizontalComponent'\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n            </ng-container>\r\n            <ng-template #verticalJoin>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        dynamicLayout;\r\n                        context: {\r\n                            $implicit: item,\r\n                            selector: 'bsu-ly-vertical-layout',\r\n                            name: 'LyLayoutVerticalComponent'\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    dynamicLayout;\r\n                    context: {\r\n                        $implicit: item,\r\n                        selector: 'bsu-layout-control',\r\n                        name: 'LayoutControlComponent'\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-container>\r\n<ng-template #dynamicLayout let-config let-selector=\"selector\"  let-name=\"name\">\r\n\r\n    <bnrc-dynamic-layout\r\n        [config]=\"config\"\r\n        [selector]=\"selector\"\r\n        [name]=\"name\"\r\n        [module]=\"'BarsaSapUi'\"\r\n        [moduleFileName]=\"'BarsaSapUi'\"\r\n        [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n        [isSearchPanel]=\"isSearchPanel\"\r\n    >\r\n    </bnrc-dynamic-layout>\r\n</ng-template>\r\n\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}\n"] }]
+            args: [{ selector: 'bsu-ly-layout-container', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\n<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\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</ng-template>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}\n"] }]
         }], propDecorators: { renderItems: [{
                 type: Input
             }], isRoot: [{
@@ -7140,10 +7154,10 @@ class LyTabPageComponent extends LayoutPanelBaseComponent {
     }
 }
 LyTabPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyTabPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LyTabPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: { renderItems: "renderItems", tablist: "tablist" }, host: { properties: { "style.flex": "this.flex" } }, providers: [LayoutService], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef }, { propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\n\n<ng-container *untilInView=\"el\">\n    <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n        <ng-container [ngSwitch]=\"item.xtype\">\n            <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            name: 'LyLayoutContainerComponent',\n                            selector: 'bsu-ly-layout-container'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-horizontal-layout',\n                                name: 'LyLayoutHorizontalComponent'                                \n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                </ng-container>\n                <ng-template #verticalJoin>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-vertical-layout',\n                                name: 'LyLayoutVerticalComponent'                                \n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-layout-control',\n                            name: 'LayoutControlComponent'                            \n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n        <bnrc-dynamic-layout\n            [config]=\"config\"\n            [selector]=\"selector\"\n            [name]=\"name\"\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    </ng-template>\n</ng-container>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyTabPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: { renderItems: "renderItems", tablist: "tablist" }, host: { properties: { "style.flex": "this.flex" } }, providers: [LayoutService], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef }, { propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\n\n<ng-container *untilInView=\"el\">\n    <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n        <ng-container [ngSwitch]=\"item.xtype\">\n            <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            name: 'LyLayoutContainerComponent',\n                            selector: 'bsu-ly-layout-container'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-horizontal-layout',\n                                name: 'LyLayoutHorizontalComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                </ng-container>\n                <ng-template #verticalJoin>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-vertical-layout',\n                                name: 'LyLayoutVerticalComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-layout-control',\n                            name: 'LayoutControlComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n        <bnrc-dynamic-layout\n            [config]=\"config\"\n            [selector]=\"selector\"\n            [name]=\"name\"\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    </ng-template>\n</ng-container>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyTabPageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-tab-page', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\n\n<ng-container *untilInView=\"el\">\n    <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n        <ng-container [ngSwitch]=\"item.xtype\">\n            <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            name: 'LyLayoutContainerComponent',\n                            selector: 'bsu-ly-layout-container'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-horizontal-layout',\n                                name: 'LyLayoutHorizontalComponent'                                \n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                </ng-container>\n                <ng-template #verticalJoin>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-vertical-layout',\n                                name: 'LyLayoutVerticalComponent'                                \n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-layout-control',\n                            name: 'LayoutControlComponent'                            \n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n        <bnrc-dynamic-layout\n            [config]=\"config\"\n            [selector]=\"selector\"\n            [name]=\"name\"\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    </ng-template>\n</ng-container>\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'bsu-ly-tab-page', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\n\n<ng-container *untilInView=\"el\">\n    <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n        <ng-container [ngSwitch]=\"item.xtype\">\n            <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            name: 'LyLayoutContainerComponent',\n                            selector: 'bsu-ly-layout-container'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-horizontal-layout',\n                                name: 'LyLayoutHorizontalComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                </ng-container>\n                <ng-template #verticalJoin>\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-ly-vertical-layout',\n                                name: 'LyLayoutVerticalComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                </ng-template>\n            </ng-container>\n            <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-layout-control',\n                            name: 'LayoutControlComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n        <bnrc-dynamic-layout\n            [config]=\"config\"\n            [selector]=\"selector\"\n            [name]=\"name\"\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    </ng-template>\n</ng-container>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { vcr: [{
                 type: ViewChild,
                 args: ['placeholder', { read: ViewContainerRef }]
@@ -7206,7 +7220,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
     onDynamicComponentEvents(e) { }
 }
 FundamentalDynamicFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FundamentalDynamicFormComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-FundamentalDynamicFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", modernTabs: "modernTabs" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"mask\" style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [subtitle]=\"subtitle | bbbTranslate\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        #titleRef\r\n    >\r\n        <fd-breadcrumb>\r\n            <ng-container *ngIf=\"breadCrumbs\">\r\n                <ng-container\r\n                    *ngFor=\"let breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; let i = index; let last = last\"\r\n                >\r\n                    <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                </ng-container>\r\n            </ng-container>\r\n        </fd-breadcrumb>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n            <fd-toolbar\r\n                *ngIf=\"toolbarVisible\"\r\n                fdType=\"transparent\"\r\n                [clearBorder]=\"true\"\r\n                [shouldOverflow]=\"deviceSize === 's'\"\r\n            >\r\n                <ng-container *ngFor=\"let btn of toolbarItems; let i = index; let last = last; let first = first\">\r\n                    <fd-toolbar-separator\r\n                        [attr.i]=\"i\"\r\n                        [attr.last]=\"last\"\r\n                        [attr.first]=\"first\"\r\n                        *ngIf=\"(btn === '-' || btn.text === '-') && !last && !first\"\r\n                    ></fd-toolbar-separator>\r\n                    <ng-container *ngIf=\"btn.IAmMenu; else simpleButton\">\r\n                        <fd-split-button\r\n                            [dir]=\"dirValue\"\r\n                            [compact]=\"contentDensity === 'compact' ? true : false\"\r\n                            fd-toolbar-item\r\n                            [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\r\n                            [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                            [glyph]=\"(btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon) || 'slim-arrow-down'\"\r\n                            (click)=\"menu.open()\"\r\n                        >\r\n                            <fd-menu #menu>\r\n                                <li\r\n                                    fd-menu-item\r\n                                    *ngFor=\"let menuItem of btn.menu.items\"\r\n                                    [disabled]=\"menuItem.disabled\"\r\n                                    (click)=\"onToolbarClick(menuItem, menu)\"\r\n                                >\r\n                                    <div fd-menu-interactive>\r\n                                        <fd-menu-addon\r\n                                            position=\"before\"\r\n                                            [glyph]=\"\r\n                                                menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\r\n                                            \"\r\n                                        >\r\n                                        </fd-menu-addon>\r\n                                        <img class=\"mr8\" *ngIf=\"menuItem.icon\" [src]=\"menuItem.icon\" />\r\n                                        <span fd-menu-title>{{ menuItem.text }}</span>\r\n                                    </div>\r\n                                </li>\r\n                            </fd-menu>\r\n                        </fd-split-button>\r\n                    </ng-container>\r\n                    <ng-template #simpleButton>\r\n                        <ng-container *ngIf=\"!(btn === '-' || btn.text === '-')\">\r\n                            <ng-container\r\n                                *ngTemplateOutlet=\"\r\n                                    btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                                    context: { $implicit: btn }\r\n                                \"\r\n                            ></ng-container>\r\n                            <ng-template #btnTemplate let-btn>\r\n                                <button\r\n                                    fd-toolbar-item\r\n                                    fd-button\r\n                                    [disabled]=\"btn.disabled\"\r\n                                    [buttonType]=\"\r\n                                        btn.isWorkflow\r\n                                            ? 'positive'\r\n                                            : btn.design\r\n                                            ? btn.design\r\n                                            : btn.Data?.JsonExtraProp?.Design\r\n                                    \"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                                    (click)=\"onToolbarClick(btn)\"\r\n                                >\r\n                                    <img\r\n                                        *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                        width=\"16\"\r\n                                        [src]=\"btn.icon\"\r\n                                    />\r\n                                    <span>{{ btn.text }}</span>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #dynamicBtnTemplate let-btn>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"onToolbarClick(btn)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </ng-template>\r\n                        </ng-container>\r\n                        <!-- <button\r\n                            *ngIf=\"!(btn === '-' || btn.text === '-')\"\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [buttonType]=\"\r\n                                btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\r\n                            \"\r\n                            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                            (click)=\"onToolbarClick(btn)\"\r\n                        >\r\n                            <img\r\n                                *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                width=\"16\"\r\n                                [src]=\"btn.icon\"\r\n                            />\r\n                            <span>{{ btn.text }}</span>\r\n                        </button> -->\r\n                    </ng-template>\r\n                </ng-container>\r\n            </fd-toolbar>\r\n            <!-- <bsu-ui-form-panel-toolbar\r\n        [buttons]=\"toolbarItems | tlbButtons: 'inFooter':false\"\r\n        [size]=\"size\"\r\n        [deviceSize]=\"deviceSize$ | async\"\r\n        [visible]=\"toolbarVisible\"\r\n        (toolClick)=\"onToolbarClick($event)\"\r\n      ></bsu-ui-form-panel-toolbar> -->\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            <fd-toolbar *ngIf=\"!hideClose\" fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n                    <i class=\"sap-icon--decline\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    <fd-dynamic-page-subheader\r\n        *ngIf=\"description || facetList.length > 0 || workflowInfoText\"\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin\"\r\n        [collapsible]=\"!!workflowInfoText || (facetList && facetList.length > 0)\"\r\n        [pinnable]=\"true\"\r\n        [collapsed]=\"(!facetList || facetList.length === 0) && !workflowInfoText\"\r\n    >\r\n        <fd-message-strip [type]=\"'warning'\" *ngIf=\"workflowInfoText\" [dismissible]=\"false\">\r\n            {{ workflowInfoText | bbbTranslate }}\r\n        </fd-message-strip>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            <fd-facet *ngIf=\"avatar\" type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                    class=\"fd-avatar fd-avatar--circle\"\r\n                    [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                >\r\n                    <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            <fd-facet\r\n                *ngFor=\"let facet of facetList\"\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                <fd-facet-content *ngFor=\"let item of facet.mo.ItemList?.MoDataList\">\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                <span\r\n                    *ngIf=\"\r\n                        !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector;\r\n                        else dynamicComponentTpl\r\n                    \"\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                <ng-template #dynamicComponentTpl>\r\n                    <bnrc-dynamic-component\r\n                        [class]=\"'fd-object-status--' + facet.mo.Status | facetValue\"\r\n                        [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                        [component]=\"facet.mo.Component\"\r\n                        [value]=\"facet.mo.Text\"\r\n                    ></bnrc-dynamic-component>\r\n                </ng-template>\r\n                <fd-object-number\r\n                    *ngIf=\"facet.mo.IsNumber && facet.type === 'key-value'\"\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.Decimal | facetValue\"\r\n                ></fd-object-number>\r\n\r\n                <div *ngIf=\"facet.type === 'plain-text'\" [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n\r\n                <fd-facet-content *ngIf=\"facet.type === 'rating-indicator'\">\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo.Value | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                <div *ngIf=\"facet.type === 'progress'\" [style.width]=\"'10rem'\">\r\n                    <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span>\r\n                    <fd-progress-indicator\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"'1 \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\r\n                        [valueNow]=\"facet.mo.Value | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                        style=\"width: 10rem\"\r\n                        [valueState]=\"facet.mo.State\"\r\n                        [value]=\"getNumber(facet.mo.Value)\"\r\n                    ></ui5-progress-indicator> -->\r\n                </div>\r\n                <div *ngIf=\"facet.type === 'microcharts'\">\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n            </fd-facet>\r\n        </fd-facet-group>\r\n        <span *ngIf=\"description\">{{ description }}</span>\r\n    </fd-dynamic-page-subheader>\r\n\r\n    <fd-tab-list\r\n        (selectedTabChange)=\"onTabChanged($event)\"\r\n        *ngIf=\"!contentIsPage && modernTabs && modernTabs.length > 0 && !parameters?.LayoutComponent; else renderLayout\"\r\n        [collapseOverflow]=\"true\"\r\n        [stackContent]=\"false\"\r\n        maxContentHeight=\"auto\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        #tablist\r\n    >\r\n        <fd-tab\r\n            *ngFor=\"let tab of modernTabs; let i = index\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [selected]=\"true\"\r\n            style=\"height: 100%\"\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\">\r\n                <bsu-ly-tab-page [config]=\"tab\" [tablist]=\"tablist\"></bsu-ly-tab-page>\r\n            </fd-dynamic-page-content>\r\n        </fd-tab>\r\n    </fd-tab-list>\r\n    <ng-template #renderLayout>\r\n        <fd-dynamic-page-content [class.no-padding]=\"removeContentPadding\" *ngIf=\"!contentIsPage\">\r\n            <!-- <bsu-ly-layout-container-of-root\r\n            [config]=\"layout94\"\r\n            [isPanel]=\"false\"\r\n            [isRoot]=\"true\"\r\n        ></bsu-ly-layout-container-of-root> -->\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                    context: {\r\n                        $implicit: parameters?.LayoutComponent,\r\n                        layout94: layout94\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n    </ng-template>\r\n    <fd-dynamic-page-footer>\r\n        <bsu-layout-actions\r\n            [canSend]=\"canSend\"\r\n            [buttons]=\"layoutActions\"\r\n            [workflowButtons]=\"workflowButtons\"\r\n            [workflowButtonsComboMode]=\"workflowButtonsComboMode\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [rtl]=\"rtl\"\r\n            (toolClick)=\"onToolbarClick($event)\"\r\n            (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n        >\r\n        </bsu-layout-actions>\r\n    </fd-dynamic-page-footer>\r\n</fd-dynamic-page>\r\n<ng-container *ngIf=\"contentIsPage\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderLayoutComponent;\r\n            context: {\r\n                $implicit: parameters?.LayoutComponent,\r\n                layout94: layout94\r\n            }\r\n        \"\r\n    ></ng-container>\r\n</ng-container>\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n", 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}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.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: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["containerElement", "reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$4.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["role", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i6$4.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "subtitle"] }, { kind: "component", type: i6$4.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i6$4.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i6$4.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "role", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i6$4.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i6$4.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i7$7.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "id", "alignEnd"] }, { kind: "component", type: i7$7.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i7$7.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i6$2.MenuInteractiveDirective, 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", "glyph", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "component", type: i5$4.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i6$6.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { kind: "component", type: i13.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i4$3.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "disabled", "mainActionTitle", "fdType", "expandButtonAriaLabel", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "directive", type: i4$3.DeprecatedSplitButtonCompactDirective, selector: "fd-split-button[compact]" }, { kind: "component", type: i15.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i15.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i16.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "moreLabel", "lessLabel", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i7$1.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i18.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", "marginTop"] }, { 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: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FundamentalDynamicFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", modernTabs: "modernTabs" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"mask\" style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [subtitle]=\"subtitle | bbbTranslate\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        #titleRef\r\n    >\r\n        <fd-breadcrumb>\r\n            <ng-container *ngIf=\"breadCrumbs\">\r\n                <ng-container\r\n                    *ngFor=\"let breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; let i = index; let last = last\"\r\n                >\r\n                    <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                </ng-container>\r\n            </ng-container>\r\n        </fd-breadcrumb>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n            <fd-toolbar\r\n                *ngIf=\"toolbarVisible\"\r\n                fdType=\"transparent\"\r\n                [clearBorder]=\"true\"\r\n                [shouldOverflow]=\"deviceSize === 's'\"\r\n            >\r\n                <ng-container *ngFor=\"let btn of toolbarItems; let i = index; let last = last; let first = first\">\r\n                    <fd-toolbar-separator\r\n                        [attr.i]=\"i\"\r\n                        [attr.last]=\"last\"\r\n                        [attr.first]=\"first\"\r\n                        *ngIf=\"(btn === '-' || btn.text === '-') && !last && !first\"\r\n                    ></fd-toolbar-separator>\r\n                    <ng-container *ngIf=\"btn.IAmMenu; else simpleButton\">\r\n                        <fd-split-button\r\n                            [dir]=\"dirValue\"\r\n                            [compact]=\"contentDensity === 'compact' ? true : false\"\r\n                            fd-toolbar-item\r\n                            [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\r\n                            [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                            [glyph]=\"(btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon) || 'slim-arrow-down'\"\r\n                            (click)=\"menu.open()\"\r\n                        >\r\n                            <fd-menu #menu>\r\n                                <li\r\n                                    fd-menu-item\r\n                                    *ngFor=\"let menuItem of btn.menu.items\"\r\n                                    [disabled]=\"menuItem.disabled\"\r\n                                    (click)=\"onToolbarClick(menuItem, menu)\"\r\n                                >\r\n                                    <div fd-menu-interactive>\r\n                                        <fd-menu-addon\r\n                                            position=\"before\"\r\n                                            [glyph]=\"\r\n                                                menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\r\n                                            \"\r\n                                        >\r\n                                        </fd-menu-addon>\r\n                                        <img class=\"mr8\" *ngIf=\"menuItem.icon\" [src]=\"menuItem.icon\" />\r\n                                        <span fd-menu-title>{{ menuItem.text }}</span>\r\n                                    </div>\r\n                                </li>\r\n                            </fd-menu>\r\n                        </fd-split-button>\r\n                    </ng-container>\r\n                    <ng-template #simpleButton>\r\n                        <ng-container *ngIf=\"!(btn === '-' || btn.text === '-')\">\r\n                            <ng-container\r\n                                *ngTemplateOutlet=\"\r\n                                    btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                                    context: { $implicit: btn }\r\n                                \"\r\n                            ></ng-container>\r\n                            <ng-template #btnTemplate let-btn>\r\n                                <button\r\n                                    fd-toolbar-item\r\n                                    fd-button\r\n                                    [disabled]=\"btn.disabled\"\r\n                                    [buttonType]=\"\r\n                                        btn.isWorkflow\r\n                                            ? 'positive'\r\n                                            : btn.design\r\n                                            ? btn.design\r\n                                            : btn.Data?.JsonExtraProp?.Design\r\n                                    \"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                                    (click)=\"onToolbarClick(btn)\"\r\n                                >\r\n                                    <img\r\n                                        *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                        width=\"16\"\r\n                                        [src]=\"btn.icon\"\r\n                                    />\r\n                                    <span>{{ btn.text }}</span>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #dynamicBtnTemplate let-btn>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"onToolbarClick(btn)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </ng-template>\r\n                        </ng-container>\r\n                        <!-- <button\r\n                            *ngIf=\"!(btn === '-' || btn.text === '-')\"\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [buttonType]=\"\r\n                                btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\r\n                            \"\r\n                            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                            (click)=\"onToolbarClick(btn)\"\r\n                        >\r\n                            <img\r\n                                *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                width=\"16\"\r\n                                [src]=\"btn.icon\"\r\n                            />\r\n                            <span>{{ btn.text }}</span>\r\n                        </button> -->\r\n                    </ng-template>\r\n                </ng-container>\r\n            </fd-toolbar>\r\n            <!-- <bsu-ui-form-panel-toolbar\r\n        [buttons]=\"toolbarItems | tlbButtons: 'inFooter':false\"\r\n        [size]=\"size\"\r\n        [deviceSize]=\"deviceSize$ | async\"\r\n        [visible]=\"toolbarVisible\"\r\n        (toolClick)=\"onToolbarClick($event)\"\r\n      ></bsu-ui-form-panel-toolbar> -->\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            <fd-toolbar *ngIf=\"!hideClose\" fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n                    <i class=\"sap-icon--decline\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    <fd-dynamic-page-subheader\r\n        *ngIf=\"description || facetList.length > 0 || workflowInfoText\"\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin\"\r\n        [collapsible]=\"!!workflowInfoText || (facetList && facetList.length > 0)\"\r\n        [pinnable]=\"true\"\r\n        [collapsed]=\"(!facetList || facetList.length === 0) && !workflowInfoText\"\r\n    >\r\n        <fd-message-strip [type]=\"'warning'\" *ngIf=\"workflowInfoText\" [dismissible]=\"false\">\r\n            {{ workflowInfoText | bbbTranslate }}\r\n        </fd-message-strip>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            <fd-facet *ngIf=\"avatar\" type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                    class=\"fd-avatar fd-avatar--circle\"\r\n                    [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                >\r\n                    <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            <fd-facet\r\n                *ngFor=\"let facet of facetList\"\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                <fd-facet-content *ngFor=\"let item of facet.mo.ItemList?.MoDataList\">\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                <span\r\n                    *ngIf=\"\r\n                        !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector;\r\n                        else dynamicComponentTpl\r\n                    \"\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                <ng-template #dynamicComponentTpl>\r\n                    <bnrc-dynamic-component\r\n                        [class]=\"'fd-object-status--' + facet.mo.Status | facetValue\"\r\n                        [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                        [component]=\"facet.mo.Component\"\r\n                        [value]=\"facet.mo.Text\"\r\n                    ></bnrc-dynamic-component>\r\n                </ng-template>\r\n                <fd-object-number\r\n                    *ngIf=\"facet.mo.IsNumber && facet.type === 'key-value'\"\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.Decimal | facetValue\"\r\n                ></fd-object-number>\r\n\r\n                <div *ngIf=\"facet.type === 'plain-text'\" [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n\r\n                <fd-facet-content *ngIf=\"facet.type === 'rating-indicator'\">\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo.Value | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                <div *ngIf=\"facet.type === 'progress'\" [style.width]=\"'10rem'\">\r\n                    <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span>\r\n                    <fd-progress-indicator\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"'1 \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\r\n                        [valueNow]=\"facet.mo.Value | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                        style=\"width: 10rem\"\r\n                        [valueState]=\"facet.mo.State\"\r\n                        [value]=\"getNumber(facet.mo.Value)\"\r\n                    ></ui5-progress-indicator> -->\r\n                </div>\r\n                <div *ngIf=\"facet.type === 'microcharts'\">\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n            </fd-facet>\r\n        </fd-facet-group>\r\n        <span *ngIf=\"description\">{{ description }}</span>\r\n    </fd-dynamic-page-subheader>\r\n\r\n    <fd-tab-list\r\n        (selectedTabChange)=\"onTabChanged($event)\"\r\n        *ngIf=\"!contentIsPage && modernTabs && modernTabs.length > 0 && !parameters?.LayoutComponent; else renderLayout\"\r\n        [collapseOverflow]=\"true\"\r\n        [stackContent]=\"false\"\r\n        maxContentHeight=\"auto\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        #tablist\r\n    >\r\n        <fd-tab\r\n            *ngFor=\"let tab of modernTabs; let i = index\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [selected]=\"true\"\r\n            style=\"height: 100%\"\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\">\r\n                <bsu-ly-tab-page [config]=\"tab\" [tablist]=\"tablist\"></bsu-ly-tab-page>\r\n            </fd-dynamic-page-content>\r\n        </fd-tab>\r\n    </fd-tab-list>\r\n    <ng-template #renderLayout>\r\n        <fd-dynamic-page-content [class.no-padding]=\"removeContentPadding\" *ngIf=\"!contentIsPage\">\r\n            <!-- <bsu-ly-layout-container-of-root\r\n            [config]=\"layout94\"\r\n            [isPanel]=\"false\"\r\n            [isRoot]=\"true\"\r\n        ></bsu-ly-layout-container-of-root> -->\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                    context: {\r\n                        $implicit: parameters?.LayoutComponent,\r\n                        layout94: layout94\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n    </ng-template>\r\n    <fd-dynamic-page-footer>\r\n        <bsu-layout-actions\r\n            [canSend]=\"canSend\"\r\n            [buttons]=\"layoutActions\"\r\n            [workflowButtons]=\"workflowButtons\"\r\n            [workflowButtonsComboMode]=\"workflowButtonsComboMode\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [rtl]=\"rtl\"\r\n            (toolClick)=\"onToolbarClick($event)\"\r\n            (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n        >\r\n        </bsu-layout-actions>\r\n    </fd-dynamic-page-footer>\r\n</fd-dynamic-page>\r\n<ng-container *ngIf=\"contentIsPage\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderLayoutComponent;\r\n            context: {\r\n                $implicit: parameters?.LayoutComponent,\r\n                layout94: layout94\r\n            }\r\n        \"\r\n    ></ng-container>\r\n</ng-container>\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n", 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}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.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: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["containerElement", "reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$4.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["role", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i6$4.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "subtitle"] }, { kind: "component", type: i6$4.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i6$4.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i6$4.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "role", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i6$4.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i6$4.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i7$7.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "id", "alignEnd"] }, { kind: "component", type: i7$7.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i7$7.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i6$2.MenuInteractiveDirective, 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", "glyph", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "component", type: i5$5.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i6$6.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { kind: "component", type: i13.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i4$3.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "disabled", "mainActionTitle", "fdType", "expandButtonAriaLabel", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "directive", type: i4$3.DeprecatedSplitButtonCompactDirective, selector: "fd-split-button[compact]" }, { kind: "component", type: i15.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i15.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i16.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "moreLabel", "lessLabel", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i7$1.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i18.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", "marginTop"] }, { 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: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"mask\" style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [subtitle]=\"subtitle | bbbTranslate\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        #titleRef\r\n    >\r\n        <fd-breadcrumb>\r\n            <ng-container *ngIf=\"breadCrumbs\">\r\n                <ng-container\r\n                    *ngFor=\"let breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; let i = index; let last = last\"\r\n                >\r\n                    <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                </ng-container>\r\n            </ng-container>\r\n        </fd-breadcrumb>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n            <fd-toolbar\r\n                *ngIf=\"toolbarVisible\"\r\n                fdType=\"transparent\"\r\n                [clearBorder]=\"true\"\r\n                [shouldOverflow]=\"deviceSize === 's'\"\r\n            >\r\n                <ng-container *ngFor=\"let btn of toolbarItems; let i = index; let last = last; let first = first\">\r\n                    <fd-toolbar-separator\r\n                        [attr.i]=\"i\"\r\n                        [attr.last]=\"last\"\r\n                        [attr.first]=\"first\"\r\n                        *ngIf=\"(btn === '-' || btn.text === '-') && !last && !first\"\r\n                    ></fd-toolbar-separator>\r\n                    <ng-container *ngIf=\"btn.IAmMenu; else simpleButton\">\r\n                        <fd-split-button\r\n                            [dir]=\"dirValue\"\r\n                            [compact]=\"contentDensity === 'compact' ? true : false\"\r\n                            fd-toolbar-item\r\n                            [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\r\n                            [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                            [glyph]=\"(btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon) || 'slim-arrow-down'\"\r\n                            (click)=\"menu.open()\"\r\n                        >\r\n                            <fd-menu #menu>\r\n                                <li\r\n                                    fd-menu-item\r\n                                    *ngFor=\"let menuItem of btn.menu.items\"\r\n                                    [disabled]=\"menuItem.disabled\"\r\n                                    (click)=\"onToolbarClick(menuItem, menu)\"\r\n                                >\r\n                                    <div fd-menu-interactive>\r\n                                        <fd-menu-addon\r\n                                            position=\"before\"\r\n                                            [glyph]=\"\r\n                                                menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\r\n                                            \"\r\n                                        >\r\n                                        </fd-menu-addon>\r\n                                        <img class=\"mr8\" *ngIf=\"menuItem.icon\" [src]=\"menuItem.icon\" />\r\n                                        <span fd-menu-title>{{ menuItem.text }}</span>\r\n                                    </div>\r\n                                </li>\r\n                            </fd-menu>\r\n                        </fd-split-button>\r\n                    </ng-container>\r\n                    <ng-template #simpleButton>\r\n                        <ng-container *ngIf=\"!(btn === '-' || btn.text === '-')\">\r\n                            <ng-container\r\n                                *ngTemplateOutlet=\"\r\n                                    btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                                    context: { $implicit: btn }\r\n                                \"\r\n                            ></ng-container>\r\n                            <ng-template #btnTemplate let-btn>\r\n                                <button\r\n                                    fd-toolbar-item\r\n                                    fd-button\r\n                                    [disabled]=\"btn.disabled\"\r\n                                    [buttonType]=\"\r\n                                        btn.isWorkflow\r\n                                            ? 'positive'\r\n                                            : btn.design\r\n                                            ? btn.design\r\n                                            : btn.Data?.JsonExtraProp?.Design\r\n                                    \"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                                    (click)=\"onToolbarClick(btn)\"\r\n                                >\r\n                                    <img\r\n                                        *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                        width=\"16\"\r\n                                        [src]=\"btn.icon\"\r\n                                    />\r\n                                    <span>{{ btn.text }}</span>\r\n                                </button>\r\n                            </ng-template>\r\n                            <ng-template #dynamicBtnTemplate let-btn>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"onToolbarClick(btn)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </ng-template>\r\n                        </ng-container>\r\n                        <!-- <button\r\n                            *ngIf=\"!(btn === '-' || btn.text === '-')\"\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [buttonType]=\"\r\n                                btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\r\n                            \"\r\n                            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                            (click)=\"onToolbarClick(btn)\"\r\n                        >\r\n                            <img\r\n                                *ngIf=\"!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon\"\r\n                                width=\"16\"\r\n                                [src]=\"btn.icon\"\r\n                            />\r\n                            <span>{{ btn.text }}</span>\r\n                        </button> -->\r\n                    </ng-template>\r\n                </ng-container>\r\n            </fd-toolbar>\r\n            <!-- <bsu-ui-form-panel-toolbar\r\n        [buttons]=\"toolbarItems | tlbButtons: 'inFooter':false\"\r\n        [size]=\"size\"\r\n        [deviceSize]=\"deviceSize$ | async\"\r\n        [visible]=\"toolbarVisible\"\r\n        (toolClick)=\"onToolbarClick($event)\"\r\n      ></bsu-ui-form-panel-toolbar> -->\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            <fd-toolbar *ngIf=\"!hideClose\" fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n                    <i class=\"sap-icon--decline\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    <fd-dynamic-page-subheader\r\n        *ngIf=\"description || facetList.length > 0 || workflowInfoText\"\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin\"\r\n        [collapsible]=\"!!workflowInfoText || (facetList && facetList.length > 0)\"\r\n        [pinnable]=\"true\"\r\n        [collapsed]=\"(!facetList || facetList.length === 0) && !workflowInfoText\"\r\n    >\r\n        <fd-message-strip [type]=\"'warning'\" *ngIf=\"workflowInfoText\" [dismissible]=\"false\">\r\n            {{ workflowInfoText | bbbTranslate }}\r\n        </fd-message-strip>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            <fd-facet *ngIf=\"avatar\" type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                    class=\"fd-avatar fd-avatar--circle\"\r\n                    [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                >\r\n                    <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            <fd-facet\r\n                *ngFor=\"let facet of facetList\"\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                <fd-facet-content *ngFor=\"let item of facet.mo.ItemList?.MoDataList\">\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                <span\r\n                    *ngIf=\"\r\n                        !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector;\r\n                        else dynamicComponentTpl\r\n                    \"\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                <ng-template #dynamicComponentTpl>\r\n                    <bnrc-dynamic-component\r\n                        [class]=\"'fd-object-status--' + facet.mo.Status | facetValue\"\r\n                        [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                        [component]=\"facet.mo.Component\"\r\n                        [value]=\"facet.mo.Text\"\r\n                    ></bnrc-dynamic-component>\r\n                </ng-template>\r\n                <fd-object-number\r\n                    *ngIf=\"facet.mo.IsNumber && facet.type === 'key-value'\"\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.Decimal | facetValue\"\r\n                ></fd-object-number>\r\n\r\n                <div *ngIf=\"facet.type === 'plain-text'\" [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n\r\n                <fd-facet-content *ngIf=\"facet.type === 'rating-indicator'\">\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo.Value | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                <div *ngIf=\"facet.type === 'progress'\" [style.width]=\"'10rem'\">\r\n                    <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span>\r\n                    <fd-progress-indicator\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"'1 \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\r\n                        [valueNow]=\"facet.mo.Value | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                        style=\"width: 10rem\"\r\n                        [valueState]=\"facet.mo.State\"\r\n                        [value]=\"getNumber(facet.mo.Value)\"\r\n                    ></ui5-progress-indicator> -->\r\n                </div>\r\n                <div *ngIf=\"facet.type === 'microcharts'\">\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n            </fd-facet>\r\n        </fd-facet-group>\r\n        <span *ngIf=\"description\">{{ description }}</span>\r\n    </fd-dynamic-page-subheader>\r\n\r\n    <fd-tab-list\r\n        (selectedTabChange)=\"onTabChanged($event)\"\r\n        *ngIf=\"!contentIsPage && modernTabs && modernTabs.length > 0 && !parameters?.LayoutComponent; else renderLayout\"\r\n        [collapseOverflow]=\"true\"\r\n        [stackContent]=\"false\"\r\n        maxContentHeight=\"auto\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        #tablist\r\n    >\r\n        <fd-tab\r\n            *ngFor=\"let tab of modernTabs; let i = index\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [selected]=\"true\"\r\n            style=\"height: 100%\"\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\">\r\n                <bsu-ly-tab-page [config]=\"tab\" [tablist]=\"tablist\"></bsu-ly-tab-page>\r\n            </fd-dynamic-page-content>\r\n        </fd-tab>\r\n    </fd-tab-list>\r\n    <ng-template #renderLayout>\r\n        <fd-dynamic-page-content [class.no-padding]=\"removeContentPadding\" *ngIf=\"!contentIsPage\">\r\n            <!-- <bsu-ly-layout-container-of-root\r\n            [config]=\"layout94\"\r\n            [isPanel]=\"false\"\r\n            [isRoot]=\"true\"\r\n        ></bsu-ly-layout-container-of-root> -->\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                    context: {\r\n                        $implicit: parameters?.LayoutComponent,\r\n                        layout94: layout94\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n    </ng-template>\r\n    <fd-dynamic-page-footer>\r\n        <bsu-layout-actions\r\n            [canSend]=\"canSend\"\r\n            [buttons]=\"layoutActions\"\r\n            [workflowButtons]=\"workflowButtons\"\r\n            [workflowButtonsComboMode]=\"workflowButtonsComboMode\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [rtl]=\"rtl\"\r\n            (toolClick)=\"onToolbarClick($event)\"\r\n            (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n        >\r\n        </bsu-layout-actions>\r\n    </fd-dynamic-page-footer>\r\n</fd-dynamic-page>\r\n<ng-container *ngIf=\"contentIsPage\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderLayoutComponent;\r\n            context: {\r\n                $implicit: parameters?.LayoutComponent,\r\n                layout94: layout94\r\n            }\r\n        \"\r\n    ></ng-container>\r\n</ng-container>\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n", 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}.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}\n"] }]
@@ -7648,7 +7662,7 @@ class HyperlinkComponent extends FieldBaseComponent {
     }
 }
 HyperlinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: HyperlinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-HyperlinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: HyperlinkComponent, selector: "bsu-hyperlink", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"parameters?.routerLink; else button\">\r\n    <a\r\n        [routerLink]=\"['./']\"\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-container>\r\n<ng-template #button>\r\n    <a\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        (click)=\"onClick()\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n        [href]=\"parameters.Link\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-template>\r\n", styles: [":host{cursor:pointer;display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3$6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3$5.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "pipe", type: i2.RemoveNewlinePipe, name: "removeNewline" }, { kind: "pipe", type: i2.ConvertToStylePipe, name: "convertToStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+HyperlinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: HyperlinkComponent, selector: "bsu-hyperlink", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"parameters?.routerLink; else button\">\r\n    <a\r\n        [routerLink]=\"['./']\"\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-container>\r\n<ng-template #button>\r\n    <a\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        (click)=\"onClick()\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n        [href]=\"parameters.Link\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-template>\r\n", styles: [":host{cursor:pointer;display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5$2.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "directive", type: i3$5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.RemoveNewlinePipe, name: "removeNewline" }, { kind: "pipe", type: i2.ConvertToStylePipe, name: "convertToStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: HyperlinkComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-hyperlink', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"parameters?.routerLink; else button\">\r\n    <a\r\n        [routerLink]=\"['./']\"\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-container>\r\n<ng-template #button>\r\n    <a\r\n        fd-link\r\n        [emphasized]=\"parameters?.Emphasized\"\r\n        (click)=\"onClick()\"\r\n        [ngStyle]=\"parameters?.Style | removeNewline | convertToStyle\"\r\n        [href]=\"parameters.Link\"\r\n    >\r\n        {{\r\n            layoutInfo.UseLayoutItemTextForControl\r\n                ? layoutInfo.Caption\r\n                : context?.Setting?.ControlFieldCaptionTranslated\r\n        }}\r\n    </a>\r\n</ng-template>\r\n", styles: [":host{cursor:pointer;display:flex;flex-direction:column}\n"] }]
@@ -8081,7 +8095,7 @@ class EmptyPageComponent extends PageWithFormHandlerBaseComponent {
     }
 }
 EmptyPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: EmptyPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-EmptyPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EmptyPageComponent, selector: "bsu-empty-page", host: { properties: { "style.position": "this._position", "class.section": "this.sectionClass", "class.absolute-page": "this.absolutePageClass" } }, providers: [ContainerService], usesInheritance: true, ngImport: i0, template: "<ng-container #containerRef></ng-container>\n<router-outlet></router-outlet>\n<router-outlet name=\"main\"></router-outlet>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i3$6.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+EmptyPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: EmptyPageComponent, selector: "bsu-empty-page", host: { properties: { "style.position": "this._position", "class.section": "this.sectionClass", "class.absolute-page": "this.absolutePageClass" } }, providers: [ContainerService], usesInheritance: true, ngImport: i0, template: "<ng-container #containerRef></ng-container>\n<router-outlet></router-outlet>\n<router-outlet name=\"main\"></router-outlet>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i3$5.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: EmptyPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-empty-page', providers: [ContainerService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container #containerRef></ng-container>\n<router-outlet></router-outlet>\n<router-outlet name=\"main\"></router-outlet>\n", styles: [":host{display:block}\n"] }]
@@ -8281,7 +8295,7 @@ class PageWithHeaderComponent extends PageWithFormHandlerBaseComponent {
     }
 }
 PageWithHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: PageWithHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-PageWithHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: PageWithHeaderComponent, selector: "bsu-page-with-header", host: { properties: { "class.form-page-content": "this.formpageContentClass" } }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!headerLayout || !title; else pageWithHeader\">\r\n    <div #content></div>\r\n</ng-container>\r\n<ng-template #pageWithHeader>\r\n    <fdp-dynamic-page [size]=\"isMobile ? 'small' : 'large'\" [class.header-border]=\"!removeHeaderBorder\">\r\n        <fdp-dynamic-page-title\r\n            [class.simple-title]=\"!headerLayout.Description\"\r\n            [title]=\"title\"\r\n            [subtitle]=\"subtitle\"\r\n            [class.p-b0]=\"headerLayout?.RemoveContentPadding\"\r\n            #titleRef\r\n        >\r\n            <fd-breadcrumb>\r\n                <fd-breadcrumb-item>\r\n                    <span>{{ headerLayout.BreadCrumb }}</span>\r\n                </fd-breadcrumb-item>\r\n            </fd-breadcrumb>\r\n            <ng-container *ngFor=\"let facetColumn of headerLayout.FacetList?.MoDataList\">\r\n                <fdp-dynamic-page-key-info>\r\n                    <ng-container [ngSwitch]=\"facetColumn.ColumnType.$Caption\">\r\n                        <bsu-header-facet-key-value\r\n                            *ngSwitchCase=\"'KeyValue'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-key-value>\r\n                        <bsu-header-facet-form\r\n                            *ngSwitchCase=\"'Form'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-form>\r\n                        <bsu-header-facet-plain-text\r\n                            *ngSwitchCase=\"'PlainText'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-plain-text>\r\n                        <bsu-header-facet-rate\r\n                            *ngSwitchCase=\"'Rate'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-rate>\r\n                        <bsu-header-facet-progress\r\n                            *ngSwitchCase=\"'Progress'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-progress>\r\n                        <bsu-header-facet-microchart\r\n                            *ngSwitchCase=\"'Microchart'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-microchart>\r\n                        <div *ngSwitchDefault></div>\r\n                    </ng-container>\r\n                </fdp-dynamic-page-key-info>\r\n            </ng-container>\r\n            <fdp-dynamic-page-global-actions>\r\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\" [showOverflow]=\"true\">\r\n                    <ng-container *ngFor=\"let btn of commands\">\r\n                        <button\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [fdType]=\"btn.Design\"\r\n                            [label]=\"btn.Title\"\r\n                            [glyph]=\"btn.Icon\"\r\n                            (click)=\"onCommandClick(btn)\"\r\n                        ></button>\r\n                    </ng-container>\r\n                    <bsu-global-search\r\n                        *ngIf=\"headerLayout.HasGlobalSearch\"\r\n                        [mo]=\"headerLayout.GlobalSearchSettings.GlobalSearchResult\"\r\n                    ></bsu-global-search>\r\n                </fd-toolbar>\r\n            </fdp-dynamic-page-global-actions>\r\n            <fdp-dynamic-page-layout-actions> </fdp-dynamic-page-layout-actions>\r\n        </fdp-dynamic-page-title>\r\n        <fdp-dynamic-page-header\r\n            [class.hide]=\"!headerLayout.Description\"\r\n            [collapsible]=\"true\"\r\n            [pinnable]=\"false\"\r\n            [collapsed]=\"true\"\r\n        >\r\n            <span *ngIf=\"headerLayout.Description\">{{ headerLayout.Description }}</span>\r\n        </fdp-dynamic-page-header>\r\n        <fdp-dynamic-page-content [class.no-padding]=\"removeContentPadding\">\r\n            <div #content></div>\r\n        </fdp-dynamic-page-content>\r\n    </fdp-dynamic-page>\r\n    <ng-template #headerAvatar let-avatar let-isIcon=\"isIcon\" let-isNullImage=\"isNullImage\">\r\n        <div class=\"fd-dynamic-page__avatar\">\r\n            <bsu-header-avatar\r\n                [icon]=\"isIcon ? avatar : ''\"\r\n                [fileId]=\"isNullImage ? '' : avatar.FileId\"\r\n                [size]=\"'m'\"\r\n            ></bsu-header-avatar>\r\n        </div>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}:host ::ng-deep .fd-dynamic-page__header-fixed{position:relative!important}:host ::ng-deep .fd-dynamic-page__footer{position:absolute!important}:host ::ng-deep .fd-dynamic-page__content{top:0!important;overflow-y:hidden!important;height:auto!important}:host ::ng-deep .header-border header{border-bottom:1px solid #e4e4e4;box-shadow:0 4px 2px -3px #e4e4e4!important}:host ::ng-deep .no-padding{padding:0!important}:host ::ng-deep .fd-dynamic-page__title-container{flex-wrap:wrap;align-items:flex-start}.simple-title{cursor:default!important}.simple-title:hover{background-color:var(--sapObjectHeader_Background, #fff)!important}.fd-dynamic-page__avatar{padding-left:10px}.fd-dynamic-page__avatar fd-icon{font-size:2rem}@media (max-width: 600px){::ng-deep .fd-dynamic-page__content{padding:4px}.fd-dynamic-page__avatar fd-icon{font-size:1.5rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["containerElement", "reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i5$5.DynamicPageComponent, selector: "fdp-dynamic-page", inputs: ["role", "ariaLabel", "stackContent", "background", "size", "offset", "autoResponsive", "expandContent"], outputs: ["tabChange"] }, { kind: "component", type: i5$5.DynamicPageTitleComponent, selector: "fdp-dynamic-page-title", inputs: ["title", "subtitle", "background", "size"] }, { kind: "component", type: i5$5.DynamicPageKeyInfoComponent, selector: "fdp-dynamic-page-key-info" }, { kind: "component", type: i5$5.DynamicPageGlobalActionsComponent, selector: "fdp-dynamic-page-global-actions" }, { kind: "component", type: i5$5.DynamicPageLayoutActionsComponent, selector: "fdp-dynamic-page-layout-actions" }, { kind: "component", type: i5$5.DynamicPageHeaderComponent, selector: "fdp-dynamic-page-header", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "role", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel", "background", "size"], outputs: ["collapsedChange", "collapseChange"] }, { kind: "component", type: i5$5.DynamicPageContentComponent, selector: "fdp-dynamic-page-content", inputs: ["tabLabel", "id", "background", "size"] }, { kind: "component", type: HeaderFacetKeyValueComponent, selector: "bsu-header-facet-key-value", inputs: ["settings"] }, { kind: "component", type: HeaderFacetFormComponent, selector: "bsu-header-facet-form", inputs: ["settings"] }, { kind: "component", type: HeaderFacetRateComponent, selector: "bsu-header-facet-rate", inputs: ["settings"] }, { kind: "component", type: HeaderFacetProgressComponent, selector: "bsu-header-facet-progress", inputs: ["settings"] }, { kind: "component", type: HeaderFacetMicrochartComponent, selector: "bsu-header-facet-microchart", inputs: ["settings"] }, { kind: "component", type: HeaderFacetPlainTextComponent, selector: "bsu-header-facet-plain-text", inputs: ["settings"] }, { kind: "component", type: HeaderAvatarComponent, selector: "bsu-header-avatar", inputs: ["fileId", "icon"] }, { kind: "component", type: GlobalSearchComponent, selector: "bsu-global-search", inputs: ["mo", "compact"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+PageWithHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: PageWithHeaderComponent, selector: "bsu-page-with-header", host: { properties: { "class.form-page-content": "this.formpageContentClass" } }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!headerLayout || !title; else pageWithHeader\">\r\n    <div #content></div>\r\n</ng-container>\r\n<ng-template #pageWithHeader>\r\n    <fdp-dynamic-page [size]=\"isMobile ? 'small' : 'large'\" [class.header-border]=\"!removeHeaderBorder\">\r\n        <fdp-dynamic-page-title\r\n            [class.simple-title]=\"!headerLayout.Description\"\r\n            [title]=\"title\"\r\n            [subtitle]=\"subtitle\"\r\n            [class.p-b0]=\"headerLayout?.RemoveContentPadding\"\r\n            #titleRef\r\n        >\r\n            <fd-breadcrumb>\r\n                <fd-breadcrumb-item>\r\n                    <span>{{ headerLayout.BreadCrumb }}</span>\r\n                </fd-breadcrumb-item>\r\n            </fd-breadcrumb>\r\n            <ng-container *ngFor=\"let facetColumn of headerLayout.FacetList?.MoDataList\">\r\n                <fdp-dynamic-page-key-info>\r\n                    <ng-container [ngSwitch]=\"facetColumn.ColumnType.$Caption\">\r\n                        <bsu-header-facet-key-value\r\n                            *ngSwitchCase=\"'KeyValue'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-key-value>\r\n                        <bsu-header-facet-form\r\n                            *ngSwitchCase=\"'Form'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-form>\r\n                        <bsu-header-facet-plain-text\r\n                            *ngSwitchCase=\"'PlainText'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-plain-text>\r\n                        <bsu-header-facet-rate\r\n                            *ngSwitchCase=\"'Rate'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-rate>\r\n                        <bsu-header-facet-progress\r\n                            *ngSwitchCase=\"'Progress'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-progress>\r\n                        <bsu-header-facet-microchart\r\n                            *ngSwitchCase=\"'Microchart'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-microchart>\r\n                        <div *ngSwitchDefault></div>\r\n                    </ng-container>\r\n                </fdp-dynamic-page-key-info>\r\n            </ng-container>\r\n            <fdp-dynamic-page-global-actions>\r\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\" [showOverflow]=\"true\">\r\n                    <ng-container *ngFor=\"let btn of commands\">\r\n                        <button\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [fdType]=\"btn.Design\"\r\n                            [label]=\"btn.Title\"\r\n                            [glyph]=\"btn.Icon\"\r\n                            (click)=\"onCommandClick(btn)\"\r\n                        ></button>\r\n                    </ng-container>\r\n                    <bsu-global-search\r\n                        *ngIf=\"headerLayout.HasGlobalSearch\"\r\n                        [mo]=\"headerLayout.GlobalSearchSettings.GlobalSearchResult\"\r\n                    ></bsu-global-search>\r\n                </fd-toolbar>\r\n            </fdp-dynamic-page-global-actions>\r\n            <fdp-dynamic-page-layout-actions> </fdp-dynamic-page-layout-actions>\r\n        </fdp-dynamic-page-title>\r\n        <fdp-dynamic-page-header\r\n            [class.hide]=\"!headerLayout.Description\"\r\n            [collapsible]=\"true\"\r\n            [pinnable]=\"false\"\r\n            [collapsed]=\"true\"\r\n        >\r\n            <span *ngIf=\"headerLayout.Description\">{{ headerLayout.Description }}</span>\r\n        </fdp-dynamic-page-header>\r\n        <fdp-dynamic-page-content [class.no-padding]=\"removeContentPadding\">\r\n            <div #content></div>\r\n        </fdp-dynamic-page-content>\r\n    </fdp-dynamic-page>\r\n    <ng-template #headerAvatar let-avatar let-isIcon=\"isIcon\" let-isNullImage=\"isNullImage\">\r\n        <div class=\"fd-dynamic-page__avatar\">\r\n            <bsu-header-avatar\r\n                [icon]=\"isIcon ? avatar : ''\"\r\n                [fileId]=\"isNullImage ? '' : avatar.FileId\"\r\n                [size]=\"'m'\"\r\n            ></bsu-header-avatar>\r\n        </div>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}:host ::ng-deep .fd-dynamic-page__header-fixed{position:relative!important}:host ::ng-deep .fd-dynamic-page__footer{position:absolute!important}:host ::ng-deep .fd-dynamic-page__content{top:0!important;overflow-y:hidden!important;height:auto!important}:host ::ng-deep .header-border header{border-bottom:1px solid #e4e4e4;box-shadow:0 4px 2px -3px #e4e4e4!important}:host ::ng-deep .no-padding{padding:0!important}:host ::ng-deep .fd-dynamic-page__title-container{flex-wrap:wrap;align-items:flex-start}.simple-title{cursor:default!important}.simple-title:hover{background-color:var(--sapObjectHeader_Background, #fff)!important}.fd-dynamic-page__avatar{padding-left:10px}.fd-dynamic-page__avatar fd-icon{font-size:2rem}@media (max-width: 600px){::ng-deep .fd-dynamic-page__content{padding:4px}.fd-dynamic-page__avatar fd-icon{font-size:1.5rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["containerElement", "reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i5$6.DynamicPageComponent, selector: "fdp-dynamic-page", inputs: ["role", "ariaLabel", "stackContent", "background", "size", "offset", "autoResponsive", "expandContent"], outputs: ["tabChange"] }, { kind: "component", type: i5$6.DynamicPageTitleComponent, selector: "fdp-dynamic-page-title", inputs: ["title", "subtitle", "background", "size"] }, { kind: "component", type: i5$6.DynamicPageKeyInfoComponent, selector: "fdp-dynamic-page-key-info" }, { kind: "component", type: i5$6.DynamicPageGlobalActionsComponent, selector: "fdp-dynamic-page-global-actions" }, { kind: "component", type: i5$6.DynamicPageLayoutActionsComponent, selector: "fdp-dynamic-page-layout-actions" }, { kind: "component", type: i5$6.DynamicPageHeaderComponent, selector: "fdp-dynamic-page-header", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "role", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel", "background", "size"], outputs: ["collapsedChange", "collapseChange"] }, { kind: "component", type: i5$6.DynamicPageContentComponent, selector: "fdp-dynamic-page-content", inputs: ["tabLabel", "id", "background", "size"] }, { kind: "component", type: HeaderFacetKeyValueComponent, selector: "bsu-header-facet-key-value", inputs: ["settings"] }, { kind: "component", type: HeaderFacetFormComponent, selector: "bsu-header-facet-form", inputs: ["settings"] }, { kind: "component", type: HeaderFacetRateComponent, selector: "bsu-header-facet-rate", inputs: ["settings"] }, { kind: "component", type: HeaderFacetProgressComponent, selector: "bsu-header-facet-progress", inputs: ["settings"] }, { kind: "component", type: HeaderFacetMicrochartComponent, selector: "bsu-header-facet-microchart", inputs: ["settings"] }, { kind: "component", type: HeaderFacetPlainTextComponent, selector: "bsu-header-facet-plain-text", inputs: ["settings"] }, { kind: "component", type: HeaderAvatarComponent, selector: "bsu-header-avatar", inputs: ["fileId", "icon"] }, { kind: "component", type: GlobalSearchComponent, selector: "bsu-global-search", inputs: ["mo", "compact"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: PageWithHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-page-with-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!headerLayout || !title; else pageWithHeader\">\r\n    <div #content></div>\r\n</ng-container>\r\n<ng-template #pageWithHeader>\r\n    <fdp-dynamic-page [size]=\"isMobile ? 'small' : 'large'\" [class.header-border]=\"!removeHeaderBorder\">\r\n        <fdp-dynamic-page-title\r\n            [class.simple-title]=\"!headerLayout.Description\"\r\n            [title]=\"title\"\r\n            [subtitle]=\"subtitle\"\r\n            [class.p-b0]=\"headerLayout?.RemoveContentPadding\"\r\n            #titleRef\r\n        >\r\n            <fd-breadcrumb>\r\n                <fd-breadcrumb-item>\r\n                    <span>{{ headerLayout.BreadCrumb }}</span>\r\n                </fd-breadcrumb-item>\r\n            </fd-breadcrumb>\r\n            <ng-container *ngFor=\"let facetColumn of headerLayout.FacetList?.MoDataList\">\r\n                <fdp-dynamic-page-key-info>\r\n                    <ng-container [ngSwitch]=\"facetColumn.ColumnType.$Caption\">\r\n                        <bsu-header-facet-key-value\r\n                            *ngSwitchCase=\"'KeyValue'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-key-value>\r\n                        <bsu-header-facet-form\r\n                            *ngSwitchCase=\"'Form'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-form>\r\n                        <bsu-header-facet-plain-text\r\n                            *ngSwitchCase=\"'PlainText'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-plain-text>\r\n                        <bsu-header-facet-rate\r\n                            *ngSwitchCase=\"'Rate'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-rate>\r\n                        <bsu-header-facet-progress\r\n                            *ngSwitchCase=\"'Progress'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-progress>\r\n                        <bsu-header-facet-microchart\r\n                            *ngSwitchCase=\"'Microchart'\"\r\n                            [settings]=\"facetColumn.ColumnSettings.$FormPanelSetting.Data.Mo\"\r\n                        ></bsu-header-facet-microchart>\r\n                        <div *ngSwitchDefault></div>\r\n                    </ng-container>\r\n                </fdp-dynamic-page-key-info>\r\n            </ng-container>\r\n            <fdp-dynamic-page-global-actions>\r\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\" [showOverflow]=\"true\">\r\n                    <ng-container *ngFor=\"let btn of commands\">\r\n                        <button\r\n                            fd-toolbar-item\r\n                            fd-button\r\n                            [fdType]=\"btn.Design\"\r\n                            [label]=\"btn.Title\"\r\n                            [glyph]=\"btn.Icon\"\r\n                            (click)=\"onCommandClick(btn)\"\r\n                        ></button>\r\n                    </ng-container>\r\n                    <bsu-global-search\r\n                        *ngIf=\"headerLayout.HasGlobalSearch\"\r\n                        [mo]=\"headerLayout.GlobalSearchSettings.GlobalSearchResult\"\r\n                    ></bsu-global-search>\r\n                </fd-toolbar>\r\n            </fdp-dynamic-page-global-actions>\r\n            <fdp-dynamic-page-layout-actions> </fdp-dynamic-page-layout-actions>\r\n        </fdp-dynamic-page-title>\r\n        <fdp-dynamic-page-header\r\n            [class.hide]=\"!headerLayout.Description\"\r\n            [collapsible]=\"true\"\r\n            [pinnable]=\"false\"\r\n            [collapsed]=\"true\"\r\n        >\r\n            <span *ngIf=\"headerLayout.Description\">{{ headerLayout.Description }}</span>\r\n        </fdp-dynamic-page-header>\r\n        <fdp-dynamic-page-content [class.no-padding]=\"removeContentPadding\">\r\n            <div #content></div>\r\n        </fdp-dynamic-page-content>\r\n    </fdp-dynamic-page>\r\n    <ng-template #headerAvatar let-avatar let-isIcon=\"isIcon\" let-isNullImage=\"isNullImage\">\r\n        <div class=\"fd-dynamic-page__avatar\">\r\n            <bsu-header-avatar\r\n                [icon]=\"isIcon ? avatar : ''\"\r\n                [fileId]=\"isNullImage ? '' : avatar.FileId\"\r\n                [size]=\"'m'\"\r\n            ></bsu-header-avatar>\r\n        </div>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}:host ::ng-deep .fd-dynamic-page__header-fixed{position:relative!important}:host ::ng-deep .fd-dynamic-page__footer{position:absolute!important}:host ::ng-deep .fd-dynamic-page__content{top:0!important;overflow-y:hidden!important;height:auto!important}:host ::ng-deep .header-border header{border-bottom:1px solid #e4e4e4;box-shadow:0 4px 2px -3px #e4e4e4!important}:host ::ng-deep .no-padding{padding:0!important}:host ::ng-deep .fd-dynamic-page__title-container{flex-wrap:wrap;align-items:flex-start}.simple-title{cursor:default!important}.simple-title:hover{background-color:var(--sapObjectHeader_Background, #fff)!important}.fd-dynamic-page__avatar{padding-left:10px}.fd-dynamic-page__avatar fd-icon{font-size:2rem}@media (max-width: 600px){::ng-deep .fd-dynamic-page__content{padding:4px}.fd-dynamic-page__avatar fd-icon{font-size:1.5rem}}\n"] }]
@@ -8464,10 +8478,10 @@ class LyVerticalLayoutComponent extends LayoutItemBaseComponent {
     }
 }
 LyVerticalLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyVerticalLayoutComponent, deps: [{ token: i2.FormPanelService }, { token: i2.LayoutService, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-LyVerticalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyVerticalLayoutComponent, selector: "bsu-ly-vertical-layout", inputs: { maxLabelWidth: "maxLabelWidth" }, host: { properties: { "style.flex": "this.flex", "style.flex-direction": "this.flexDirection", "style.flex-wrap": "this.flexWrap" } }, viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyVerticalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyVerticalLayoutComponent, selector: "bsu-ly-vertical-layout", inputs: { maxLabelWidth: "maxLabelWidth" }, host: { properties: { "style.flex": "this.flex", "style.flex-direction": "this.flexDirection", "style.flex-wrap": "this.flexWrap" } }, viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyVerticalLayoutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-vertical-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'bsu-ly-vertical-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: function () {
         return [{ type: i2.FormPanelService }, { type: i2.LayoutService, decorators: [{
                         type: SkipSelf
@@ -8523,10 +8537,10 @@ class LyHorizontalLayoutComponent extends LayoutItemBaseComponent {
     }
 }
 LyHorizontalLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyHorizontalLayoutComponent, deps: [{ token: i0.ElementRef }, { token: i2.FormPanelService }, { token: i2.LayoutService, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
-LyHorizontalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyHorizontalLayoutComponent, selector: "bsu-ly-horizontal-layout", inputs: { renderItems: "renderItems", maxLabelWidth: "maxLabelWidth" }, host: { properties: { "style.flex": "this.flex", "class.horizontal-layout": "this.horizontalLayoutClass", "class.wrap-content": "this.wrapContent", "style.flex-direction": "this.flexDirection", "style.opacity": "this.opacity" } }, viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;align-items:start;justify-content:start;flex-wrap:wrap}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyHorizontalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyHorizontalLayoutComponent, selector: "bsu-ly-horizontal-layout", inputs: { renderItems: "renderItems", maxLabelWidth: "maxLabelWidth" }, host: { properties: { "style.flex": "this.flex", "class.horizontal-layout": "this.horizontalLayoutClass", "class.wrap-content": "this.wrapContent", "style.flex-direction": "this.flexDirection", "style.opacity": "this.opacity" } }, viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyHorizontalLayoutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-horizontal-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;align-items:start;justify-content:start;flex-wrap:wrap}\n"] }]
+            args: [{ selector: 'bsu-ly-horizontal-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        name: 'LyLayoutContainerComponent',\n                        selector: 'bsu-ly-layout-container'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyLayoutHorizontalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyLayoutVerticalComponent'\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\n    <bnrc-dynamic-layout\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [":host{display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap}\n"] }]
         }], ctorParameters: function () {
         return [{ type: i0.ElementRef }, { type: i2.FormPanelService }, { type: i2.LayoutService, decorators: [{
                         type: SkipSelf
@@ -8811,13 +8825,13 @@ class FormDialogLessComponent extends ContainerComponent {
     }
     onFormClose() { }
 }
-FormDialogLessComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormDialogLessComponent, deps: [{ token: i2.DialogParams }, { token: i0.ElementRef }, { token: i3$6.ActivatedRoute }, { token: i2.PortalService }, { token: i0.ViewContainerRef }, { token: i2.BarsaDialogService }, { token: i0.Injector }, { token: i3$6.Router }, { token: i0.ChangeDetectorRef }, { token: i2.ContainerService, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+FormDialogLessComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormDialogLessComponent, deps: [{ token: i2.DialogParams }, { token: i0.ElementRef }, { token: i3$5.ActivatedRoute }, { token: i2.PortalService }, { token: i0.ViewContainerRef }, { token: i2.BarsaDialogService }, { token: i0.Injector }, { token: i3$5.Router }, { token: i0.ChangeDetectorRef }, { token: i2.ContainerService, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
 FormDialogLessComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: FormDialogLessComponent, selector: "bsu-form-dialog-less", providers: [ContainerService], usesInheritance: true, ngImport: i0, template: "<bnrc-form *ngIf=\"rendered\" [formPanelCtrl]=\"formPanelCtrlr\" [params]=\"params\" (formClose)=\"onFormClose()\"></bnrc-form>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormDialogLessComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-form-dialog-less', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ContainerService], template: "<bnrc-form *ngIf=\"rendered\" [formPanelCtrl]=\"formPanelCtrlr\" [params]=\"params\" (formClose)=\"onFormClose()\"></bnrc-form>\r\n" }]
         }], ctorParameters: function () {
-        return [{ type: i2.DialogParams }, { type: i0.ElementRef }, { type: i3$6.ActivatedRoute }, { type: i2.PortalService }, { type: i0.ViewContainerRef }, { type: i2.BarsaDialogService }, { type: i0.Injector }, { type: i3$6.Router }, { type: i0.ChangeDetectorRef }, { type: i2.ContainerService, decorators: [{
+        return [{ type: i2.DialogParams }, { type: i0.ElementRef }, { type: i3$5.ActivatedRoute }, { type: i2.PortalService }, { type: i0.ViewContainerRef }, { type: i2.BarsaDialogService }, { type: i0.Injector }, { type: i3$5.Router }, { type: i0.ChangeDetectorRef }, { type: i2.ContainerService, decorators: [{
                         type: Self
                     }, {
                         type: Optional
@@ -8844,13 +8858,13 @@ class UiFormPanelComponent extends FormBaseComponent {
         this._formPanelService.mo$.subscribe((c) => { var _a; return (this._typeDefName = (_a = c === null || c === void 0 ? void 0 : c.$TypeDefName) !== null && _a !== void 0 ? _a : ''); });
     }
 }
-UiFormPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiFormPanelComponent, deps: [{ token: i2.BreadcrumbService }, { token: i1$1.ContentDensityService }, { token: i2.PortalService }, { token: i3$6.ActivatedRoute }, { token: i3$6.Router }, { token: i2.FormPanelService, self: true }], target: i0.ɵɵFactoryTarget.Component });
+UiFormPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiFormPanelComponent, deps: [{ token: i2.BreadcrumbService }, { token: i1$1.ContentDensityService }, { token: i2.PortalService }, { token: i3$5.ActivatedRoute }, { token: i3$5.Router }, { token: i2.FormPanelService, self: true }], target: i0.ɵɵFactoryTarget.Component });
 UiFormPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiFormPanelComponent, selector: "bsu-ui-form-panel", host: { properties: { "attr.typeDefName": "this._typeDefName" } }, providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"isSearchPanel || (isSimple$ | async) || isSubForm || isModal || isFormReport; else dynamicPage\">\n    <bsu-mask *ngIf=\"mask$ | async\"> </bsu-mask>\n    <div>\n        <bsu-ly-layout-container-of-root\n            [config]=\"layout94$ | async\"\n            [isPanel]=\"false\"\n            [isRoot]=\"true\"\n        ></bsu-ly-layout-container-of-root>\n        <div class=\"workflow-buttons\" *ngIf=\"workflowPanelUi$ | async as workflowPanelUi\">\n            <div style=\"flex-grow: 1\"></div>\n            <bsu-layout-actions\n                [simple]=\"true\"\n                [buttons]=\"[]\"\n                [workflowButtons]=\"workflowPanelUi?.buttonList ?? []\"\n                (toolClick)=\"onToolbarClick($event)\"\n            >\n            </bsu-layout-actions>\n        </div>\n    </div>\n    <!-- <div fd-bar barDesign=\"floating-footer\">\n    <div\n      *ngIf=\"context.WorkflowPanelUi\"\n      fd-bar-right\n      [footerActions]=\"context.WorkflowPanelUi\"\n    ></div>\n    <div\n      *ngIf=\"\n        !context.WorkflowPanelUi &&\n        showToolbar &&\n        \n        toolbar.items.length > 0\n      \"\n      fd-bar-right\n      [footerActions]=\"toolbar\"\n    ></div>\n  </div> -->\n</ng-container>\n<ng-template #dynamicPage>\n    <bsu-fundamental-dynamic-form\n        [style.position]=\"(mask$ | async) ? 'relative' : null\"\n        [canSend]=\"(canSend$ | async) === true\"\n        [removeContentPadding]=\"(headerRemoveContentPadding$ | async)!!\"\n        [breadCrumbs]=\"breadCrumbs$ | async\"\n        [description]=\"(headerDescription$ | async)!!\"\n        [hideClose]=\"(hideClose$ | async)!!\"\n        [hideTitle]=\"(hideTitle$ | async)!!\"\n        [hidePin]=\"(hidePin$ | async)!!\"\n        [title]=\"(title$ | async)!!\"\n        [subtitle]=\"(headerSubtitle$ | async)!!\"\n        [toolbarItems]=\"toolbarItems$ | async | tlbButtons: 'inFooter':false\"\n        [layoutActions]=\"toolbarItems$ | async | tlbButtons: 'inFooter':true\"\n        [toolbarVisible]=\"(toolbarVisible$ | async)!!\"\n        [facetList]=\"(headerLayout$ | async)?.FacetList2\"\n        [parameters]=\"parameters\"\n        [workflowPanelUi]=\"workflowPanelUi$ | async\"\n        [isMobile]=\"isMobile\"\n        [layout94]=\"layout94$ | async\"\n        [rtl]=\"(rtl$ | async)!!\"\n        [mask]=\"(mask$ | async)!!\"\n        [mo]=\"(mo$ | async)!!\"\n        [dirValue]=\"(dirValue$ | async)!!\"\n        [deviceSize]=\"(deviceSize$ | async)!!\"\n        [contentDensity]=\"(contentDensity$ | async)!!\"\n        [modernTabs]=\"(modernTabs$ | async)!!\"\n        [avatar]=\"(avatar$ | async)!!\"\n        [fieldDict]=\"(fieldDict$ | async)!!\"\n        (close)=\"onClose()\"\n        (toolbarClick)=\"onToolbarClick($event)\"\n        [contentIsPage]=\"parameters?.ContentIsPage\"\n        (workflowChoiceClick)=\"onWorkflowChoiceClick($event)\"\n    ></bsu-fundamental-dynamic-form>\n</ng-template>\n", styles: [":host{display:block;width:100%;min-height:100%}.workflow-buttons{display:flex;margin-top:5px;padding:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "component", type: FundamentalDynamicFormComponent, selector: "bsu-fundamental-dynamic-form", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layout94", "parameters", "workflowPanelUi", "context", "title", "subtitle", "description", "facetList", "fieldDict", "removeHeaderBorder", "removeContentPadding", "isMobile", "mo", "avatar", "rtl", "hideTitle", "hideClose", "hidePin", "mask", "canSend", "contentIsPage", "contentDensity", "deviceSize", "dirValue", "modernTabs"], outputs: ["toolbarClick", "workflowChoiceClick", "close"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple"], outputs: ["workflowChoiceSelect"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TlbButtonsPipe, name: "tlbButtons" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiFormPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-ui-form-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [FormPanelService], template: "<ng-container *ngIf=\"isSearchPanel || (isSimple$ | async) || isSubForm || isModal || isFormReport; else dynamicPage\">\n    <bsu-mask *ngIf=\"mask$ | async\"> </bsu-mask>\n    <div>\n        <bsu-ly-layout-container-of-root\n            [config]=\"layout94$ | async\"\n            [isPanel]=\"false\"\n            [isRoot]=\"true\"\n        ></bsu-ly-layout-container-of-root>\n        <div class=\"workflow-buttons\" *ngIf=\"workflowPanelUi$ | async as workflowPanelUi\">\n            <div style=\"flex-grow: 1\"></div>\n            <bsu-layout-actions\n                [simple]=\"true\"\n                [buttons]=\"[]\"\n                [workflowButtons]=\"workflowPanelUi?.buttonList ?? []\"\n                (toolClick)=\"onToolbarClick($event)\"\n            >\n            </bsu-layout-actions>\n        </div>\n    </div>\n    <!-- <div fd-bar barDesign=\"floating-footer\">\n    <div\n      *ngIf=\"context.WorkflowPanelUi\"\n      fd-bar-right\n      [footerActions]=\"context.WorkflowPanelUi\"\n    ></div>\n    <div\n      *ngIf=\"\n        !context.WorkflowPanelUi &&\n        showToolbar &&\n        \n        toolbar.items.length > 0\n      \"\n      fd-bar-right\n      [footerActions]=\"toolbar\"\n    ></div>\n  </div> -->\n</ng-container>\n<ng-template #dynamicPage>\n    <bsu-fundamental-dynamic-form\n        [style.position]=\"(mask$ | async) ? 'relative' : null\"\n        [canSend]=\"(canSend$ | async) === true\"\n        [removeContentPadding]=\"(headerRemoveContentPadding$ | async)!!\"\n        [breadCrumbs]=\"breadCrumbs$ | async\"\n        [description]=\"(headerDescription$ | async)!!\"\n        [hideClose]=\"(hideClose$ | async)!!\"\n        [hideTitle]=\"(hideTitle$ | async)!!\"\n        [hidePin]=\"(hidePin$ | async)!!\"\n        [title]=\"(title$ | async)!!\"\n        [subtitle]=\"(headerSubtitle$ | async)!!\"\n        [toolbarItems]=\"toolbarItems$ | async | tlbButtons: 'inFooter':false\"\n        [layoutActions]=\"toolbarItems$ | async | tlbButtons: 'inFooter':true\"\n        [toolbarVisible]=\"(toolbarVisible$ | async)!!\"\n        [facetList]=\"(headerLayout$ | async)?.FacetList2\"\n        [parameters]=\"parameters\"\n        [workflowPanelUi]=\"workflowPanelUi$ | async\"\n        [isMobile]=\"isMobile\"\n        [layout94]=\"layout94$ | async\"\n        [rtl]=\"(rtl$ | async)!!\"\n        [mask]=\"(mask$ | async)!!\"\n        [mo]=\"(mo$ | async)!!\"\n        [dirValue]=\"(dirValue$ | async)!!\"\n        [deviceSize]=\"(deviceSize$ | async)!!\"\n        [contentDensity]=\"(contentDensity$ | async)!!\"\n        [modernTabs]=\"(modernTabs$ | async)!!\"\n        [avatar]=\"(avatar$ | async)!!\"\n        [fieldDict]=\"(fieldDict$ | async)!!\"\n        (close)=\"onClose()\"\n        (toolbarClick)=\"onToolbarClick($event)\"\n        [contentIsPage]=\"parameters?.ContentIsPage\"\n        (workflowChoiceClick)=\"onWorkflowChoiceClick($event)\"\n    ></bsu-fundamental-dynamic-form>\n</ng-template>\n", styles: [":host{display:block;width:100%;min-height:100%}.workflow-buttons{display:flex;margin-top:5px;padding:5px}\n"] }]
         }], ctorParameters: function () {
-        return [{ type: i2.BreadcrumbService }, { type: i1$1.ContentDensityService }, { type: i2.PortalService }, { type: i3$6.ActivatedRoute }, { type: i3$6.Router }, { type: i2.FormPanelService, decorators: [{
+        return [{ type: i2.BreadcrumbService }, { type: i1$1.ContentDensityService }, { type: i2.PortalService }, { type: i3$5.ActivatedRoute }, { type: i3$5.Router }, { type: i2.FormPanelService, decorators: [{
                         type: Self
                     }] }];
     }, propDecorators: { _typeDefName: [{
@@ -8956,10 +8970,10 @@ class LayoutWizardComponent extends FormPropsBaseComponent {
     }
 }
 LayoutWizardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LayoutWizardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LayoutWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LayoutWizardComponent, selector: "bsu-layout-wizard", inputs: { root: "root", parentContentRef: "parentContentRef", selectedIndex: "selectedIndex", maxContentWidth: "maxContentWidth", minTabHeight: "minTabHeight" }, viewQueries: [{ propertyName: "layoutRef", first: true, predicate: ["layoutRef"], descendants: true }, { propertyName: "containerRootRef", first: true, predicate: ["containerRootRef"], descendants: true, read: ElementRef }, { propertyName: "wizardComponent", first: true, predicate: WizardComponent, descendants: true, read: ElementRef }, { propertyName: "wizardStepComponents", predicate: WizardStepComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-wizard [appendToWizard]=\"false\">\r\n    <fd-wizard-navigation>\r\n        <ul fd-wizard-progress-bar [size]=\"wizardSize\" role=\"list\" aria-label=\"Wizard Steps\">\r\n            <li\r\n                *ngFor=\"let step of modernTabs; let i = index\"\r\n                fd-wizard-step\r\n                [status]=\"arrStatus[i]\"\r\n                (statusChange)=\"onStatusChange(i, $event)\"\r\n                [label]=\"step.Title || '' | bbbTranslate\"\r\n                (click)=\"onStepClick(i, $event)\"\r\n            >\r\n                <fd-wizard-step-indicator>{{ i + 1 }}</fd-wizard-step-indicator>\r\n                <fd-wizard-content>\r\n                    <div class=\"fix-form-content\">\r\n                        <div\r\n                            #layoutRef\r\n                            [style.max-width]=\"maxContentWidth ? maxContentWidth + 'px' : 'auto'\"\r\n                            [style.min-height.px]=\"minTabHeight ? minTabHeight : 400\"\r\n                        >\r\n                            <bsu-ly-layout-container-of-root\r\n                                #containerRootRef\r\n                                class=\"content-wizard\"\r\n                                *ngIf=\"i === selectedIndex\"\r\n                                [config]=\"step\"\r\n                                [isPanel]=\"false\"\r\n                                [isRoot]=\"true\"\r\n                            ></bsu-ly-layout-container-of-root>\r\n                        </div>\r\n                    </div>\r\n                </fd-wizard-content>\r\n            </li>\r\n        </ul>\r\n    </fd-wizard-navigation>\r\n</fd-wizard>\r\n", styles: [":host{width:100%;height:100%;display:block}:host ::ng-deep .fd-wizard-container-wrapper{background:var(--fdWizard_Content_Default_Background)}:host ::ng-deep fd-dynamic-page-content{padding:0!important}.fd-wizard__progress-bar{border-bottom:1px solid #e4e4e4;box-shadow:none}.fix-form-content{display:flex;justify-content:center;align-items:start;overflow-y:auto}.fix-form-content>div{flex-grow:1;position:relative}.content-wizard{position:absolute}@media (max-width: 767px){.content-wizard{padding:0 10px}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i2$6.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$6.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i2$6.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i2$6.WizardStepIndicatorComponent, selector: "fd-wizard-step-indicator", inputs: ["glyph"], outputs: ["stepIndicatorItemClicked"] }, { kind: "component", type: i2$6.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LayoutWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LayoutWizardComponent, selector: "bsu-layout-wizard", inputs: { root: "root", parentContentRef: "parentContentRef", selectedIndex: "selectedIndex", maxContentWidth: "maxContentWidth", minTabHeight: "minTabHeight" }, viewQueries: [{ propertyName: "layoutRef", first: true, predicate: ["layoutRef"], descendants: true }, { propertyName: "containerRootRef", first: true, predicate: ["containerRootRef"], descendants: true, read: ElementRef }, { propertyName: "wizardComponent", first: true, predicate: WizardComponent, descendants: true, read: ElementRef }, { propertyName: "wizardStepComponents", predicate: WizardStepComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-wizard [appendToWizard]=\"false\">\r\n    <fd-wizard-navigation>\r\n        <ul fd-wizard-progress-bar [size]=\"wizardSize\" role=\"list\" aria-label=\"Wizard Steps\">\r\n            <li\r\n                *ngFor=\"let step of modernTabs; let i = index\"\r\n                fd-wizard-step\r\n                [status]=\"arrStatus[i]\"\r\n                (statusChange)=\"onStatusChange(i, $event)\"\r\n                [label]=\"step.Title || '' | bbbTranslate\"\r\n                (click)=\"onStepClick(i, $event)\"\r\n            >\r\n                <fd-wizard-step-indicator>{{ i + 1 }}</fd-wizard-step-indicator>\r\n                <fd-wizard-content>\r\n                    <div class=\"fix-form-content\">\r\n                        <div\r\n                            #layoutRef\r\n                            [style.max-width]=\"maxContentWidth ? maxContentWidth + 'px' : 'auto'\"\r\n                            [style.min-height.px]=\"minTabHeight ? minTabHeight : 400\"\r\n                        >\r\n                            <bsu-ly-layout-container-of-root\r\n                                #containerRootRef\r\n                                class=\"content-wizard\"\r\n                                *ngIf=\"i === selectedIndex\"\r\n                                [config]=\"step\"\r\n                                [isPanel]=\"false\"\r\n                                [isRoot]=\"true\"\r\n                            ></bsu-ly-layout-container-of-root>\r\n                        </div>\r\n                    </div>\r\n                </fd-wizard-content>\r\n            </li>\r\n        </ul>\r\n    </fd-wizard-navigation>\r\n</fd-wizard>\r\n", styles: [":host{width:100%;height:100%;display:block}:host ::ng-deep .fd-wizard-container-wrapper{background:var(--fdWizard_Content_Default_Background)}:host ::ng-deep fd-dynamic-page-content{padding:0!important}.fd-wizard__progress-bar{border-bottom:1px solid #e4e4e4;box-shadow:none}.fix-form-content{display:flex;justify-content:center;align-items:flex-start;overflow-y:auto}.fix-form-content>div{flex-grow:1;position:relative}.content-wizard{position:absolute}@media (max-width: 767px){.content-wizard{padding:0 10px}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i2$6.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$6.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i2$6.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i2$6.WizardStepIndicatorComponent, selector: "fd-wizard-step-indicator", inputs: ["glyph"], outputs: ["stepIndicatorItemClicked"] }, { kind: "component", type: i2$6.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LayoutWizardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-layout-wizard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-wizard [appendToWizard]=\"false\">\r\n    <fd-wizard-navigation>\r\n        <ul fd-wizard-progress-bar [size]=\"wizardSize\" role=\"list\" aria-label=\"Wizard Steps\">\r\n            <li\r\n                *ngFor=\"let step of modernTabs; let i = index\"\r\n                fd-wizard-step\r\n                [status]=\"arrStatus[i]\"\r\n                (statusChange)=\"onStatusChange(i, $event)\"\r\n                [label]=\"step.Title || '' | bbbTranslate\"\r\n                (click)=\"onStepClick(i, $event)\"\r\n            >\r\n                <fd-wizard-step-indicator>{{ i + 1 }}</fd-wizard-step-indicator>\r\n                <fd-wizard-content>\r\n                    <div class=\"fix-form-content\">\r\n                        <div\r\n                            #layoutRef\r\n                            [style.max-width]=\"maxContentWidth ? maxContentWidth + 'px' : 'auto'\"\r\n                            [style.min-height.px]=\"minTabHeight ? minTabHeight : 400\"\r\n                        >\r\n                            <bsu-ly-layout-container-of-root\r\n                                #containerRootRef\r\n                                class=\"content-wizard\"\r\n                                *ngIf=\"i === selectedIndex\"\r\n                                [config]=\"step\"\r\n                                [isPanel]=\"false\"\r\n                                [isRoot]=\"true\"\r\n                            ></bsu-ly-layout-container-of-root>\r\n                        </div>\r\n                    </div>\r\n                </fd-wizard-content>\r\n            </li>\r\n        </ul>\r\n    </fd-wizard-navigation>\r\n</fd-wizard>\r\n", styles: [":host{width:100%;height:100%;display:block}:host ::ng-deep .fd-wizard-container-wrapper{background:var(--fdWizard_Content_Default_Background)}:host ::ng-deep fd-dynamic-page-content{padding:0!important}.fd-wizard__progress-bar{border-bottom:1px solid #e4e4e4;box-shadow:none}.fix-form-content{display:flex;justify-content:center;align-items:start;overflow-y:auto}.fix-form-content>div{flex-grow:1;position:relative}.content-wizard{position:absolute}@media (max-width: 767px){.content-wizard{padding:0 10px}}\n"] }]
+            args: [{ selector: 'bsu-layout-wizard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-wizard [appendToWizard]=\"false\">\r\n    <fd-wizard-navigation>\r\n        <ul fd-wizard-progress-bar [size]=\"wizardSize\" role=\"list\" aria-label=\"Wizard Steps\">\r\n            <li\r\n                *ngFor=\"let step of modernTabs; let i = index\"\r\n                fd-wizard-step\r\n                [status]=\"arrStatus[i]\"\r\n                (statusChange)=\"onStatusChange(i, $event)\"\r\n                [label]=\"step.Title || '' | bbbTranslate\"\r\n                (click)=\"onStepClick(i, $event)\"\r\n            >\r\n                <fd-wizard-step-indicator>{{ i + 1 }}</fd-wizard-step-indicator>\r\n                <fd-wizard-content>\r\n                    <div class=\"fix-form-content\">\r\n                        <div\r\n                            #layoutRef\r\n                            [style.max-width]=\"maxContentWidth ? maxContentWidth + 'px' : 'auto'\"\r\n                            [style.min-height.px]=\"minTabHeight ? minTabHeight : 400\"\r\n                        >\r\n                            <bsu-ly-layout-container-of-root\r\n                                #containerRootRef\r\n                                class=\"content-wizard\"\r\n                                *ngIf=\"i === selectedIndex\"\r\n                                [config]=\"step\"\r\n                                [isPanel]=\"false\"\r\n                                [isRoot]=\"true\"\r\n                            ></bsu-ly-layout-container-of-root>\r\n                        </div>\r\n                    </div>\r\n                </fd-wizard-content>\r\n            </li>\r\n        </ul>\r\n    </fd-wizard-navigation>\r\n</fd-wizard>\r\n", styles: [":host{width:100%;height:100%;display:block}:host ::ng-deep .fd-wizard-container-wrapper{background:var(--fdWizard_Content_Default_Background)}:host ::ng-deep fd-dynamic-page-content{padding:0!important}.fd-wizard__progress-bar{border-bottom:1px solid #e4e4e4;box-shadow:none}.fix-form-content{display:flex;justify-content:center;align-items:flex-start;overflow-y:auto}.fix-form-content>div{flex-grow:1;position:relative}.content-wizard{position:absolute}@media (max-width: 767px){.content-wizard{padding:0 10px}}\n"] }]
         }], propDecorators: { layoutRef: [{
                 type: ViewChild,
                 args: ['layoutRef']
@@ -9381,7 +9395,7 @@ UiDateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
         {
             provide: DateService,
             useFactory: getDateService$1,
-            deps: [LogService$1]
+            deps: [LogService]
         }
     ], viewQueries: [{ propertyName: "datetimePickerRef", first: true, predicate: ["datetimePicker"], descendants: true }, { propertyName: "datePickerRef", first: true, predicate: ["datePicker"], descendants: true }, { propertyName: "durationPickerRef", first: true, predicate: ["durationPicker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<input\n    *ngIf=\"(disableOrReadonly$ | async)!!; else datetime\"\n    fd-form-control\n    type=\"text\"\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n    [value]=\"valueCaption\"\n/>\n<ng-template #datetime>\n    <div\n        [style.display]=\"(disableOrReadonly$ | async)!! ? 'hidden' : 'block'\"\n        [attr.dir]=\"Setting.IsLtr === true ? 'ltr' : 'rtl'\"\n    >\n        <bc-date-time-picker\n            [value]=\"value\"\n            [showDate]=\"Setting.ShowDate1\"\n            [showTime]=\"Setting.ShowTime1\"\n            [primaryCalendarType]=\"Setting.CalendarType\"\n            [formatPattern]=\"formatPattern\"\n            (valueChange)=\"onDateChange2($event)\"\n            [readonly]=\"(readonly$ | async) === true ? true : false\"\n            [disabled]=\"(disable$ | async) === true ? true : false\"\n        >\n        </bc-date-time-picker>\n    </div>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class"] }, { kind: "directive", type: i2$1.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "component", type: i1$3.DateTimePickerComponent, selector: "bc-date-time-picker", inputs: ["placeholder", "primaryCalendarType", "formatPattern", "value", "timeValue", "startRangeDate", "endRangeDate", "isRangePicker", "showTime", "showDate", "rtl", "readonly", "disabled"], outputs: ["rangeChange", "valueChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiDateTimeComponent, decorators: [{
@@ -9390,7 +9404,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                         {
                             provide: DateService,
                             useFactory: getDateService$1,
-                            deps: [LogService$1]
+                            deps: [LogService]
                         }
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n    *ngIf=\"(disableOrReadonly$ | async)!!; else datetime\"\n    fd-form-control\n    type=\"text\"\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n    [value]=\"valueCaption\"\n/>\n<ng-template #datetime>\n    <div\n        [style.display]=\"(disableOrReadonly$ | async)!! ? 'hidden' : 'block'\"\n        [attr.dir]=\"Setting.IsLtr === true ? 'ltr' : 'rtl'\"\n    >\n        <bc-date-time-picker\n            [value]=\"value\"\n            [showDate]=\"Setting.ShowDate1\"\n            [showTime]=\"Setting.ShowTime1\"\n            [primaryCalendarType]=\"Setting.CalendarType\"\n            [formatPattern]=\"formatPattern\"\n            (valueChange)=\"onDateChange2($event)\"\n            [readonly]=\"(readonly$ | async) === true ? true : false\"\n            [disabled]=\"(disable$ | async) === true ? true : false\"\n        >\n        </bc-date-time-picker>\n    </div>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { datetimePickerRef: [{
@@ -9680,7 +9694,7 @@ class UlvPagingComponent extends BaseComponent {
     }
 }
 UlvPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UlvPagingComponent, deps: [{ token: i2.UlvMainService }, { token: i2.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
-UlvPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UlvPagingComponent, selector: "bsu-ulv-paging", outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, host: { properties: { "height.px": "this.height" } }, usesInheritance: true, ngImport: i0, template: "<!-- <ng-container *ngIf=\"config?.Setting?.Data?.Paging?.HasPaging\">\r\n  <div class=\"icons\">\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === totalPage - 1 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onEndClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage + 1 >= totalPage ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-left-arrow\"\r\n      (click)=\"onNextClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage - 1 < 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-right-arrow\"\r\n      (click)=\"onPreviousClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onFirstClick()\"\r\n    ></button>\r\n  </div>\r\n  <div class=\"pagesize\">\r\n    <label style=\"padding: 0 5px\"\r\n      >{{ currentPage * pageSize }}-{{ currentPage * pageSize + pageSize }} \u0627\u0632\r\n      {{ config.Setting.Data.Paging.TotalRows }}</label\r\n    >\r\n    <fd-select (valueChange)=\"onPageSizeChange($event)\" [value]=\"pageSize\">\r\n      <fd-option [value]=\"24\">24</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n    </fd-select>\r\n\r\n    <label style=\"padding: 0 5px\">{{ ItemsPerPage }}:</label>\r\n  </div>\r\n</ng-container> -->\r\n<ng-container *ngIf=\"pagingSetting$ | async as pagingSetting\">\r\n    <fd-pagination\r\n        *ngIf=\"pagingSetting && pagingSetting.HasPaging\"\r\n        [totalItems]=\"pagingSetting.TotalRows\"\r\n        (pageChangeStart)=\"onPageChange($event)\"\r\n        [itemsPerPage]=\"pagingSetting.PageSize\"\r\n        [currentPage]=\"currentPage\"\r\n        [displayTextTemplate]=\"showingItems\"\r\n    ></fd-pagination>\r\n</ng-container>\r\n<ng-template #showingItems let-showing=\"showing\">\r\n    <span dir=\"ltr\">\r\n        {{ 'From' | bbbTranslate }} {{ showing.from }} {{ 'To' | bbbTranslate }} {{ showing.to }} {{ totalPageStr }}\r\n    </span>\r\n</ng-template>\r\n", styles: [":host{align-items:center;display:flex;justify-content:center;flex-direction:row-reverse;width:100%}.icons{display:flex;justify-content:space-between;padding:0 15px}.icons ui5-button{color:var(--sapContent_LabelColor)}.icons ui5-button:hover{background:var(--sapBackgroundColor)!important;border-color:transparent!important}.pagesize{align-items:center;display:flex;justify-content:flex-start;flex-direction:row-reverse}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$7.PaginationComponent, selector: "fd-pagination", inputs: ["id", "mobile", "totalItems", "currentPage", "itemsPerPage", "itemsPerPageTemplate", "itemsPerPageLabel", "itemsPerPageOptions", "displayTotalItems", "displayTextTemplate", "firstLabel", "previousLabel", "nextLabel", "lastLabel", "ariaLabel", "pageLabel", "currentPageAriaLabel", "labelBeforeInputMobile", "labelAfterInputMobile", "inputAriaLabel"], outputs: ["pageChangeStart", "itemsPerPageChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UlvPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UlvPagingComponent, selector: "bsu-ulv-paging", outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, host: { properties: { "height.px": "this.height" } }, usesInheritance: true, ngImport: i0, template: "<!-- <ng-container *ngIf=\"config?.Setting?.Data?.Paging?.HasPaging\">\r\n  <div class=\"icons\">\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === totalPage - 1 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onEndClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage + 1 >= totalPage ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-left-arrow\"\r\n      (click)=\"onNextClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage - 1 < 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-right-arrow\"\r\n      (click)=\"onPreviousClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onFirstClick()\"\r\n    ></button>\r\n  </div>\r\n  <div class=\"pagesize\">\r\n    <label style=\"padding: 0 5px\"\r\n      >{{ currentPage * pageSize }}-{{ currentPage * pageSize + pageSize }} \u0627\u0632\r\n      {{ config.Setting.Data.Paging.TotalRows }}</label\r\n    >\r\n    <fd-select (valueChange)=\"onPageSizeChange($event)\" [value]=\"pageSize\">\r\n      <fd-option [value]=\"24\">24</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n    </fd-select>\r\n\r\n    <label style=\"padding: 0 5px\">{{ ItemsPerPage }}:</label>\r\n  </div>\r\n</ng-container> -->\r\n<ng-container *ngIf=\"pagingSetting$ | async as pagingSetting\">\r\n    <fd-pagination\r\n        *ngIf=\"pagingSetting && pagingSetting.HasPaging\"\r\n        [totalItems]=\"pagingSetting.TotalRows\"\r\n        (pageChangeStart)=\"onPageChange($event)\"\r\n        [itemsPerPage]=\"pagingSetting.PageSize\"\r\n        [currentPage]=\"currentPage\"\r\n        [displayTextTemplate]=\"showingItems\"\r\n    ></fd-pagination>\r\n</ng-container>\r\n<ng-template #showingItems let-showing=\"showing\">\r\n    <span dir=\"ltr\">\r\n        {{ 'From' | bbbTranslate }} {{ showing.from }} {{ 'To' | bbbTranslate }} {{ showing.to }} {{ totalPageStr }}\r\n    </span>\r\n</ng-template>\r\n", styles: [":host{align-items:center;display:flex;justify-content:center;flex-direction:row-reverse;width:100%}.icons{display:flex;justify-content:space-between;padding:0 15px}.icons ui5-button{color:var(--sapContent_LabelColor)}.icons ui5-button:hover{background:var(--sapBackgroundColor)!important;border-color:transparent!important}.pagesize{align-items:center;display:flex;justify-content:flex-start;flex-direction:row-reverse}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$6.PaginationComponent, selector: "fd-pagination", inputs: ["id", "mobile", "totalItems", "currentPage", "itemsPerPage", "itemsPerPageTemplate", "itemsPerPageLabel", "itemsPerPageOptions", "displayTotalItems", "displayTextTemplate", "firstLabel", "previousLabel", "nextLabel", "lastLabel", "ariaLabel", "pageLabel", "currentPageAriaLabel", "labelBeforeInputMobile", "labelAfterInputMobile", "inputAriaLabel"], outputs: ["pageChangeStart", "itemsPerPageChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UlvPagingComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-ulv-paging', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- <ng-container *ngIf=\"config?.Setting?.Data?.Paging?.HasPaging\">\r\n  <div class=\"icons\">\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === totalPage - 1 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onEndClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage + 1 >= totalPage ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-left-arrow\"\r\n      (click)=\"onNextClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage - 1 < 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"navigation-right-arrow\"\r\n      (click)=\"onPreviousClick()\"\r\n    ></button>\r\n    <button\r\n      fd-button\r\n      [attr.disabled]=\"currentPage === 0 ? true : null\"\r\n      fdType=\"transparent\"\r\n      glyph=\"begin\"\r\n      (click)=\"onFirstClick()\"\r\n    ></button>\r\n  </div>\r\n  <div class=\"pagesize\">\r\n    <label style=\"padding: 0 5px\"\r\n      >{{ currentPage * pageSize }}-{{ currentPage * pageSize + pageSize }} \u0627\u0632\r\n      {{ config.Setting.Data.Paging.TotalRows }}</label\r\n    >\r\n    <fd-select (valueChange)=\"onPageSizeChange($event)\" [value]=\"pageSize\">\r\n      <fd-option [value]=\"24\">24</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n      <fd-option [value]=\"100\">100</fd-option>\r\n    </fd-select>\r\n\r\n    <label style=\"padding: 0 5px\">{{ ItemsPerPage }}:</label>\r\n  </div>\r\n</ng-container> -->\r\n<ng-container *ngIf=\"pagingSetting$ | async as pagingSetting\">\r\n    <fd-pagination\r\n        *ngIf=\"pagingSetting && pagingSetting.HasPaging\"\r\n        [totalItems]=\"pagingSetting.TotalRows\"\r\n        (pageChangeStart)=\"onPageChange($event)\"\r\n        [itemsPerPage]=\"pagingSetting.PageSize\"\r\n        [currentPage]=\"currentPage\"\r\n        [displayTextTemplate]=\"showingItems\"\r\n    ></fd-pagination>\r\n</ng-container>\r\n<ng-template #showingItems let-showing=\"showing\">\r\n    <span dir=\"ltr\">\r\n        {{ 'From' | bbbTranslate }} {{ showing.from }} {{ 'To' | bbbTranslate }} {{ showing.to }} {{ totalPageStr }}\r\n    </span>\r\n</ng-template>\r\n", styles: [":host{align-items:center;display:flex;justify-content:center;flex-direction:row-reverse;width:100%}.icons{display:flex;justify-content:space-between;padding:0 15px}.icons ui5-button{color:var(--sapContent_LabelColor)}.icons ui5-button:hover{background:var(--sapBackgroundColor)!important;border-color:transparent!important}.pagesize{align-items:center;display:flex;justify-content:flex-start;flex-direction:row-reverse}\n"] }]
@@ -10335,10 +10349,10 @@ class UiPictureFileComponent extends FieldBaseComponent {
     }
 }
 UiPictureFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiPictureFileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-UiPictureFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode" }, 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    [class.inlineEdit]=\"inlineEdit\"\n>\n    <div *ngIf=\"!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)\">\n        <fd-toolbar [fdType]=\"'transparent'\">\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\n            <ng-container *ngIf=\"uploadState$ | async as uploadState\">\n                <ng-container *ngIf=\"uploadState !== 'Complete'\">\n                    <fdp-slider\n                        fd-toolbar-item\n                        [id]=\"id + '1'\"\n                        [name]=\"'slider_' + id\"\n                        [value]=\"progress$ | async\"\n                        [min]=\"0\"\n                        [max]=\"100\"\n                        [step]=\"1\"\n                    >\n                    </fdp-slider>\n                    <button\n                        *ngIf=\"uploadState === 'Uploading'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"stop\"\n                        fdType=\"transparent\"\n                        (click)=\"onTerminate()\"\n                    ></button>\n                    <button\n                        *ngIf=\"uploadState === 'Error'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"refresh\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onRetry()\"\n                    ></button>\n                </ng-container>\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    <div\n        *ngIf=\"!inlineEdit; else avatarTemplate\"\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        [style.text-align]=\"Setting.SizeMode === '3' ? 'center' : null\"\n    >\n        <img\n            *ngIf=\"(value && imageUrl) || Setting.HasDefaultPicture\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n    </div>\n    <ng-template #avatarTemplate>\n        <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    </ng-template>\n</div>\n<bsu-mask *ngIf=\"uploading$ | async\"></bsu-mask>\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 ::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{min-height:140px;width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:end;justify-content:start}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$6.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$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i10$1.SliderComponent, selector: "fdp-slider", inputs: ["class", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "value"], outputs: ["sliderChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UiPictureFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode" }, 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    [class.inlineEdit]=\"inlineEdit\"\n>\n    <div *ngIf=\"!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)\">\n        <fd-toolbar [fdType]=\"'transparent'\">\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\n            <ng-container *ngIf=\"uploadState$ | async as uploadState\">\n                <ng-container *ngIf=\"uploadState !== 'Complete'\">\n                    <fdp-slider\n                        fd-toolbar-item\n                        [id]=\"id + '1'\"\n                        [name]=\"'slider_' + id\"\n                        [value]=\"progress$ | async\"\n                        [min]=\"0\"\n                        [max]=\"100\"\n                        [step]=\"1\"\n                    >\n                    </fdp-slider>\n                    <button\n                        *ngIf=\"uploadState === 'Uploading'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"stop\"\n                        fdType=\"transparent\"\n                        (click)=\"onTerminate()\"\n                    ></button>\n                    <button\n                        *ngIf=\"uploadState === 'Error'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"refresh\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onRetry()\"\n                    ></button>\n                </ng-container>\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    <div\n        *ngIf=\"!inlineEdit; else avatarTemplate\"\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        [style.text-align]=\"Setting.SizeMode === '3' ? 'center' : null\"\n    >\n        <img\n            *ngIf=\"(value && imageUrl) || Setting.HasDefaultPicture\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n    </div>\n    <ng-template #avatarTemplate>\n        <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    </ng-template>\n</div>\n<bsu-mask *ngIf=\"uploading$ | async\"></bsu-mask>\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 ::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{min-height:140px;width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:end;justify-content:flex-start}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$4.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$6.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$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i10$1.SliderComponent, selector: "fdp-slider", inputs: ["class", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "value"], outputs: ["sliderChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiPictureFileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-picture-file', changeDetection: ChangeDetectionStrategy.OnPush, providers: [UploadService], template: "<div\n    [style.max-height.px]=\"Setting.SizeMode === '2' ? null : layoutInfo.ControlBounds.height\"\n    [class.no-inlineEdit]=\"!inlineEdit\"\n    [class.inlineEdit]=\"inlineEdit\"\n>\n    <div *ngIf=\"!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)\">\n        <fd-toolbar [fdType]=\"'transparent'\">\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\n            <ng-container *ngIf=\"uploadState$ | async as uploadState\">\n                <ng-container *ngIf=\"uploadState !== 'Complete'\">\n                    <fdp-slider\n                        fd-toolbar-item\n                        [id]=\"id + '1'\"\n                        [name]=\"'slider_' + id\"\n                        [value]=\"progress$ | async\"\n                        [min]=\"0\"\n                        [max]=\"100\"\n                        [step]=\"1\"\n                    >\n                    </fdp-slider>\n                    <button\n                        *ngIf=\"uploadState === 'Uploading'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"stop\"\n                        fdType=\"transparent\"\n                        (click)=\"onTerminate()\"\n                    ></button>\n                    <button\n                        *ngIf=\"uploadState === 'Error'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"refresh\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onRetry()\"\n                    ></button>\n                </ng-container>\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    <div\n        *ngIf=\"!inlineEdit; else avatarTemplate\"\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        [style.text-align]=\"Setting.SizeMode === '3' ? 'center' : null\"\n    >\n        <img\n            *ngIf=\"(value && imageUrl) || Setting.HasDefaultPicture\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n    </div>\n    <ng-template #avatarTemplate>\n        <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    </ng-template>\n</div>\n<bsu-mask *ngIf=\"uploading$ | async\"></bsu-mask>\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 ::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{min-height:140px;width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:end;justify-content:start}\n"] }]
+            args: [{ selector: 'bsu-ui-picture-file', changeDetection: ChangeDetectionStrategy.OnPush, providers: [UploadService], template: "<div\n    [style.max-height.px]=\"Setting.SizeMode === '2' ? null : layoutInfo.ControlBounds.height\"\n    [class.no-inlineEdit]=\"!inlineEdit\"\n    [class.inlineEdit]=\"inlineEdit\"\n>\n    <div *ngIf=\"!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)\">\n        <fd-toolbar [fdType]=\"'transparent'\">\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\n            <ng-container *ngIf=\"uploadState$ | async as uploadState\">\n                <ng-container *ngIf=\"uploadState !== 'Complete'\">\n                    <fdp-slider\n                        fd-toolbar-item\n                        [id]=\"id + '1'\"\n                        [name]=\"'slider_' + id\"\n                        [value]=\"progress$ | async\"\n                        [min]=\"0\"\n                        [max]=\"100\"\n                        [step]=\"1\"\n                    >\n                    </fdp-slider>\n                    <button\n                        *ngIf=\"uploadState === 'Uploading'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"stop\"\n                        fdType=\"transparent\"\n                        (click)=\"onTerminate()\"\n                    ></button>\n                    <button\n                        *ngIf=\"uploadState === 'Error'\"\n                        fd-toolbar-item\n                        fd-button\n                        glyph=\"refresh\"\n                        [fdType]=\"'transparent'\"\n                        (click)=\"onRetry()\"\n                    ></button>\n                </ng-container>\n            </ng-container>\n        </fd-toolbar>\n    </div>\n    <div\n        *ngIf=\"!inlineEdit; else avatarTemplate\"\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        [style.text-align]=\"Setting.SizeMode === '3' ? 'center' : null\"\n    >\n        <img\n            *ngIf=\"(value && imageUrl) || Setting.HasDefaultPicture\"\n            [src]=\"imageUrl\"\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\n        />\n    </div>\n    <ng-template #avatarTemplate>\n        <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\n    </ng-template>\n</div>\n<bsu-mask *ngIf=\"uploading$ | async\"></bsu-mask>\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 ::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{min-height:140px;width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:end;justify-content:flex-start}\n"] }]
         }], propDecorators: { imageUrl: [{
                 type: Input
             }], sizeMode: [{
@@ -10433,10 +10447,10 @@ class LyLayoutPanelComponent extends LayoutPanelBaseComponent {
     }
 }
 LyLayoutPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LyLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: { renderItems: "renderItems", isRoot: "isRoot" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.flex": "this.flex", "style.display": "this.display" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\n<fd-panel\n    [fixed]=\"!config.ExpandButtonVisible\"\n    *ngIf=\"visible\"\n    [class.hide-header]=\"!config.TextVisible\"\n    [attr.maxWidth]=\"maxWidth\"\n>\n    <h5 fd-panel-title>\n        {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n    </h5>\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">        \n        <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n            <ng-container [ngSwitch]=\"item.xtype\">\n                <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-tab-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-layout-panel'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutContainerComponent',\n                                selector: 'bsu-ly-layout-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LySimpleLabelComponent',\n                                selector: 'bsu-ly-simple-label'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                    <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-horizontal-layout',\n                                    name: 'LyLayoutHorizontalComponent'                                    \n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                    </ng-container>\n                    <ng-template #verticalJoin>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-vertical-layout',\n                                    name: 'LyLayoutVerticalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-layout-control',\n                                name: 'LayoutControlComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            #dynamicLayout\n            let-config\n            let-selector=\"selector\"\n            let-maxLabelWidth=\"maxLabelWidth\"\n            let-name=\"name\"\n        >\n            <bnrc-dynamic-layout\n                [config]=\"config\"\n                [selector]=\"selector\"\n                [name]=\"name\"\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        </ng-template>\n    </div>\n</fd-panel>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}:host ::ng-deep .hide-header .fd-panel__header{display:none}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i3$8.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$8.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$8.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: { renderItems: "renderItems", isRoot: "isRoot" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.flex": "this.flex", "style.display": "this.display" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<canvas #canvas style=\"display: none\"></canvas>\n<fd-panel\n    [fixed]=\"!config.ExpandButtonVisible\"\n    *ngIf=\"visible\"\n    [class.hide-header]=\"!config.TextVisible\"\n    [attr.maxWidth]=\"maxWidth\"\n>\n    <h5 fd-panel-title>\n        {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n    </h5>\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\n        <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n            <ng-container [ngSwitch]=\"item.xtype\">\n                <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-tab-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-layout-panel'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutContainerComponent',\n                                selector: 'bsu-ly-layout-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LySimpleLabelComponent',\n                                selector: 'bsu-ly-simple-label'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                    <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-horizontal-layout',\n                                    name: 'LyLayoutHorizontalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                    </ng-container>\n                    <ng-template #verticalJoin>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-vertical-layout',\n                                    name: 'LyLayoutVerticalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-layout-control',\n                                name: 'LayoutControlComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            #dynamicLayout\n            let-config\n            let-selector=\"selector\"\n            let-maxLabelWidth=\"maxLabelWidth\"\n            let-name=\"name\"\n        >\n            <bnrc-dynamic-layout\n                [config]=\"config\"\n                [selector]=\"selector\"\n                [name]=\"name\"\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        </ng-template>\n    </div>\n</fd-panel>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}:host ::ng-deep .hide-header .fd-panel__header{display:none}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i3$7.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$7.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$7.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\n<fd-panel\n    [fixed]=\"!config.ExpandButtonVisible\"\n    *ngIf=\"visible\"\n    [class.hide-header]=\"!config.TextVisible\"\n    [attr.maxWidth]=\"maxWidth\"\n>\n    <h5 fd-panel-title>\n        {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n    </h5>\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">        \n        <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n            <ng-container [ngSwitch]=\"item.xtype\">\n                <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-tab-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-layout-panel'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutContainerComponent',\n                                selector: 'bsu-ly-layout-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LySimpleLabelComponent',\n                                selector: 'bsu-ly-simple-label'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                    <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-horizontal-layout',\n                                    name: 'LyLayoutHorizontalComponent'                                    \n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                    </ng-container>\n                    <ng-template #verticalJoin>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-vertical-layout',\n                                    name: 'LyLayoutVerticalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-layout-control',\n                                name: 'LayoutControlComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            #dynamicLayout\n            let-config\n            let-selector=\"selector\"\n            let-maxLabelWidth=\"maxLabelWidth\"\n            let-name=\"name\"\n        >\n            <bnrc-dynamic-layout\n                [config]=\"config\"\n                [selector]=\"selector\"\n                [name]=\"name\"\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        </ng-template>\n    </div>\n</fd-panel>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}:host ::ng-deep .hide-header .fd-panel__header{display:none}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"] }]
+            args: [{ selector: 'bsu-ly-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<canvas #canvas style=\"display: none\"></canvas>\n<fd-panel\n    [fixed]=\"!config.ExpandButtonVisible\"\n    *ngIf=\"visible\"\n    [class.hide-header]=\"!config.TextVisible\"\n    [attr.maxWidth]=\"maxWidth\"\n>\n    <h5 fd-panel-title>\n        {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n    </h5>\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\n        <ng-container *ngFor=\"let item of config | filterToolbarControl\">\n            <ng-container [ngSwitch]=\"item.xtype\">\n                <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-tab-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutPanelComponent',\n                                selector: 'bsu-ly-layout-panel'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LyLayoutContainerComponent',\n                                selector: 'bsu-ly-layout-container'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                name: 'LySimpleLabelComponent',\n                                selector: 'bsu-ly-simple-label'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n                    <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-horizontal-layout',\n                                    name: 'LyLayoutHorizontalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n                    </ng-container>\n                    <ng-template #verticalJoin>\n                        <ng-container\n                            *ngTemplateOutlet=\"\n                                dynamicLayout;\n                                context: {\n                                    $implicit: item,\n                                    selector: 'bsu-ly-vertical-layout',\n                                    name: 'LyLayoutVerticalComponent'\n                                }\n                            \"\n                        ></ng-container>\n                        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            dynamicLayout;\n                            context: {\n                                $implicit: item,\n                                selector: 'bsu-layout-control',\n                                name: 'LayoutControlComponent'\n                            }\n                        \"\n                    ></ng-container>\n                    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            #dynamicLayout\n            let-config\n            let-selector=\"selector\"\n            let-maxLabelWidth=\"maxLabelWidth\"\n            let-name=\"name\"\n        >\n            <bnrc-dynamic-layout\n                [config]=\"config\"\n                [selector]=\"selector\"\n                [name]=\"name\"\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        </ng-template>\n    </div>\n</fd-panel>\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start}:host ::ng-deep .hide-header .fd-panel__header{display:none}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"] }]
         }], propDecorators: { renderItems: [{
                 type: Input
             }], isRoot: [{
@@ -10770,7 +10784,7 @@ FormPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
             (formClose)="onFormClose()"
         ></bnrc-form>
         <router-outlet></router-outlet>
-    `, isInline: true, styles: [":host{display:block;background:var(--sapBackgroundColor)}\n"], dependencies: [{ kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "directive", type: i3$6.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, styles: [":host{display:block;background:var(--sapBackgroundColor)}\n"], dependencies: [{ kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "directive", type: i3$5.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-form-page', template: `
@@ -10940,7 +10954,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
 class BarsaSapUiRoutingModule {
 }
 BarsaSapUiRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BarsaSapUiRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiRoutingModule, imports: [i3$6.RouterModule], exports: [RouterModule] });
+BarsaSapUiRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiRoutingModule, imports: [i3$5.RouterModule], exports: [RouterModule] });
 BarsaSapUiRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiRoutingModule, imports: [RouterModule.forChild([]), RouterModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiRoutingModule, decorators: [{
             type: NgModule,
@@ -10973,7 +10987,7 @@ class FormToolbarButtonComponent extends BaseFormToolbaritemPropsComponent {
     }
 }
 FormToolbarButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormToolbarButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FormToolbarButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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    [fd-inline-help]=\"inlineHelp\"\n    [glyph]=\"icon\"\n    [class.control-disabled]=\"isEnable === false ? true : false\"\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\n    (click)=\"btnClick.emit()\"\n>\n    <span *ngIf=\"!onlyIcon || showText\">{{ text }}</span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$9.InlineHelpDirective, selector: "[fd-inline-help], [fd-inline-help-template]", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help", "fd-inline-help-template"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FormToolbarButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", 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    [fd-inline-help]=\"inlineHelp\"\n    [glyph]=\"icon\"\n    [class.control-disabled]=\"isEnable === false ? true : false\"\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\n    (click)=\"btnClick.emit()\"\n>\n    <span *ngIf=\"!onlyIcon || showText\">{{ text }}</span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$8.InlineHelpDirective, selector: "[fd-inline-help], [fd-inline-help-template]", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help", "fd-inline-help-template"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormToolbarButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-form-toolbar-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n    fd-toolbar-item\n    fd-button\n    [fd-inline-help]=\"inlineHelp\"\n    [glyph]=\"icon\"\n    [class.control-disabled]=\"isEnable === false ? true : false\"\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\n    (click)=\"btnClick.emit()\"\n>\n    <span *ngIf=\"!onlyIcon || showText\">{{ text }}</span>\n</button>\n" }]
@@ -11044,35 +11058,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 args: ['container', { read: TemplateRef }]
             }] } });
 
-class BarsaBaseLayoutComponent extends BaseComponent {
-    /**
-     *
-     */
-    constructor(viewRef) {
-        super();
-        this.viewRef = viewRef;
-    }
-    ngOnInit() {
-        super.ngOnInit();
-    }
-}
-BarsaBaseLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaBaseLayoutComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
-BarsaBaseLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaBaseLayoutComponent, selector: "bsu-barsa-base-layout", inputs: { config: "config", maxLabelWidth: "maxLabelWidth", setFlex: "setFlex", hasHorizontalText: "hasHorizontalText", isSearchPanel: "isSearchPanel" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-tab-container', name: 'LyTabContainerComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-layout-panel', name: 'LyLayoutPanelComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-ly-layout-container',\n                        name: 'LyLayoutContainerComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-empty-space', name: 'LyEmptySpaceComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-simple-label', name: 'LySimpleLabelComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-line', name: 'LyLineComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyHorizontalLayoutComponent',\n                            maxLabelWidth: this.maxLabelWidth\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyVerticalLayoutComponent',\n                            maxLabelWidth: this.maxLabelWidth\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        maxLabelWidth: this.maxLabelWidth\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\" let-maxLabelWidth=\"maxLabelWidth\">\n    <bnrc-dynamic-layout\n        [flex]=\"!setFlex ? null : isSearchPanel ? 'unset' : config.Bounds.width\"\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n        [componentContainer]=\"viewRef\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaBaseLayoutComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bsu-barsa-base-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of config | filterToolbarControl\">\n    <ng-container [ngSwitch]=\"item.xtype\">\n        <ng-container *ngSwitchCase=\"'Ly.LayoutTabPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-tab-container', name: 'LyTabContainerComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutPanel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-layout-panel', name: 'LyLayoutPanelComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutContainer'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-ly-layout-container',\n                        name: 'LyLayoutContainerComponent'\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.EmptySpace'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-empty-space', name: 'LyEmptySpaceComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.SimpleLabel'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-simple-label', name: 'LySimpleLabelComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutLine'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: { $implicit: item, selector: 'bsu-ly-line', name: 'LyLineComponent' }\n                \"\n            ></ng-container>\n            <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutJoin'\">\n            <ng-container *ngIf=\"item.Type === 'HorizontalJoin'; else verticalJoin\">\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-horizontal-layout',\n                            name: 'LyHorizontalLayoutComponent',\n                            maxLabelWidth: this.maxLabelWidth\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\n            </ng-container>\n            <ng-template #verticalJoin>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        dynamicLayout;\n                        context: {\n                            $implicit: item,\n                            selector: 'bsu-ly-vertical-layout',\n                            name: 'LyVerticalLayoutComponent',\n                            maxLabelWidth: this.maxLabelWidth\n                        }\n                    \"\n                ></ng-container>\n                <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\n            </ng-template>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'Ly.LayoutControl'\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        maxLabelWidth: this.maxLabelWidth\n                    }\n                \"\n            ></ng-container>\n            <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\n        </ng-container>\n    </ng-container>\n</ng-container>\n<ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\" let-maxLabelWidth=\"maxLabelWidth\">\n    <bnrc-dynamic-layout\n        [flex]=\"!setFlex ? null : isSearchPanel ? 'unset' : config.Bounds.width\"\n        [config]=\"config\"\n        [selector]=\"selector\"\n        [name]=\"name\"\n        [module]=\"'BarsaSapUi'\"\n        [moduleFileName]=\"'BarsaSapUi'\"\n        [maxLabelWidth]=\"maxLabelWidth\"\n        [hasHorizontalText]=\"hasHorizontalText\"\n        [isSearchPanel]=\"isSearchPanel\"\n        [componentContainer]=\"viewRef\"\n    >\n    </bnrc-dynamic-layout>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { config: [{
-                type: Input
-            }], maxLabelWidth: [{
-                type: Input
-            }], setFlex: [{
-                type: Input
-            }], hasHorizontalText: [{
-                type: Input
-            }], isSearchPanel: [{
-                type: Input
-            }] } });
-
 const components = [
     UiTextFieldComponent,
     LyLayoutFieldLabelComponent,
@@ -11218,8 +11203,7 @@ const components = [
     FormToolbarButtonComponent,
     BarsaSearchFormComponent,
     ReportNewTopFormComponent,
-    BarsaNetworkOfflineComponent,
-    BarsaBaseLayoutComponent
+    BarsaNetworkOfflineComponent
 ];
 const pipes = [
     UploadFileStatusPipe,
@@ -11243,15 +11227,15 @@ const INIT_SAPFIORI = (rtlService, contentDensityService, themeService, portalSe
     if (BarsaApi.LoginFormData.Culture === 'en-US') {
         fontFamily = 'IRANSansWeb';
     }
-    const css = `* {
-    --fdDynamicPage_Title_Font_Family: '${fontFamily}';
-    --sapFontFamily: '${fontFamily}';
-    --fdWizard_Label_Font_Family: '${fontFamily}';
-    --sapFontLightFamily: '${fontFamily}';
-    --sapFontHeaderFamily: '${fontFamily}';
-    --_ui5_input_compact_height: 1.625rem;
-    --sapFontSize: 0.885rem;
-    /* --sapContent_HeaderShadow: none; */
+    const css = `* {
+    --fdDynamicPage_Title_Font_Family: '${fontFamily}';
+    --sapFontFamily: '${fontFamily}';
+    --fdWizard_Label_Font_Family: '${fontFamily}';
+    --sapFontLightFamily: '${fontFamily}';
+    --sapFontHeaderFamily: '${fontFamily}';
+    --_ui5_input_compact_height: 1.625rem;
+    --sapFontSize: 0.885rem;
+    /* --sapContent_HeaderShadow: none; */
 }`, head = document.head || document.getElementsByTagName('head')[0], style = document.createElement('style');
     head.appendChild(style);
     style.type = 'text/css';
@@ -11263,78 +11247,83 @@ const INIT_SAPFIORI = (rtlService, contentDensityService, themeService, portalSe
         style.appendChild(document.createTextNode(css));
     }
     portalService.userPortalSettings$.pipe(filter$1((c) => c != null)).subscribe((userSettings) => {
+        let contentDensity;
+        let theme;
         if (!userSettings) {
             if (getDeviceIsMobile() || getDeviceIsPhone() || getDeviceIsTablet()) {
-                contentDensityService.contentDensity.next(ContentDensityEnum.COZY);
+                contentDensity = ContentDensityMode.COZY;
             }
             else {
-                contentDensityService.contentDensity.next(ContentDensityEnum.COMPACT);
+                contentDensity = ContentDensityMode.COMPACT;
             }
         }
         else {
             const { ContentDensity$Caption, Theme$Caption } = userSettings;
-            const contentDensity = ContentDensity$Caption;
-            if (contentDensity) {
-                {
-                    contentDensityService.contentDensity.next(contentDensity);
-                }
-                const bodyClassCompact = 'ui5-content-density-compact';
-                const bodyClassCondensed = 'ui5-content-density-condensed';
-                const bodyClassCozy = 'ui5-content-density-cozy';
-                const body = document === null || document === void 0 ? void 0 : document.body;
-                switch (contentDensity) {
-                    case 'condensed':
-                        {
-                            if (!body.classList.contains(bodyClassCondensed)) {
-                                body.classList.add(bodyClassCondensed);
-                            }
-                            body.classList.remove(bodyClassCompact);
-                            body.classList.remove(bodyClassCozy);
+            contentDensity = ContentDensity$Caption;
+            theme = Theme$Caption;
+        }
+        if (getDeviceIsMobile() || getDeviceIsPhone()) {
+            contentDensity = ContentDensityMode.COZY;
+        }
+        if (contentDensity) {
+            {
+                contentDensityService.updateContentDensity(contentDensity);
+            }
+            const bodyClassCompact = 'ui5-content-density-compact';
+            const bodyClassCondensed = 'ui5-content-density-condensed';
+            const bodyClassCozy = 'ui5-content-density-cozy';
+            const body = document === null || document === void 0 ? void 0 : document.body;
+            switch (contentDensity) {
+                case 'condensed':
+                    {
+                        if (!body.classList.contains(bodyClassCondensed)) {
+                            body.classList.add(bodyClassCondensed);
                         }
-                        break;
-                    case 'cozy':
-                        {
-                            if (!body.classList.contains(bodyClassCozy)) {
-                                body.classList.add(bodyClassCozy);
-                            }
-                            body.classList.remove(bodyClassCompact);
-                            body.classList.remove(bodyClassCondensed);
+                        body.classList.remove(bodyClassCompact);
+                        body.classList.remove(bodyClassCozy);
+                    }
+                    break;
+                case 'cozy':
+                    {
+                        if (!body.classList.contains(bodyClassCozy)) {
+                            body.classList.add(bodyClassCozy);
                         }
-                        break;
-                    case 'compact':
-                        {
-                            if (!body.classList.contains(bodyClassCompact)) {
-                                body.classList.add(bodyClassCompact);
-                            }
-                            body.classList.remove(bodyClassCozy);
-                            body.classList.remove(bodyClassCondensed);
+                        body.classList.remove(bodyClassCompact);
+                        body.classList.remove(bodyClassCondensed);
+                    }
+                    break;
+                case 'compact':
+                    {
+                        if (!body.classList.contains(bodyClassCompact)) {
+                            body.classList.add(bodyClassCompact);
                         }
-                        break;
-                }
+                        body.classList.remove(bodyClassCozy);
+                        body.classList.remove(bodyClassCondensed);
+                    }
+                    break;
             }
-            const theme = Theme$Caption;
-            if (theme) {
-                if (theme.indexOf('dark') > -1) {
-                    document.documentElement.style.setProperty('color-scheme', 'dark');
-                }
-                else {
-                    document.documentElement.style.setProperty('color-scheme', 'light');
-                }
-                portalService.setTheme(themeService.setTheme(theme));
+        }
+        if (theme) {
+            if (theme.indexOf('dark') > -1) {
+                document.documentElement.style.setProperty('color-scheme', 'dark');
             }
+            else {
+                document.documentElement.style.setProperty('color-scheme', 'light');
+            }
+            portalService.setTheme(themeService.setTheme(theme));
         }
     });
 };
 
 const rootProviders = [
     Overlay,
-    ContentDensityService,
+    GlobalContentDensityService,
     ThemesService,
     RtlService,
     {
         provide: APP_INITIALIZER,
         useFactory: INIT_SAPFIORI,
-        deps: [RtlService, ContentDensityService, ThemesService, PortalService],
+        deps: [RtlService, GlobalContentDensityService, ThemesService, PortalService],
         multi: true
     }
 ];
@@ -11353,13 +11342,12 @@ class BarsaSapUiModule extends BaseModule {
     }
 }
 BarsaSapUiModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiModule, deps: [{ token: i2.DynamicComponentService }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.NgModule });
-BarsaSapUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiModule, declarations: [UiTextFieldComponent, LyLayoutFieldLabelComponent, UiCheckBoxComponent, UiSimpleComboComponent, UiRadioGroupComponent, UiGridComponent, LyLayoutContainerOfRootComponent, LyLayoutPanelComponent, UiReadOnlyFieldComponent, UiContainerWithButtonComponent, UiPictureFileComponent, UiMoInfoUlvComboComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiTimeSpanComponent, UiFileLinearListBoxComponent, LyEmptySpaceComponent, UiSinglePictureComponent, UlvSelectionComponent, UlvToolbarComponent, UlvPagingComponent, UiGridSortSettingComponent, UiGridSortItemComponent, UiGridColumnsComponent, MaskComponent, UiInfoBarPanelComponent, UiFormPanelToolbarComponent, UiFormPanelComponent, UiSearchCommandInfoUiComponent, UlvSettingsComponent, UiTinymceComponent, UiButtonComponent, UiDateTimeComponent, FormDialogComponent, HeaderFacetKeyValueComponent, HeaderFacetFormComponent, HeaderFacetRateComponent, HeaderFacetProgressComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, UiMoInfoSubFormUiComponent, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, UiTextAreaComponent, LayoutControlComponent, LayoutWizardComponent, FormWizardComponent, FormDialogLessComponent, FormPageComponent, RichTextStaticComponent, UiPicturesInfoComponent, LyHorizontalLayoutComponent, LyVerticalLayoutComponent, LyTabContainerComponent, LyTabPageComponent, LyLabelComponent, UiMoInfoComboViewerComponent, UlMsgBoxAdapterComponent, UiTreeComponent, PageWithHeaderComponent, HeaderAvatarComponent, EmptyPageComponent, UiWorkflowPanelUiComponent, UlvContextMenuComponent, UlLoadingMaskUiComponent, UiTextFieldAutoCompleteComponent, CaptchaFieldComponent, LySimpleLabelComponent, GlobalSearchPanelComponent, GlobalSearchModuleComponent, GlobalSearchComponent, HyperlinkComponent, StaticTextComponent, UlToastAdapterComponent, MessageStripComponent, UiLinearListContainerWithButtonComponent, FundamentalDynamicFormComponent, LayoutActionsComponent, LyLayoutContainerComponent, UiUlvFormMultiSelectUiComponent, UlvFormMultiSelectComponent, UlvColumnSettingsComponent, UlvFilterSettingsComponent, UlvSortSettingsComponent, UlvGroupbySettingsComponent, BarsaListFileLinearComponent, UiPdfViewerComponent, BarsaTinyemceComponent, UiMonacoEditorComponent, BarsaMonacoEditorComponent, BarsaDateTimePickerComponent, BarsaTreeItemComponent, UiSwitchButtonComponent, UiColorUiComponent, LyLineComponent, UiUlvMainUiComponent, ReportNavigatorComponent, ManageFiltersReportComponent, ReportSearchFieldsManageComponent, ReportSearchFieldsHiddenSettingsComponent, SearchPanelComponent, ReportSearchPanelSaveComponent, UiGridFilterSettingsComponent, UiGridFilterItemComponent, UiDateRangeExComponent, UlNotifyPopupComponent, UiTableViewComponent, UiListViewComponent, UiCardViewComponent, UiReportContainerComponent, NoDataComponent, ColumnRendererComponent, InlineSaveAndCancelComponent, UiTreeViewComponent, InlineSaveAndCancelComponent, UiCalendarComponent, UiAspReportViewerComponent, UiGraphComponent, UiExceptionFormComponent, UiEditableGridComponent, ColumnMatrixRendererComponent, UiMatrixViewComponent, CustomDateTimeComponent, BarsaAspViewerComponent, FileInDialogComponent, UiMoInfoGeneralObjectUiComponent, UiGanttChartComponent, GanttDhtmlChartViewComponent, ProgressIndicatorComponent, CardViewContentComponent, CardItemComponent, UiCardViewHorizontalGroupComponent, TitleComponent, BarsaUlvMainComponent, ListItemComponent, HtreeCreateNewComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BreadcrumbComponent, UiLabelComponent, FormToolbarButtonComponent, BarsaSearchFormComponent, ReportNewTopFormComponent, BarsaNetworkOfflineComponent, BarsaBaseLayoutComponent, UploadFileStatusPipe, SapFontPipe, SapFontClassPipe, StringToArrayPipe, NodeHasOneDepthLevelPipe, MatrixValuePipe, DynamicPageSizePipe, WizardLayoutDirective, ColRendererDirective, ApplyConditionalFormatsDirective, ReportViewRendererDirective, FullscreenDialogDirective], imports: [CommonModule,
+BarsaSapUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiModule, declarations: [UiTextFieldComponent, LyLayoutFieldLabelComponent, UiCheckBoxComponent, UiSimpleComboComponent, UiRadioGroupComponent, UiGridComponent, LyLayoutContainerOfRootComponent, LyLayoutPanelComponent, UiReadOnlyFieldComponent, UiContainerWithButtonComponent, UiPictureFileComponent, UiMoInfoUlvComboComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiTimeSpanComponent, UiFileLinearListBoxComponent, LyEmptySpaceComponent, UiSinglePictureComponent, UlvSelectionComponent, UlvToolbarComponent, UlvPagingComponent, UiGridSortSettingComponent, UiGridSortItemComponent, UiGridColumnsComponent, MaskComponent, UiInfoBarPanelComponent, UiFormPanelToolbarComponent, UiFormPanelComponent, UiSearchCommandInfoUiComponent, UlvSettingsComponent, UiTinymceComponent, UiButtonComponent, UiDateTimeComponent, FormDialogComponent, HeaderFacetKeyValueComponent, HeaderFacetFormComponent, HeaderFacetRateComponent, HeaderFacetProgressComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, UiMoInfoSubFormUiComponent, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, UiTextAreaComponent, LayoutControlComponent, LayoutWizardComponent, FormWizardComponent, FormDialogLessComponent, FormPageComponent, RichTextStaticComponent, UiPicturesInfoComponent, LyHorizontalLayoutComponent, LyVerticalLayoutComponent, LyTabContainerComponent, LyTabPageComponent, LyLabelComponent, UiMoInfoComboViewerComponent, UlMsgBoxAdapterComponent, UiTreeComponent, PageWithHeaderComponent, HeaderAvatarComponent, EmptyPageComponent, UiWorkflowPanelUiComponent, UlvContextMenuComponent, UlLoadingMaskUiComponent, UiTextFieldAutoCompleteComponent, CaptchaFieldComponent, LySimpleLabelComponent, GlobalSearchPanelComponent, GlobalSearchModuleComponent, GlobalSearchComponent, HyperlinkComponent, StaticTextComponent, UlToastAdapterComponent, MessageStripComponent, UiLinearListContainerWithButtonComponent, FundamentalDynamicFormComponent, LayoutActionsComponent, LyLayoutContainerComponent, UiUlvFormMultiSelectUiComponent, UlvFormMultiSelectComponent, UlvColumnSettingsComponent, UlvFilterSettingsComponent, UlvSortSettingsComponent, UlvGroupbySettingsComponent, BarsaListFileLinearComponent, UiPdfViewerComponent, BarsaTinyemceComponent, UiMonacoEditorComponent, BarsaMonacoEditorComponent, BarsaDateTimePickerComponent, BarsaTreeItemComponent, UiSwitchButtonComponent, UiColorUiComponent, LyLineComponent, UiUlvMainUiComponent, ReportNavigatorComponent, ManageFiltersReportComponent, ReportSearchFieldsManageComponent, ReportSearchFieldsHiddenSettingsComponent, SearchPanelComponent, ReportSearchPanelSaveComponent, UiGridFilterSettingsComponent, UiGridFilterItemComponent, UiDateRangeExComponent, UlNotifyPopupComponent, UiTableViewComponent, UiListViewComponent, UiCardViewComponent, UiReportContainerComponent, NoDataComponent, ColumnRendererComponent, InlineSaveAndCancelComponent, UiTreeViewComponent, InlineSaveAndCancelComponent, UiCalendarComponent, UiAspReportViewerComponent, UiGraphComponent, UiExceptionFormComponent, UiEditableGridComponent, ColumnMatrixRendererComponent, UiMatrixViewComponent, CustomDateTimeComponent, BarsaAspViewerComponent, FileInDialogComponent, UiMoInfoGeneralObjectUiComponent, UiGanttChartComponent, GanttDhtmlChartViewComponent, ProgressIndicatorComponent, CardViewContentComponent, CardItemComponent, UiCardViewHorizontalGroupComponent, TitleComponent, BarsaUlvMainComponent, ListItemComponent, HtreeCreateNewComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BreadcrumbComponent, UiLabelComponent, FormToolbarButtonComponent, BarsaSearchFormComponent, ReportNewTopFormComponent, BarsaNetworkOfflineComponent, UploadFileStatusPipe, SapFontPipe, SapFontClassPipe, StringToArrayPipe, NodeHasOneDepthLevelPipe, MatrixValuePipe, DynamicPageSizePipe, WizardLayoutDirective, ColRendererDirective, ApplyConditionalFormatsDirective, ReportViewRendererDirective, FullscreenDialogDirective], imports: [CommonModule,
         FormsModule,
         ReactiveFormsModule,
         BarsaNovinRayCoreModule,
         DragDropModule,
         CdkTableModule,
-        BarsaSapUiRoutingModule,
         FundamentalNgxCoreModule,
         FacetModule,
         WizardModule,
@@ -11370,14 +11358,14 @@ BarsaSapUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         ColorSwatchesModule,
         ColorChromeModule,
         ClipboardModule,
-        BarsaCalendarModule, i1$1.ContentDensityModule], exports: [UiTextFieldComponent, LyLayoutFieldLabelComponent, UiCheckBoxComponent, UiSimpleComboComponent, UiRadioGroupComponent, UiGridComponent, LyLayoutContainerOfRootComponent, LyLayoutPanelComponent, UiReadOnlyFieldComponent, UiContainerWithButtonComponent, UiPictureFileComponent, UiMoInfoUlvComboComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiTimeSpanComponent, UiFileLinearListBoxComponent, LyEmptySpaceComponent, UiSinglePictureComponent, UlvSelectionComponent, UlvToolbarComponent, UlvPagingComponent, UiGridSortSettingComponent, UiGridSortItemComponent, UiGridColumnsComponent, MaskComponent, UiInfoBarPanelComponent, UiFormPanelToolbarComponent, UiFormPanelComponent, UiSearchCommandInfoUiComponent, UlvSettingsComponent, UiTinymceComponent, UiButtonComponent, UiDateTimeComponent, FormDialogComponent, HeaderFacetKeyValueComponent, HeaderFacetFormComponent, HeaderFacetRateComponent, HeaderFacetProgressComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, UiMoInfoSubFormUiComponent, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, UiTextAreaComponent, LayoutControlComponent, LayoutWizardComponent, FormWizardComponent, FormDialogLessComponent, FormPageComponent, RichTextStaticComponent, UiPicturesInfoComponent, LyHorizontalLayoutComponent, LyVerticalLayoutComponent, LyTabContainerComponent, LyTabPageComponent, LyLabelComponent, UiMoInfoComboViewerComponent, UlMsgBoxAdapterComponent, UiTreeComponent, PageWithHeaderComponent, HeaderAvatarComponent, EmptyPageComponent, UiWorkflowPanelUiComponent, UlvContextMenuComponent, UlLoadingMaskUiComponent, UiTextFieldAutoCompleteComponent, CaptchaFieldComponent, LySimpleLabelComponent, GlobalSearchPanelComponent, GlobalSearchModuleComponent, GlobalSearchComponent, HyperlinkComponent, StaticTextComponent, UlToastAdapterComponent, MessageStripComponent, UiLinearListContainerWithButtonComponent, FundamentalDynamicFormComponent, LayoutActionsComponent, LyLayoutContainerComponent, UiUlvFormMultiSelectUiComponent, UlvFormMultiSelectComponent, UlvColumnSettingsComponent, UlvFilterSettingsComponent, UlvSortSettingsComponent, UlvGroupbySettingsComponent, BarsaListFileLinearComponent, UiPdfViewerComponent, BarsaTinyemceComponent, UiMonacoEditorComponent, BarsaMonacoEditorComponent, BarsaDateTimePickerComponent, BarsaTreeItemComponent, UiSwitchButtonComponent, UiColorUiComponent, LyLineComponent, UiUlvMainUiComponent, ReportNavigatorComponent, ManageFiltersReportComponent, ReportSearchFieldsManageComponent, ReportSearchFieldsHiddenSettingsComponent, SearchPanelComponent, ReportSearchPanelSaveComponent, UiGridFilterSettingsComponent, UiGridFilterItemComponent, UiDateRangeExComponent, UlNotifyPopupComponent, UiTableViewComponent, UiListViewComponent, UiCardViewComponent, UiReportContainerComponent, NoDataComponent, ColumnRendererComponent, InlineSaveAndCancelComponent, UiTreeViewComponent, InlineSaveAndCancelComponent, UiCalendarComponent, UiAspReportViewerComponent, UiGraphComponent, UiExceptionFormComponent, UiEditableGridComponent, ColumnMatrixRendererComponent, UiMatrixViewComponent, CustomDateTimeComponent, BarsaAspViewerComponent, FileInDialogComponent, UiMoInfoGeneralObjectUiComponent, UiGanttChartComponent, GanttDhtmlChartViewComponent, ProgressIndicatorComponent, CardViewContentComponent, CardItemComponent, UiCardViewHorizontalGroupComponent, TitleComponent, BarsaUlvMainComponent, ListItemComponent, HtreeCreateNewComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BreadcrumbComponent, UiLabelComponent, FormToolbarButtonComponent, BarsaSearchFormComponent, ReportNewTopFormComponent, BarsaNetworkOfflineComponent, BarsaBaseLayoutComponent, WizardLayoutDirective, ColRendererDirective, ApplyConditionalFormatsDirective, ReportViewRendererDirective, FullscreenDialogDirective, UploadFileStatusPipe, SapFontPipe, SapFontClassPipe, StringToArrayPipe, NodeHasOneDepthLevelPipe, MatrixValuePipe, DynamicPageSizePipe] });
+        BarsaCalendarModule,
+        BarsaSapUiRoutingModule, i1$1.ContentDensityModule], exports: [UiTextFieldComponent, LyLayoutFieldLabelComponent, UiCheckBoxComponent, UiSimpleComboComponent, UiRadioGroupComponent, UiGridComponent, LyLayoutContainerOfRootComponent, LyLayoutPanelComponent, UiReadOnlyFieldComponent, UiContainerWithButtonComponent, UiPictureFileComponent, UiMoInfoUlvComboComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiTimeSpanComponent, UiFileLinearListBoxComponent, LyEmptySpaceComponent, UiSinglePictureComponent, UlvSelectionComponent, UlvToolbarComponent, UlvPagingComponent, UiGridSortSettingComponent, UiGridSortItemComponent, UiGridColumnsComponent, MaskComponent, UiInfoBarPanelComponent, UiFormPanelToolbarComponent, UiFormPanelComponent, UiSearchCommandInfoUiComponent, UlvSettingsComponent, UiTinymceComponent, UiButtonComponent, UiDateTimeComponent, FormDialogComponent, HeaderFacetKeyValueComponent, HeaderFacetFormComponent, HeaderFacetRateComponent, HeaderFacetProgressComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, UiMoInfoSubFormUiComponent, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, UiTextAreaComponent, LayoutControlComponent, LayoutWizardComponent, FormWizardComponent, FormDialogLessComponent, FormPageComponent, RichTextStaticComponent, UiPicturesInfoComponent, LyHorizontalLayoutComponent, LyVerticalLayoutComponent, LyTabContainerComponent, LyTabPageComponent, LyLabelComponent, UiMoInfoComboViewerComponent, UlMsgBoxAdapterComponent, UiTreeComponent, PageWithHeaderComponent, HeaderAvatarComponent, EmptyPageComponent, UiWorkflowPanelUiComponent, UlvContextMenuComponent, UlLoadingMaskUiComponent, UiTextFieldAutoCompleteComponent, CaptchaFieldComponent, LySimpleLabelComponent, GlobalSearchPanelComponent, GlobalSearchModuleComponent, GlobalSearchComponent, HyperlinkComponent, StaticTextComponent, UlToastAdapterComponent, MessageStripComponent, UiLinearListContainerWithButtonComponent, FundamentalDynamicFormComponent, LayoutActionsComponent, LyLayoutContainerComponent, UiUlvFormMultiSelectUiComponent, UlvFormMultiSelectComponent, UlvColumnSettingsComponent, UlvFilterSettingsComponent, UlvSortSettingsComponent, UlvGroupbySettingsComponent, BarsaListFileLinearComponent, UiPdfViewerComponent, BarsaTinyemceComponent, UiMonacoEditorComponent, BarsaMonacoEditorComponent, BarsaDateTimePickerComponent, BarsaTreeItemComponent, UiSwitchButtonComponent, UiColorUiComponent, LyLineComponent, UiUlvMainUiComponent, ReportNavigatorComponent, ManageFiltersReportComponent, ReportSearchFieldsManageComponent, ReportSearchFieldsHiddenSettingsComponent, SearchPanelComponent, ReportSearchPanelSaveComponent, UiGridFilterSettingsComponent, UiGridFilterItemComponent, UiDateRangeExComponent, UlNotifyPopupComponent, UiTableViewComponent, UiListViewComponent, UiCardViewComponent, UiReportContainerComponent, NoDataComponent, ColumnRendererComponent, InlineSaveAndCancelComponent, UiTreeViewComponent, InlineSaveAndCancelComponent, UiCalendarComponent, UiAspReportViewerComponent, UiGraphComponent, UiExceptionFormComponent, UiEditableGridComponent, ColumnMatrixRendererComponent, UiMatrixViewComponent, CustomDateTimeComponent, BarsaAspViewerComponent, FileInDialogComponent, UiMoInfoGeneralObjectUiComponent, UiGanttChartComponent, GanttDhtmlChartViewComponent, ProgressIndicatorComponent, CardViewContentComponent, CardItemComponent, UiCardViewHorizontalGroupComponent, TitleComponent, BarsaUlvMainComponent, ListItemComponent, HtreeCreateNewComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BreadcrumbComponent, UiLabelComponent, FormToolbarButtonComponent, BarsaSearchFormComponent, ReportNewTopFormComponent, BarsaNetworkOfflineComponent, WizardLayoutDirective, ColRendererDirective, ApplyConditionalFormatsDirective, ReportViewRendererDirective, FullscreenDialogDirective, UploadFileStatusPipe, SapFontPipe, SapFontClassPipe, StringToArrayPipe, NodeHasOneDepthLevelPipe, MatrixValuePipe, DynamicPageSizePipe] });
 BarsaSapUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaSapUiModule, providers: [{ provide: DIALOG_SERVICE, useClass: DialogService }], imports: [CommonModule,
         FormsModule,
         ReactiveFormsModule,
         BarsaNovinRayCoreModule,
         DragDropModule,
         CdkTableModule,
-        BarsaSapUiRoutingModule,
         FundamentalNgxCoreModule,
         FacetModule,
         WizardModule,
@@ -11389,6 +11377,7 @@ BarsaSapUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", versio
         ColorChromeModule,
         ClipboardModule,
         BarsaCalendarModule,
+        BarsaSapUiRoutingModule,
         ContentDensityModule.forRoot({
             storage: 'localStorage',
             storageKey: '__contentDensity__',
@@ -11406,7 +11395,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                         BarsaNovinRayCoreModule,
                         DragDropModule,
                         CdkTableModule,
-                        BarsaSapUiRoutingModule,
                         FundamentalNgxCoreModule,
                         FacetModule,
                         WizardModule,
@@ -11418,6 +11406,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                         ColorChromeModule,
                         ClipboardModule,
                         BarsaCalendarModule,
+                        BarsaSapUiRoutingModule,
                         ContentDensityModule.forRoot({
                             storage: 'localStorage',
                             storageKey: '__contentDensity__',
@@ -11433,5 +11422,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ApplyConditionalFormatsDirective, BarsaAspViewerComponent, BarsaBaseLayoutComponent, BarsaDateTimePickerComponent, BarsaListFileLinearComponent, BarsaMonacoEditorComponent, BarsaNetworkOfflineComponent, BarsaSapUiModule, BarsaSapUiRoutingModule, BarsaSearchFormComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BarsaTinyemceComponent, BarsaTreeItemComponent, BarsaUlvMainComponent, BreadcrumbComponent, CaptchaFieldComponent, CardItemComponent, CardViewContentComponent, ColRendererDirective, ColumnMatrixRendererComponent, ColumnRendererComponent, CustomDateTimeComponent, DeviceInfoFieldBaseComponent, DynamicPageSizePipe, EmptyPageComponent, FileInDialogComponent, FormDialogComponent, FormDialogLessComponent, FormPageBaseComponent, FormPageComponent, FormToolbarButtonComponent, FormWizardComponent, FullscreenDialogDirective, FundamentalDynamicFormComponent, GanttDhtmlChartViewComponent, GlobalSearchComponent, GlobalSearchModuleComponent, GlobalSearchPanelComponent, HeaderAvatarComponent, HeaderFacetFormComponent, HeaderFacetKeyValueComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, HeaderFacetProgressComponent, HeaderFacetRateComponent, HtreeCreateNewComponent, HyperlinkComponent, IconBusinessSuite, IconTNT, InlineSaveAndCancelComponent, LayoutActionsComponent, LayoutControlComponent, LayoutWizardComponent, ListItemComponent, LyEmptySpaceComponent, LyHorizontalLayoutComponent, LyLabelComponent, LyLayoutContainerComponent, LyLayoutContainerOfRootComponent, LyLayoutFieldLabelComponent, LyLayoutPanelComponent, LyLineComponent, LySimpleLabelComponent, LyTabContainerComponent, LyTabPageComponent, LyVerticalLayoutComponent, ManageFiltersReportComponent, MaskComponent, MatrixValuePipe, MessageStripComponent, NoDataComponent, NodeHasOneDepthLevelPipe, PageWithFormHandlerBaseComponent, PageWithHeaderComponent, ProgressIndicatorComponent, ReportNavigatorComponent, ReportNewTopFormComponent, ReportSearchFieldsHiddenSettingsComponent, ReportSearchFieldsManageComponent, ReportSearchPanelSaveComponent, ReportViewRendererDirective, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, RichTextStaticComponent, SapFontClassPipe, SapFontPipe, SapUiReportBaseComponent, SearchPanelComponent, StaticTextComponent, StringToArrayPipe, TitleComponent, UiAspReportViewerComponent, UiButtonComponent, UiCalendarComponent, UiCardViewComponent, UiCardViewHorizontalGroupComponent, UiCheckBoxComponent, UiColorUiComponent, UiContainerWithButtonComponent, UiDateRangeExComponent, UiDateTimeComponent, UiEditableGridComponent, UiExceptionFormComponent, UiFileLinearListBoxComponent, UiFormPanelComponent, UiFormPanelToolbarComponent, UiGanttChartComponent, UiGraphComponent, UiGridColumnsComponent, UiGridComponent, UiGridFilterItemComponent, UiGridFilterSettingsComponent, UiGridSortItemComponent, UiGridSortSettingComponent, UiInfoBarPanelComponent, UiLabelComponent, UiLinearListContainerWithButtonComponent, UiListViewComponent, UiMatrixViewComponent, UiMoInfoComboViewerComponent, UiMoInfoGeneralObjectUiComponent, UiMoInfoSubFormUiComponent, UiMoInfoUlvComboComponent, UiMonacoEditorComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiPdfViewerComponent, UiPictureFileComponent, UiPicturesInfoComponent, UiRadioGroupComponent, UiReadOnlyFieldComponent, UiReportContainerComponent, UiSearchCommandInfoUiComponent, UiSimpleComboComponent, UiSinglePictureComponent, UiSwitchButtonComponent, UiTableViewComponent, UiTextAreaComponent, UiTextFieldAutoCompleteComponent, UiTextFieldComponent, UiTimeSpanComponent, UiTinymceComponent, UiTreeComponent, UiTreeViewComponent, UiUlvFormMultiSelectUiComponent, UiUlvMainUiComponent, UiWorkflowPanelUiComponent, UlLoadingMaskUiComponent, UlMsgBoxAdapterComponent, UlNotifyPopupComponent, UlToastAdapterComponent, UlvColumnSettingsComponent, UlvContextMenuComponent, UlvFilterSettingsComponent, UlvFormMultiSelectComponent, UlvGroupbySettingsComponent, UlvPagingComponent, UlvSelectionComponent, UlvSettingsComponent, UlvSortSettingsComponent, UlvToolbarComponent, UploadFileStatusPipe, WidthTypeEnum, WizardLayoutDirective, _trimEnd, getNestedValue, insertAvatar, sort$1 as sort };
+export { ApplyConditionalFormatsDirective, BarsaAspViewerComponent, BarsaDateTimePickerComponent, BarsaListFileLinearComponent, BarsaMonacoEditorComponent, BarsaNetworkOfflineComponent, BarsaSapUiModule, BarsaSapUiRoutingModule, BarsaSearchFormComponent, BarsaTableHeaderComponent, BarsaTableRowComponent, BarsaTinyemceComponent, BarsaTreeItemComponent, BarsaUlvMainComponent, BreadcrumbComponent, CaptchaFieldComponent, CardItemComponent, CardViewContentComponent, ColRendererDirective, ColumnMatrixRendererComponent, ColumnRendererComponent, CustomDateTimeComponent, DeviceInfoFieldBaseComponent, DynamicPageSizePipe, EmptyPageComponent, FileInDialogComponent, FormDialogComponent, FormDialogLessComponent, FormPageBaseComponent, FormPageComponent, FormToolbarButtonComponent, FormWizardComponent, FullscreenDialogDirective, FundamentalDynamicFormComponent, GanttDhtmlChartViewComponent, GlobalSearchComponent, GlobalSearchModuleComponent, GlobalSearchPanelComponent, HeaderAvatarComponent, HeaderFacetFormComponent, HeaderFacetKeyValueComponent, HeaderFacetMicrochartComponent, HeaderFacetPlainTextComponent, HeaderFacetProgressComponent, HeaderFacetRateComponent, HtreeCreateNewComponent, HyperlinkComponent, IconBusinessSuite, IconTNT, InlineSaveAndCancelComponent, LayoutActionsComponent, LayoutControlComponent, LayoutWizardComponent, ListItemComponent, LyEmptySpaceComponent, LyHorizontalLayoutComponent, LyLabelComponent, LyLayoutContainerComponent, LyLayoutContainerOfRootComponent, LyLayoutFieldLabelComponent, LyLayoutPanelComponent, LyLineComponent, LySimpleLabelComponent, LyTabContainerComponent, LyTabPageComponent, LyVerticalLayoutComponent, ManageFiltersReportComponent, MaskComponent, MatrixValuePipe, MessageStripComponent, NoDataComponent, NodeHasOneDepthLevelPipe, PageWithFormHandlerBaseComponent, PageWithHeaderComponent, ProgressIndicatorComponent, ReportNavigatorComponent, ReportNewTopFormComponent, ReportSearchFieldsHiddenSettingsComponent, ReportSearchFieldsManageComponent, ReportSearchPanelSaveComponent, ReportViewRendererDirective, ResponsiveToolbarComponent, ResponsiveToolbarRendererComponent, RichTextStaticComponent, SapFontClassPipe, SapFontPipe, SapUiReportBaseComponent, SearchPanelComponent, StaticTextComponent, StringToArrayPipe, TitleComponent, UiAspReportViewerComponent, UiButtonComponent, UiCalendarComponent, UiCardViewComponent, UiCardViewHorizontalGroupComponent, UiCheckBoxComponent, UiColorUiComponent, UiContainerWithButtonComponent, UiDateRangeExComponent, UiDateTimeComponent, UiEditableGridComponent, UiExceptionFormComponent, UiFileLinearListBoxComponent, UiFormPanelComponent, UiFormPanelToolbarComponent, UiGanttChartComponent, UiGraphComponent, UiGridColumnsComponent, UiGridComponent, UiGridFilterItemComponent, UiGridFilterSettingsComponent, UiGridSortItemComponent, UiGridSortSettingComponent, UiInfoBarPanelComponent, UiLabelComponent, UiLinearListContainerWithButtonComponent, UiListViewComponent, UiMatrixViewComponent, UiMoInfoComboViewerComponent, UiMoInfoGeneralObjectUiComponent, UiMoInfoSubFormUiComponent, UiMoInfoUlvComboComponent, UiMonacoEditorComponent, UiMultiSelectComboComponent, UiNumDecimalUiComponent, UiNumIntUiComponent, UiPdfViewerComponent, UiPictureFileComponent, UiPicturesInfoComponent, UiRadioGroupComponent, UiReadOnlyFieldComponent, UiReportContainerComponent, UiSearchCommandInfoUiComponent, UiSimpleComboComponent, UiSinglePictureComponent, UiSwitchButtonComponent, UiTableViewComponent, UiTextAreaComponent, UiTextFieldAutoCompleteComponent, UiTextFieldComponent, UiTimeSpanComponent, UiTinymceComponent, UiTreeComponent, UiTreeViewComponent, UiUlvFormMultiSelectUiComponent, UiUlvMainUiComponent, UiWorkflowPanelUiComponent, UlLoadingMaskUiComponent, UlMsgBoxAdapterComponent, UlNotifyPopupComponent, UlToastAdapterComponent, UlvColumnSettingsComponent, UlvContextMenuComponent, UlvFilterSettingsComponent, UlvFormMultiSelectComponent, UlvGroupbySettingsComponent, UlvPagingComponent, UlvSelectionComponent, UlvSettingsComponent, UlvSortSettingsComponent, UlvToolbarComponent, UploadFileStatusPipe, WidthTypeEnum, WizardLayoutDirective, _trimEnd, getNestedValue, insertAvatar, sort$1 as sort };
 //# sourceMappingURL=barsa-sap-ui.mjs.map