barsa-sap-ui 1.0.410 → 1.0.412

package/fesm2020/barsa-sap-ui.mjs

@@ -3943,6 +3943,7 @@ class UiTreeComponent extends ReportTreeBaseComponent {
         if (ev.checked) {
             ev.node.Data.$IsChecked = true;
             selectedNode = ev.node;
+            this.context.selNode = selectedNode;
             this.context.fireEvent('rowselect', this.context, ev.index, ev.node.Data);
         }
         else {
@@ -3956,7 +3957,6 @@ class UiTreeComponent extends ReportTreeBaseComponent {
             }
             this.context.fireEvent('rowdeselect', this.context, ev.index, ev.node.Data);
         }
-        this.context.selNode = selectedNode;
         this._selectedNodeSource.next(selectedNode);
         this._rebindRoot();
     }
@@ -5083,10 +5083,10 @@ class BarsaTableHeaderComponent extends BaseComponent {
     }
 }
 BarsaTableHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaTableHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BarsaTableHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", rowIndicator: "rowIndicator", rtl: "rtl", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", fitToContent: "fitToContent", fitToContainer: "fitToContainer", fitToColumn: "fitToColumn", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter" }, viewQueries: [{ propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        <ng-container *ngIf=\"!hideHeader\">\n            <th *ngIf=\"rowIndicator\" fd-table-cell fd-table-status-indicator></th>\n            <th fd-table-cell *ngIf=\"isCheckList\">\n                <fd-checkbox\n                    name=\"allCheckbox\"\n                    [ngModel]=\"allChecked\"\n                    (ngModelChange)=\"onAllCheckbox($event)\"\n                ></fd-checkbox>\n            </th>\n            <th fd-table-cell *ngIf=\"!isCheckList\" class=\"single-select\"></th>\n            <ng-container *ngFor=\"let column of columns; let i = index; let last = last; trackBy: _trackByColumn\">\n                <th\n                    *ngIf=\"startIndex <= i\"\n                    #thRef\n                    [columnIndex]=\"i\"\n                    fd-table-cell\n                    [style.width]=\"last ? null : column.FieldTypeId === 38 ? '40px' : column.$Width2 || column.$Width\"\n                    [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n                    resizable\n                    [rtl]=\"rtl\"\n                    [disableResize]=\"last\"\n                    (widthChange)=\"onColumnWidthChange(column)\"\n                    (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n                    [disableResponsive]=\"disableResponsive\"\n                    [tableWidth]=\"tableWidth\"\n                    [columnsWidth]=\"columnsWidth\"\n                    [attr.columnName]=\"column.Name\"\n                    [attr.index]=\"i\"\n                    [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n                    [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n                >\n                    <fd-popover #menu>\n                        <fd-popover-control>\n                            <div style=\"display: flex\">\n                                <!-- FieldTypeId 38 means it is auto row number field-->\n                                <img\n                                    [src]=\"column.Icon\"\n                                    *ngIf=\"\n                                        (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) &&\n                                            column.Icon;\n                                        else captionTpl\n                                    \"\n                                />\n                                <ng-template #captionTpl>\n                                    {{ column.Caption | bbbTranslate }}\n                                </ng-template>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body>\n                            <ul fd-list>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-ascending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortDescending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-descending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContent.emit(column)\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContainer.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToColumn.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <!-- <li fd-list-item>\n                                    <a fd-list-link (click)=\"onFilter(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                                        <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                                    </a>\n                                </li> -->\n                            </ul>\n                        </fd-popover-body>\n                    </fd-popover>\n                </th>\n            </ng-container>\n            <ng-container *ngIf=\"contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode\">\n                <th\n                    class=\"col-header col-context-menu\"\n                    fd-table-cell\n                    [fitContent]=\"disableOverflowContextMenu\"\n                    [style.width.px]=\"contextMenuWidth\"\n                ></th>\n            </ng-container>\n            <th\n                class=\"col-header col-details\"\n                [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\"\n                fd-table-cell\n                *ngIf=\"showDetailsInRow && !inlineEditMode\"\n            ></th>\n            <th class=\"col-header col-view\" [style.width.px]=\"40\" fd-table-cell *ngIf=\"showViewButton\"></th>\n        </ng-container>\n    </tr>\n</thead>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$1.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: i8.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i8.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i8.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i8.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "component", type: i6$3.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: i4$2.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i4$2.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i4$2.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i4$2.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BarsaTableHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", rowIndicator: "rowIndicator", rtl: "rtl", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", fitToContent: "fitToContent", fitToContainer: "fitToContainer", fitToColumn: "fitToColumn", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter" }, viewQueries: [{ propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        <ng-container *ngIf=\"!hideHeader\">\n            <th *ngIf=\"rowIndicator\" fd-table-cell fd-table-status-indicator></th>\n            <th fd-table-cell *ngIf=\"isCheckList\">\n                <fd-checkbox\n                    name=\"allCheckbox\"\n                    [ngModel]=\"allChecked\"\n                    (ngModelChange)=\"onAllCheckbox($event)\"\n                ></fd-checkbox>\n            </th>\n            <th fd-table-cell *ngIf=\"!isCheckList\" class=\"single-select\"></th>\n            <ng-container *ngFor=\"let column of columns; let i = index; let last = last; trackBy: _trackByColumn\">\n                <th\n                    *ngIf=\"startIndex <= i\"\n                    #thRef\n                    [columnIndex]=\"i\"\n                    fd-table-cell\n                    [style.width]=\"\n                        inlineEditMode\n                            ? '210px'\n                            : last\n                            ? null\n                            : column.FieldTypeId === 38\n                            ? '40px'\n                            : column.$Width2 || column.$Width\n                    \"\n                    [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n                    resizable\n                    [rtl]=\"rtl\"\n                    [disableResize]=\"last\"\n                    (widthChange)=\"onColumnWidthChange(column)\"\n                    (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n                    [disableResponsive]=\"disableResponsive\"\n                    [tableWidth]=\"tableWidth\"\n                    [columnsWidth]=\"columnsWidth\"\n                    [attr.columnName]=\"column.Name\"\n                    [attr.index]=\"i\"\n                    [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n                    [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n                >\n                    <fd-popover #menu>\n                        <fd-popover-control>\n                            <div style=\"display: flex\">\n                                <!-- FieldTypeId 38 means it is auto row number field-->\n                                <img\n                                    [src]=\"column.Icon\"\n                                    *ngIf=\"\n                                        (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) &&\n                                            column.Icon;\n                                        else captionTpl\n                                    \"\n                                />\n                                <ng-template #captionTpl>\n                                    {{ column.Caption | bbbTranslate }}\n                                </ng-template>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body>\n                            <ul fd-list>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-ascending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortDescending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-descending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContent.emit(column)\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContainer.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToColumn.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <!-- <li fd-list-item>\n                                    <a fd-list-link (click)=\"onFilter(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                                        <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                                    </a>\n                                </li> -->\n                            </ul>\n                        </fd-popover-body>\n                    </fd-popover>\n                </th>\n            </ng-container>\n            <ng-container *ngIf=\"contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode\">\n                <th\n                    class=\"col-header col-context-menu\"\n                    fd-table-cell\n                    [fitContent]=\"disableOverflowContextMenu\"\n                    [style.width.px]=\"contextMenuWidth\"\n                ></th>\n            </ng-container>\n            <th\n                class=\"col-header col-details\"\n                [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\"\n                fd-table-cell\n                *ngIf=\"showDetailsInRow && !inlineEditMode\"\n            ></th>\n            <th class=\"col-header col-view\" [style.width.px]=\"40\" fd-table-cell *ngIf=\"showViewButton\"></th>\n        </ng-container>\n    </tr>\n</thead>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$1.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: i8.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i8.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i8.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i8.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "component", type: i6$3.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: i4$2.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: i4$2.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i4$2.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i4$2.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaTableHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-table-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        <ng-container *ngIf=\"!hideHeader\">\n            <th *ngIf=\"rowIndicator\" fd-table-cell fd-table-status-indicator></th>\n            <th fd-table-cell *ngIf=\"isCheckList\">\n                <fd-checkbox\n                    name=\"allCheckbox\"\n                    [ngModel]=\"allChecked\"\n                    (ngModelChange)=\"onAllCheckbox($event)\"\n                ></fd-checkbox>\n            </th>\n            <th fd-table-cell *ngIf=\"!isCheckList\" class=\"single-select\"></th>\n            <ng-container *ngFor=\"let column of columns; let i = index; let last = last; trackBy: _trackByColumn\">\n                <th\n                    *ngIf=\"startIndex <= i\"\n                    #thRef\n                    [columnIndex]=\"i\"\n                    fd-table-cell\n                    [style.width]=\"last ? null : column.FieldTypeId === 38 ? '40px' : column.$Width2 || column.$Width\"\n                    [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n                    resizable\n                    [rtl]=\"rtl\"\n                    [disableResize]=\"last\"\n                    (widthChange)=\"onColumnWidthChange(column)\"\n                    (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n                    [disableResponsive]=\"disableResponsive\"\n                    [tableWidth]=\"tableWidth\"\n                    [columnsWidth]=\"columnsWidth\"\n                    [attr.columnName]=\"column.Name\"\n                    [attr.index]=\"i\"\n                    [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n                    [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n                >\n                    <fd-popover #menu>\n                        <fd-popover-control>\n                            <div style=\"display: flex\">\n                                <!-- FieldTypeId 38 means it is auto row number field-->\n                                <img\n                                    [src]=\"column.Icon\"\n                                    *ngIf=\"\n                                        (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) &&\n                                            column.Icon;\n                                        else captionTpl\n                                    \"\n                                />\n                                <ng-template #captionTpl>\n                                    {{ column.Caption | bbbTranslate }}\n                                </ng-template>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body>\n                            <ul fd-list>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-ascending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortDescending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-descending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContent.emit(column)\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContainer.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToColumn.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <!-- <li fd-list-item>\n                                    <a fd-list-link (click)=\"onFilter(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                                        <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                                    </a>\n                                </li> -->\n                            </ul>\n                        </fd-popover-body>\n                    </fd-popover>\n                </th>\n            </ng-container>\n            <ng-container *ngIf=\"contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode\">\n                <th\n                    class=\"col-header col-context-menu\"\n                    fd-table-cell\n                    [fitContent]=\"disableOverflowContextMenu\"\n                    [style.width.px]=\"contextMenuWidth\"\n                ></th>\n            </ng-container>\n            <th\n                class=\"col-header col-details\"\n                [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\"\n                fd-table-cell\n                *ngIf=\"showDetailsInRow && !inlineEditMode\"\n            ></th>\n            <th class=\"col-header col-view\" [style.width.px]=\"40\" fd-table-cell *ngIf=\"showViewButton\"></th>\n        </ng-container>\n    </tr>\n</thead>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"] }]
+            args: [{ selector: 'bsu-barsa-table-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<thead\n    fd-table-header\n    [class.inline-edit]=\"inlineEditMode\"\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n    [attr.columnsWidth]=\"columnsWidth\"\n    [attr.tableWidth]=\"tableWidth\"\n>\n    <tr fd-table-row>\n        <ng-container *ngIf=\"!hideHeader\">\n            <th *ngIf=\"rowIndicator\" fd-table-cell fd-table-status-indicator></th>\n            <th fd-table-cell *ngIf=\"isCheckList\">\n                <fd-checkbox\n                    name=\"allCheckbox\"\n                    [ngModel]=\"allChecked\"\n                    (ngModelChange)=\"onAllCheckbox($event)\"\n                ></fd-checkbox>\n            </th>\n            <th fd-table-cell *ngIf=\"!isCheckList\" class=\"single-select\"></th>\n            <ng-container *ngFor=\"let column of columns; let i = index; let last = last; trackBy: _trackByColumn\">\n                <th\n                    *ngIf=\"startIndex <= i\"\n                    #thRef\n                    [columnIndex]=\"i\"\n                    fd-table-cell\n                    [style.width]=\"\n                        inlineEditMode\n                            ? '210px'\n                            : last\n                            ? null\n                            : column.FieldTypeId === 38\n                            ? '40px'\n                            : column.$Width2 || column.$Width\n                    \"\n                    [style.min-width]=\"last ? null : inlineEditMode ? '210px' : last ? '100%' : 'auto'\"\n                    resizable\n                    [rtl]=\"rtl\"\n                    [disableResize]=\"last\"\n                    (widthChange)=\"onColumnWidthChange(column)\"\n                    (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n                    [disableResponsive]=\"disableResponsive\"\n                    [tableWidth]=\"tableWidth\"\n                    [columnsWidth]=\"columnsWidth\"\n                    [attr.columnName]=\"column.Name\"\n                    [attr.index]=\"i\"\n                    [ngClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n                    [class.displayIcon]=\"column.Extra?.IconDisplayTypeEnum\"\n                >\n                    <fd-popover #menu>\n                        <fd-popover-control>\n                            <div style=\"display: flex\">\n                                <!-- FieldTypeId 38 means it is auto row number field-->\n                                <img\n                                    [src]=\"column.Icon\"\n                                    *ngIf=\"\n                                        (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) &&\n                                            column.Icon;\n                                        else captionTpl\n                                    \"\n                                />\n                                <ng-template #captionTpl>\n                                    {{ column.Caption | bbbTranslate }}\n                                </ng-template>\n                            </div>\n                        </fd-popover-control>\n                        <fd-popover-body>\n                            <ul fd-list>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-ascending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"onSortDescending(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"sort-descending\"></fd-menu-addon>\n                                        <span fd-list-title\n                                            >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n                                        >\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContent.emit(column)\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToContainer.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <li fd-list-item>\n                                    <a fd-list-link (click)=\"menu.close(); fitToColumn.emit()\">\n                                        <fd-menu-addon position=\"before\"></fd-menu-addon>\n                                        <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n                                    </a>\n                                </li>\n                                <!-- <li fd-list-item>\n                                    <a fd-list-link (click)=\"onFilter(column, menu)\">\n                                        <fd-menu-addon position=\"before\" glyph=\"filter\"></fd-menu-addon>\n                                        <span fd-list-title>{{ 'Filter' | bbbTranslate }}</span>\n                                    </a>\n                                </li> -->\n                            </ul>\n                        </fd-popover-body>\n                    </fd-popover>\n                </th>\n            </ng-container>\n            <ng-container *ngIf=\"contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode\">\n                <th\n                    class=\"col-header col-context-menu\"\n                    fd-table-cell\n                    [fitContent]=\"disableOverflowContextMenu\"\n                    [style.width.px]=\"contextMenuWidth\"\n                ></th>\n            </ng-container>\n            <th\n                class=\"col-header col-details\"\n                [style.width]=\"deviceSize === 's' ? 'auto' : '120px'\"\n                fd-table-cell\n                *ngIf=\"showDetailsInRow && !inlineEditMode\"\n            ></th>\n            <th class=\"col-header col-view\" [style.width.px]=\"40\" fd-table-cell *ngIf=\"showViewButton\"></th>\n        </ng-container>\n    </tr>\n</thead>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { thList: [{
                 type: ViewChildren,
                 args: ['thRef', { read: ElementRef }]
@@ -5209,10 +5209,10 @@ 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    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n>\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            style=\"font-weight: bold; font-size: 1rem\"\n            [attr.colspan]=\"\n                columns.length +\n                1 +\n                (rowIndicator ? -1 : 0) +\n                (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n                (showViewButton ? 1 : 0) +\n                (showDetailsInRow && !inlineEditMode ? 1 : 0)\n            \"\n            class=\"row-group\"\n            [class.mobile-mode]=\"secondaryColumns?.length\"\n            [attr.level]=\"level\"\n            [class.root-group]=\"level === 0\"\n        >\n            <button\n                fd-button\n                [fdType]=\"'transparent'\"\n                [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n                class=\"cell-expand\"\n                (click)=\"onExpandClick()\"\n            ></button>\n            {{ mo.$Group }}\n        </td>\n    </ng-container>\n    <ng-template #renderRow>\n        <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <div\n                *ngIf=\"workflowState?.state === 'Pending'\"\n                style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\"\n            >\n                <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n            </div>\n\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)=\"!isCheckList && 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        <ng-container *ngFor=\"let column of columns; let columnIndex = index\">\n            <td\n                *ngIf=\"(rowIndicator && columnIndex > 0) || !rowIndicator\"\n                [attr.dbName]=\"column.Name\"\n                #tdEl\n                fd-table-cell\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"tdEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n                [focusable]=\"false\"\n                (click)=\"!isCheckList && !(inlineEditMode && allowInlineEdit) && 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,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </td>\n        </ng-container>\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                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n        </td>\n        <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    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\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            [styleIndex]=\"styleIndex\"\n            [dbName]=\"column.Name\"\n        >\n            <label fd-form-label>{{ column.Caption }} :</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr\n    [class.detailCollapsed]=\"detailsCollapsed\"\n    *ngIf=\"cartableParams?.moId\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [UlvMainCtrlr]=\"UlvMainCtrlr\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Settings\"\n                [editMode]=\"inlineEditMode\"\n                [formSetting]=\"formSetting\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [deviceSize]=\"deviceSize\"\n                [index]=\"index\"\n                [allColumns]=\"allColumns\"\n                [typeDefId]=\"typeDefId\"\n            ></bnrc-dynamic-item-component>\n        </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                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        <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,\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    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip\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<tr *ngIf=\"workflowState?.state === 'Finish' && workflowState?.error\" fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    <bsu-barsa-column-indicator\n        [hideBorderBottom]=\"!detailsCollapsed\"\n        *ngIf=\"rowIndicator\"\n        [backColor]=\"rowIndicatorColor\"\n    >\n    </bsu-barsa-column-indicator>\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)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}\n"], dependencies: [{ kind: "directive", type: i1.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i4$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$1.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: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i9$2.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "directive", type: i4$2.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i4$2.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i4$2.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column" }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+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    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n>\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            style=\"font-weight: bold; font-size: 1rem\"\n            [attr.colspan]=\"\n                columns.length +\n                1 +\n                (rowIndicator ? -1 : 0) +\n                (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n                (showViewButton ? 1 : 0) +\n                (showDetailsInRow && !inlineEditMode ? 1 : 0)\n            \"\n            class=\"row-group\"\n            [class.mobile-mode]=\"secondaryColumns?.length\"\n            [attr.level]=\"level\"\n            [class.root-group]=\"level === 0\"\n        >\n            <button\n                fd-button\n                [fdType]=\"'transparent'\"\n                [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n                class=\"cell-expand\"\n                (click)=\"onExpandClick()\"\n            ></button>\n            {{ mo.$Group }}\n        </td>\n    </ng-container>\n    <ng-template #renderRow>\n        <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <div\n                *ngIf=\"workflowState?.state === 'Pending'\"\n                style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\"\n            >\n                <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n            </div>\n\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)=\"!isCheckList && 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        <ng-container *ngFor=\"let column of columns; let columnIndex = index\">\n            <td\n                *ngIf=\"(rowIndicator && columnIndex > 0) || !rowIndicator\"\n                [attr.dbName]=\"column.Name\"\n                #tdEl\n                fd-table-cell\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"tdEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n                [focusable]=\"false\"\n                (click)=\"!isCheckList && !(inlineEditMode && allowInlineEdit) && 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,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </td>\n        </ng-container>\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                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n        </td>\n        <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    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\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            [styleIndex]=\"styleIndex\"\n            [dbName]=\"column.Name\"\n        >\n            <label fd-form-label>{{ column.Caption }} :</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr\n    [class.detailCollapsed]=\"detailsCollapsed\"\n    *ngIf=\"cartableParams?.moId\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [UlvMainCtrlr]=\"UlvMainCtrlr\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Settings\"\n                [editMode]=\"inlineEditMode\"\n                [formSetting]=\"formSetting\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [deviceSize]=\"deviceSize\"\n                [index]=\"index\"\n                [allColumns]=\"allColumns\"\n                [typeDefId]=\"typeDefId\"\n            ></bnrc-dynamic-item-component>\n        </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                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        <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,\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    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip\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<tr *ngIf=\"workflowState?.state === 'Finish' && workflowState?.error\" fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [allColumns]=\"allColumns\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    <bsu-barsa-column-indicator\n        [hideBorderBottom]=\"!detailsCollapsed\"\n        *ngIf=\"rowIndicator\"\n        [backColor]=\"rowIndicatorColor\"\n    >\n    </bsu-barsa-column-indicator>\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)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}\n"], dependencies: [{ kind: "directive", type: i1.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i4$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6$1.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: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i9$2.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "dismissLabel", "width", "minWidth", "marginBottom"], outputs: ["onDismiss"] }, { kind: "directive", type: i4$2.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i4$2.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "tabindex", "hoverable", "fitContent", "noPadding", "noData", "key", "cellFocusedEventAnnouncer"] }, { kind: "directive", type: i4$2.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column" }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "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    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n>\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            style=\"font-weight: bold; font-size: 1rem\"\n            [attr.colspan]=\"\n                columns.length +\n                1 +\n                (rowIndicator ? -1 : 0) +\n                (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n                (showViewButton ? 1 : 0) +\n                (showDetailsInRow && !inlineEditMode ? 1 : 0)\n            \"\n            class=\"row-group\"\n            [class.mobile-mode]=\"secondaryColumns?.length\"\n            [attr.level]=\"level\"\n            [class.root-group]=\"level === 0\"\n        >\n            <button\n                fd-button\n                [fdType]=\"'transparent'\"\n                [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n                class=\"cell-expand\"\n                (click)=\"onExpandClick()\"\n            ></button>\n            {{ mo.$Group }}\n        </td>\n    </ng-container>\n    <ng-template #renderRow>\n        <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <div\n                *ngIf=\"workflowState?.state === 'Pending'\"\n                style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\"\n            >\n                <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n            </div>\n\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)=\"!isCheckList && 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        <ng-container *ngFor=\"let column of columns; let columnIndex = index\">\n            <td\n                *ngIf=\"(rowIndicator && columnIndex > 0) || !rowIndicator\"\n                [attr.dbName]=\"column.Name\"\n                #tdEl\n                fd-table-cell\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"tdEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n                [focusable]=\"false\"\n                (click)=\"!isCheckList && !(inlineEditMode && allowInlineEdit) && 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,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </td>\n        </ng-container>\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                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n        </td>\n        <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    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\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            [styleIndex]=\"styleIndex\"\n            [dbName]=\"column.Name\"\n        >\n            <label fd-form-label>{{ column.Caption }} :</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr\n    [class.detailCollapsed]=\"detailsCollapsed\"\n    *ngIf=\"cartableParams?.moId\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [UlvMainCtrlr]=\"UlvMainCtrlr\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Settings\"\n                [editMode]=\"inlineEditMode\"\n                [formSetting]=\"formSetting\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [deviceSize]=\"deviceSize\"\n                [index]=\"index\"\n                [allColumns]=\"allColumns\"\n                [typeDefId]=\"typeDefId\"\n            ></bnrc-dynamic-item-component>\n        </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                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        <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,\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    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip\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<tr *ngIf=\"workflowState?.state === 'Finish' && workflowState?.error\" fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    <bsu-barsa-column-indicator\n        [hideBorderBottom]=\"!detailsCollapsed\"\n        *ngIf=\"rowIndicator\"\n        [backColor]=\"rowIndicatorColor\"\n    >\n    </bsu-barsa-column-indicator>\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)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}\n"] }]
+            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    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [main]=\"true\"\n    [focusable]=\"true\"\n    [attr.aria-selected]=\"isChecked\"\n    [focusable]=\"!inlineEditMode || !allowInlineEdit\"\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n>\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            style=\"font-weight: bold; font-size: 1rem\"\n            [attr.colspan]=\"\n                columns.length +\n                1 +\n                (rowIndicator ? -1 : 0) +\n                (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n                (showViewButton ? 1 : 0) +\n                (showDetailsInRow && !inlineEditMode ? 1 : 0)\n            \"\n            class=\"row-group\"\n            [class.mobile-mode]=\"secondaryColumns?.length\"\n            [attr.level]=\"level\"\n            [class.root-group]=\"level === 0\"\n        >\n            <button\n                fd-button\n                [fdType]=\"'transparent'\"\n                [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n                class=\"cell-expand\"\n                (click)=\"onExpandClick()\"\n            ></button>\n            {{ mo.$Group }}\n        </td>\n    </ng-container>\n    <ng-template #renderRow>\n        <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n        <td fd-table-cell *ngIf=\"isCheckList\">\n            <div\n                *ngIf=\"workflowState?.state === 'Pending'\"\n                style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\"\n            >\n                <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n            </div>\n\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)=\"!isCheckList && 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        <ng-container *ngFor=\"let column of columns; let columnIndex = index\">\n            <td\n                *ngIf=\"(rowIndicator && columnIndex > 0) || !rowIndicator\"\n                [attr.dbName]=\"column.Name\"\n                #tdEl\n                fd-table-cell\n                [applyConditionalFormats]=\"conditionalFormats\"\n                [hostEl]=\"tdEl\"\n                [styleIndex]=\"styleIndex\"\n                [dbName]=\"column.Name\"\n                [focusable]=\"false\"\n                (click)=\"!isCheckList && !(inlineEditMode && allowInlineEdit) && 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,\n                            layout94: layout$ | async\n                        }\n                    \"\n                ></ng-container>\n            </td>\n        </ng-container>\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                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n        </td>\n        <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    class=\"secondary-row\"\n    [class.no-edit-mode]=\"!inlineEditMode\"\n    [applyConditionalFormats]=\"conditionalFormats\"\n    [styleIndex]=\"styleIndex\"\n    [hostEl]=\"trEl\"\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\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            [styleIndex]=\"styleIndex\"\n            [dbName]=\"column.Name\"\n        >\n            <label fd-form-label>{{ column.Caption }} :</label>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    columnTemplate;\n                    context: {\n                        $implicit: column,\n                        mo: mo,\n                        index: columnIndex,\n                        inlineEditMode: inlineEditMode,\n                        layout94: layout$ | async\n                    }\n                \"\n            ></ng-container>\n        </p>\n    </td>\n</tr>\n<tr\n    [class.detailCollapsed]=\"detailsCollapsed\"\n    *ngIf=\"cartableParams?.moId\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems.length ? 1 : 0) +\n            (canView ? 1 : 0) +\n            (showDetailsInRow ? 1 : 0)\n        \"\n    >\n        <ng-container>\n            <bnrc-form\n                #cartableFormRef\n                class=\"cartable-template\"\n                [inlineEditInReport]=\"true\"\n                [params]=\"cartableParams\"\n                (beforeTransition)=\"onCartableBeforeTansition()\"\n                (afterTransition)=\"onCartableAfterTansition($event)\"\n                (bruleAction)=\"onCartableBruleAction($event)\"\n                (click)=\"OnCartableFormClick($event)\"\n                (formClose)=\"onCartableFormClosed()\"\n            ></bnrc-form>\n        </ng-container>\n    </td>\n</tr>\n<tr\n    *ngIf=\"!detailsCollapsed && detailsComponent?.Selector\"\n    fd-table-row\n    class=\"showdetails\"\n    [attr.aria-selected]=\"isChecked\"\n>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n    <td\n        (click)=\"onRowCheck()\"\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <ng-container *ngTemplateOutlet=\"detailsColumnsTemplate\"></ng-container>\n        <ng-container *ngIf=\"detailsComponent && detailsComponent.Selector\">\n            <bnrc-dynamic-item-component\n                [component]=\"detailsComponent\"\n                [mo]=\"mo\"\n                [isChecked]=\"isChecked\"\n                [UlvMainCtrlr]=\"UlvMainCtrlr\"\n                [setting]=\"detailsComponentSetting\"\n                [parameters]=\"detailsComponent.Settings\"\n                [editMode]=\"inlineEditMode\"\n                [formSetting]=\"formSetting\"\n                [rtl]=\"rtl\"\n                [deviceName]=\"deviceName\"\n                [deviceSize]=\"deviceSize\"\n                [index]=\"index\"\n                [allColumns]=\"allColumns\"\n                [typeDefId]=\"typeDefId\"\n            ></bnrc-dynamic-item-component>\n        </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                layout94: layout$\n            }\n        \"\n    ></ng-container>\n</ng-template>\n<ng-template #detailsFormItems let-detailsColumns let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout$=\"layout$\">\n    <div class=\"form-items\">\n        <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,\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    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip\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<tr *ngIf=\"workflowState?.state === 'Finish' && workflowState?.error\" fd-table-row>\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n    <td\n        fd-table-cell\n        [attr.colspan]=\"\n            columns.length +\n            1 +\n            (rowIndicator ? -1 : 0) +\n            (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n            (showViewButton ? 1 : 0) +\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\n        \"\n    >\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n        </fd-message-strip>\n    </td>\n</tr>\n<ng-template\n    #columnTemplate\n    let-column\n    let-mo=\"mo\"\n    let-index=\"index\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-layout94=\"layout94\"\n>\n    <bsu-barsa-table-column\n        [mo]=\"mo\"\n        [allColumns]=\"allColumns\"\n        [column]=\"column\"\n        [value]=\"column | columnValue: mo\"\n        [icon]=\"column | columnIcon: mo\"\n        [customComponent]=\"column.$CustomComponent\"\n        [column]=\"column\"\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [isChecked]=\"isChecked\"\n        [index]=\"index\"\n        [formSetting]=\"formSetting\"\n        [rtl]=\"rtl\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [layout94]=\"layout94\"\n        (save)=\"onEditFormPanelSave(null)\"\n        (cancel)=\"onEditFormPanelCancel(null)\"\n        (tab)=\"onTabKeyDown($event, index)\"\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n    >\n    </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n    <bsu-barsa-column-indicator\n        [hideBorderBottom]=\"!detailsCollapsed\"\n        *ngIf=\"rowIndicator\"\n        [backColor]=\"rowIndicatorColor\"\n    >\n    </bsu-barsa-column-indicator>\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)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}\n"] }]
         }], propDecorators: { showDetailsInRow: [{
                 type: Input
             }], detailsComponent: [{
@@ -8869,6 +8869,7 @@ class LyTabContainerComponent extends LayoutItemBaseComponent {
         super(...arguments);
         this._tabsSource = new BehaviorSubject([]);
         this.tabs$ = this._tabsSource.asObservable();
+        this.ready = false;
     }
     ngOnInit() {
         super.ngOnInit();
@@ -8877,6 +8878,10 @@ class LyTabContainerComponent extends LayoutItemBaseComponent {
         this.formPanelService.groupLayout$.pipe(takeUntil(this._onDestroy$)).subscribe(() => {
             this._setTabs();
         });
+        setTimeout(() => {
+            this.ready = true;
+            this._cdr.detectChanges();
+        }, 0);
     }
     _setTabs() {
         const tabs = this.config.items;
@@ -8889,10 +8894,10 @@ class LyTabContainerComponent extends LayoutItemBaseComponent {
     }
 }
 LyTabContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LyTabContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LyTabContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyTabContainerComponent, selector: "bsu-ly-tab-container", host: { properties: { "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-tab-list\n    [collapseOverflow]=\"true\"\n    [expandOverflowText]=\"'More' | bbbTranslate\"\n    (selectedTabChange)=\"onSelectedTabChange($event)\"\n>\n    <ng-container *ngFor=\"let tabPage of tabs$ | async; let tabindex = index\">\n        <fd-tab\n            [title]=\"tabPage.Title || '' | bbbTranslate\"\n            [disabled]=\"tabPage.disabled\"\n            [class.control-disabled]=\"tabPage.Enable === false\"\n            [class.readonly]=\"tabPage.Readonly\"\n            [class.is-expanded]=\"selectedTabTitle === (tabPage.Title || '' | bbbTranslate)\"\n        >\n            <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\n        </fd-tab>\n    </ng-container>\n</fd-tab-list>\n", styles: [":host{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LyTabContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LyTabContainerComponent, selector: "bsu-ly-tab-container", host: { properties: { "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"ready\">\n    <fd-tab-list\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        (selectedTabChange)=\"onSelectedTabChange($event)\"\n    >\n        <ng-container *ngFor=\"let tabPage of tabs$ | async; let tabindex = index\">\n            <fd-tab\n                [title]=\"tabPage.Title || '' | bbbTranslate\"\n                [disabled]=\"tabPage.disabled\"\n                [class.control-disabled]=\"tabPage.Enable === false\"\n                [class.readonly]=\"tabPage.Readonly\"\n                [class.is-expanded]=\"true || selectedTabTitle === (tabPage.Title || '' | bbbTranslate)\"\n            >\n                <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-container>\n", styles: [":host{width:100%}\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: i14.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i14.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { 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: LyTabContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-tab-list\n    [collapseOverflow]=\"true\"\n    [expandOverflowText]=\"'More' | bbbTranslate\"\n    (selectedTabChange)=\"onSelectedTabChange($event)\"\n>\n    <ng-container *ngFor=\"let tabPage of tabs$ | async; let tabindex = index\">\n        <fd-tab\n            [title]=\"tabPage.Title || '' | bbbTranslate\"\n            [disabled]=\"tabPage.disabled\"\n            [class.control-disabled]=\"tabPage.Enable === false\"\n            [class.readonly]=\"tabPage.Readonly\"\n            [class.is-expanded]=\"selectedTabTitle === (tabPage.Title || '' | bbbTranslate)\"\n        >\n            <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\n        </fd-tab>\n    </ng-container>\n</fd-tab-list>\n", styles: [":host{width:100%}\n"] }]
+            args: [{ selector: 'bsu-ly-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"ready\">\n    <fd-tab-list\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        (selectedTabChange)=\"onSelectedTabChange($event)\"\n    >\n        <ng-container *ngFor=\"let tabPage of tabs$ | async; let tabindex = index\">\n            <fd-tab\n                [title]=\"tabPage.Title || '' | bbbTranslate\"\n                [disabled]=\"tabPage.disabled\"\n                [class.control-disabled]=\"tabPage.Enable === false\"\n                [class.readonly]=\"tabPage.Readonly\"\n                [class.is-expanded]=\"true || selectedTabTitle === (tabPage.Title || '' | bbbTranslate)\"\n            >\n                <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-container>\n", styles: [":host{width:100%}\n"] }]
         }], propDecorators: { tabpages: [{
                 type: ViewChildren,
                 args: [TabPanelComponent]
@@ -9828,6 +9833,8 @@ class UiTextAreaComponent extends FieldBaseComponent {
             minHeight = layoutInfo.MinSize.height;
         }
         this.minHeight = minHeight;
+        this.isEmbedHtml = this.parameters?.IsEmbedHtml;
+        this.safeHtml = this._domSanitizer.bypassSecurityTrustHtml(this.value);
     }
     ngAfterViewInit() {
         super.ngAfterViewInit();
@@ -9841,6 +9848,9 @@ class UiTextAreaComponent extends FieldBaseComponent {
         this._calcTextAreaHeight2();
     }
     _calcTextAreaHeight2() {
+        if (this.isEmbedHtml || !this.textarea) {
+            return;
+        }
         const elTextArea = this.textarea.nativeElement;
         elTextArea.style.height = '1px';
         elTextArea.style.height = 10 + elTextArea.scrollHeight + 'px';
@@ -9848,10 +9858,10 @@ class UiTextAreaComponent extends FieldBaseComponent {
     }
 }
 UiTextAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiTextAreaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-UiTextAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiTextAreaComponent, selector: "bsu-ui-text-area", viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<textarea\r\n    #textarea\r\n    fd-form-control\r\n    [id]=\"id\"\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [disabled]=\"(disable$ | async) === true ? true : null\"\r\n    growing=\"true\"\r\n    wrapType=\"hard\"\r\n    [value]=\"!value ? '' : value\"\r\n    (input)=\"onValueChange($event)\"\r\n    (keyup)=\"onKeyup()\"\r\n    [style.min-height.px]=\"minHeight\"\r\n></textarea>\r\n", styles: [":host{display:block}textarea{width:100%;overflow:hidden}\n"], dependencies: [{ kind: "component", type: i2$1.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class"] }, { kind: "directive", type: i2$1.TextareaFormControlDirective, selector: "textarea[fd-form-control]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UiTextAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiTextAreaComponent, selector: "bsu-ui-text-area", viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isEmbedHtml; else embedHtml\">\n    <textarea\n        #textarea\n        fd-form-control\n        [id]=\"id\"\n        [placeholder]=\"Setting.NullText || ''\"\n        [readonly]=\"(readonly$ | async) === true ? true : null\"\n        [disabled]=\"(disable$ | async) === true ? true : null\"\n        growing=\"true\"\n        wrapType=\"hard\"\n        [value]=\"!value ? '' : value\"\n        (input)=\"onValueChange($event)\"\n        (keyup)=\"onKeyup()\"\n        [style.min-height.px]=\"minHeight\"\n    ></textarea>\n</ng-container>\n<ng-template #embedHtml>\n    <div [innerHTML]=\"safeHtml\"></div>\n</ng-template>\n", styles: [":host{display:block}textarea{width:100%;overflow:hidden}\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.TextareaFormControlDirective, selector: "textarea[fd-form-control]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiTextAreaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-text-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<textarea\r\n    #textarea\r\n    fd-form-control\r\n    [id]=\"id\"\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [disabled]=\"(disable$ | async) === true ? true : null\"\r\n    growing=\"true\"\r\n    wrapType=\"hard\"\r\n    [value]=\"!value ? '' : value\"\r\n    (input)=\"onValueChange($event)\"\r\n    (keyup)=\"onKeyup()\"\r\n    [style.min-height.px]=\"minHeight\"\r\n></textarea>\r\n", styles: [":host{display:block}textarea{width:100%;overflow:hidden}\n"] }]
+            args: [{ selector: 'bsu-ui-text-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!isEmbedHtml; else embedHtml\">\n    <textarea\n        #textarea\n        fd-form-control\n        [id]=\"id\"\n        [placeholder]=\"Setting.NullText || ''\"\n        [readonly]=\"(readonly$ | async) === true ? true : null\"\n        [disabled]=\"(disable$ | async) === true ? true : null\"\n        growing=\"true\"\n        wrapType=\"hard\"\n        [value]=\"!value ? '' : value\"\n        (input)=\"onValueChange($event)\"\n        (keyup)=\"onKeyup()\"\n        [style.min-height.px]=\"minHeight\"\n    ></textarea>\n</ng-container>\n<ng-template #embedHtml>\n    <div [innerHTML]=\"safeHtml\"></div>\n</ng-template>\n", styles: [":host{display:block}textarea{width:100%;overflow:hidden}\n"] }]
         }], propDecorators: { textarea: [{
                 type: ViewChild,
                 args: ['textarea', { read: ElementRef }]
@@ -10257,7 +10267,7 @@ class FormDialogComponent extends BaseComponent {
     // @Input() RefreshFormPanelControl = (formpanelCtrlr) => {};
     _close() {
         // this.dialogRef.nativeElement.close();
-        this.Adapter.Control.fireEvent('RequestForClose', this.Adapter.Control);
+        this.Adapter.Control.fireEvent('RequestForClose', this.Adapter.Control, true);
         // this.dialogRef.close();
         // this.dialogParams.close();
         // this.dialogOpened = false;
@@ -11682,6 +11692,11 @@ class UiTextFieldComponent extends FieldBaseComponent {
     get MinSize() {
         return { width: 0, height: 30 };
     }
+    ngOnInit() {
+        super.ngOnInit();
+        this.isEmbedHtml = this.parameters?.IsEmbedHtml;
+        this.safeHtml = this._domSanitizer.bypassSecurityTrustHtml(this.value);
+    }
     onValueChange(e) {
         this.value = e.target.value;
         this.valueChange.emit(this.value);
@@ -11710,10 +11725,10 @@ class UiTextFieldComponent extends FieldBaseComponent {
     }
 }
 UiTextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiTextFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-UiTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiTextFieldComponent, selector: "bsu-ui-text-field", inputs: { value: "value", MinSize: "MinSize" }, usesInheritance: true, ngImport: i0, template: "<input\r\n    fd-form-control\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n    [attr.type]=\"Setting.IsPassword ? 'password' : 'text'\"\r\n    [value]=\"!value ? '' : value\"\r\n    [attr.maxLength]=\"Setting.MaxLength !== undefined ? Setting.MaxLength : null\"\r\n    [id]=\"id\"\r\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    (input)=\"onValueChange($event)\"\r\n    (keydown)=\"onKeyDown($event)\"\r\n/>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ 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: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+UiTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiTextFieldComponent, selector: "bsu-ui-text-field", inputs: { value: "value", MinSize: "MinSize" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isEmbedHtml; else embedHtml\">\n    <input\n        fd-form-control\n        [placeholder]=\"Setting.NullText || ''\"\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n        [attr.type]=\"Setting.IsPassword ? 'password' : 'text'\"\n        [value]=\"!value ? '' : value\"\n        [attr.maxLength]=\"Setting.MaxLength !== undefined ? Setting.MaxLength : null\"\n        [id]=\"id\"\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n        (input)=\"onValueChange($event)\"\n        (keydown)=\"onKeyDown($event)\"\n    />\n</ng-container>\n<ng-template #embedHtml>\n    <div [innerHTML]=\"safeHtml\"></div>\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%}\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: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiTextFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-text-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\r\n    fd-form-control\r\n    [placeholder]=\"Setting.NullText || ''\"\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n    [attr.type]=\"Setting.IsPassword ? 'password' : 'text'\"\r\n    [value]=\"!value ? '' : value\"\r\n    [attr.maxLength]=\"Setting.MaxLength !== undefined ? Setting.MaxLength : null\"\r\n    [id]=\"id\"\r\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    (input)=\"onValueChange($event)\"\r\n    (keydown)=\"onKeyDown($event)\"\r\n/>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
+            args: [{ selector: 'bsu-ui-text-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!isEmbedHtml; else embedHtml\">\n    <input\n        fd-form-control\n        [placeholder]=\"Setting.NullText || ''\"\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\n        [attr.type]=\"Setting.IsPassword ? 'password' : 'text'\"\n        [value]=\"!value ? '' : value\"\n        [attr.maxLength]=\"Setting.MaxLength !== undefined ? Setting.MaxLength : null\"\n        [id]=\"id\"\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n        (input)=\"onValueChange($event)\"\n        (keydown)=\"onKeyDown($event)\"\n    />\n</ng-container>\n<ng-template #embedHtml>\n    <div [innerHTML]=\"safeHtml\"></div>\n</ng-template>\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
         }], propDecorators: { value: [{
                 type: Input
             }], MinSize: [{
@@ -12465,10 +12480,10 @@ class BarsaCardLayoutPanelComponent extends LayoutPanelBaseComponent {
     }
 }
 BarsaCardLayoutPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaCardLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-BarsaCardLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaCardLayoutPanelComponent, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-header *ngIf=\"parameters?.HideTitle !== true\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer> </fd-card-footer>\n</fd-card>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$1.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$1.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$1.CardTitleDirective, selector: "[fd-card-title]" }, { kind: "component", type: i5$1.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BarsaCardLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaCardLayoutPanelComponent, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-header *ngIf=\"parameters?.HideTitle !== true\" [class.hideBorder]=\"parameters?.HideHeaderBorder\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer> </fd-card-footer>\n</fd-card>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host fd-card-header.hideBorder{border:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$1.CardHeaderComponent, selector: "fd-card-header", inputs: ["interactive", "tabindex"] }, { kind: "component", type: i5$1.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$1.CardTitleDirective, selector: "[fd-card-title]" }, { kind: "component", type: i5$1.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaCardLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-card-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-header *ngIf=\"parameters?.HideTitle !== true\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer> </fd-card-footer>\n</fd-card>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"] }]
+            args: [{ selector: 'bsu-barsa-card-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<fd-card [style.margin]=\"parameters?.Margin\">\n    <fd-card-header *ngIf=\"parameters?.HideTitle !== true\" [class.hideBorder]=\"parameters?.HideHeaderBorder\">\n        <h3 fd-title fd-card-title>\n            {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\n        </h3>\n    </fd-card-header>\n    <fd-card-content>\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\n    </fd-card-content>\n    <fd-card-footer> </fd-card-footer>\n</fd-card>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host fd-card-header.hideBorder{border:none}\n"] }]
         }] });
 
 class BarsaBaseLayoutPanelComponent extends BaseComponent {
@@ -12593,10 +12608,10 @@ class BarsaListLayoutPanelComponent extends LayoutPanelBaseComponent {
     }
 }
 BarsaListLayoutPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaListLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-BarsaListLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaListLayoutPanelComponent, selector: "bsu-barsa-list-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\n    <ng-container *ngFor=\"let item of layoutControls; let i = index\">\n        <li fd-list-item>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        index: i\n                    }\n                \"\n            ></ng-container>\n        </li>\n    </ng-container>\n</ul>\n<ng-template\n    #dynamicLayout\n    let-index\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", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i8.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i8.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BarsaListLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaListLayoutPanelComponent, selector: "bsu-barsa-list-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\n    <ng-container *ngFor=\"let item of layoutControls; let i = index\">\n        <li fd-list-item>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        index: i\n                    }\n                \"\n            ></ng-container>\n        </li>\n    </ng-container>\n</ul>\n<ng-template\n    #dynamicLayout\n    let-index\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", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host ::ng-deep bsu-layout-control.row-direction{flex-direction:row!important}@media (max-width: 600px){:host ::ng-deep bsu-layout-control.row-direction{flex-direction:row!important}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i8.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i8.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaListLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-list-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<ul fd-list>\n    <ng-container *ngFor=\"let item of layoutControls; let i = index\">\n        <li fd-list-item>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        index: i\n                    }\n                \"\n            ></ng-container>\n        </li>\n    </ng-container>\n</ul>\n<ng-template\n    #dynamicLayout\n    let-index\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", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"] }]
+            args: [{ selector: 'bsu-barsa-list-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<ul fd-list>\n    <ng-container *ngFor=\"let item of layoutControls; let i = index\">\n        <li fd-list-item>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    dynamicLayout;\n                    context: {\n                        $implicit: item,\n                        selector: 'bsu-layout-control',\n                        name: 'LayoutControlComponent',\n                        index: i\n                    }\n                \"\n            ></ng-container>\n        </li>\n    </ng-container>\n</ul>\n<ng-template\n    #dynamicLayout\n    let-index\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", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host ::ng-deep bsu-layout-control.row-direction{flex-direction:row!important}@media (max-width: 600px){:host ::ng-deep bsu-layout-control.row-direction{flex-direction:row!important}}\n"] }]
         }] });
 
 class BarsaGridLayoutPanelComponent extends LayoutPanelBaseComponent {
@@ -12613,10 +12628,10 @@ class BarsaGridLayoutPanelComponent extends LayoutPanelBaseComponent {
     }
 }
 BarsaGridLayoutPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaGridLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-BarsaGridLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaGridLayoutPanelComponent, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card *ngIf=\"parameters?.CardMode; else layoutGridTpl\">\n    <fd-card-content [style.margin]=\"parameters?.Margin\">\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n<ng-template #layoutGridTpl let-cardMode>\n    <fd-layout-grid *ngIf=\"config\" [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            <div\n                *ngFor=\"let gridCol of parameters?.GridColumns?.MoDataList\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                <bsu-ly-layout-panel *ngIf=\"gridCol.$LayoutGroup\" [config]=\"gridCol.$LayoutGroup\" [hideTitle]=\"true\">\n                </bsu-ly-layout-panel>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\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: i5$1.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$1.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i3$5.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i3$5.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i3$5.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BarsaGridLayoutPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BarsaGridLayoutPanelComponent, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card *ngIf=\"parameters?.CardMode; else layoutGridTpl\" [style.margin]=\"parameters?.Margin\">\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n<ng-template #layoutGridTpl let-cardMode>\n    <fd-layout-grid *ngIf=\"config\" [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            <div\n                *ngFor=\"let gridCol of parameters?.GridColumns?.MoDataList\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                <bsu-ly-layout-panel *ngIf=\"gridCol.$LayoutGroup\" [config]=\"gridCol.$LayoutGroup\" [hideTitle]=\"true\">\n                </bsu-ly-layout-panel>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\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: i5$1.CardComponent, selector: "fd-card", inputs: ["badge", "isLoading", "cardType", "id", "role"] }, { kind: "component", type: i5$1.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i3$5.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i3$5.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i3$5.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BarsaGridLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-grid-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<fd-card *ngIf=\"parameters?.CardMode; else layoutGridTpl\">\n    <fd-card-content [style.margin]=\"parameters?.Margin\">\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n<ng-template #layoutGridTpl let-cardMode>\n    <fd-layout-grid *ngIf=\"config\" [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            <div\n                *ngFor=\"let gridCol of parameters?.GridColumns?.MoDataList\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                <bsu-ly-layout-panel *ngIf=\"gridCol.$LayoutGroup\" [config]=\"gridCol.$LayoutGroup\" [hideTitle]=\"true\">\n                </bsu-ly-layout-panel>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"] }]
+            args: [{ selector: 'bsu-barsa-grid-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "<fd-card *ngIf=\"parameters?.CardMode; else layoutGridTpl\" [style.margin]=\"parameters?.Margin\">\n    <fd-card-content>\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\n    </fd-card-content>\n</fd-card>\n<ng-template #layoutGridTpl let-cardMode>\n    <fd-layout-grid *ngIf=\"config\" [style.margin]=\"cardMode ? null : parameters?.Margin\">\n        <div fdLayoutGridRow>\n            <div\n                *ngFor=\"let gridCol of parameters?.GridColumns?.MoDataList\"\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\n                [colMd]=\"gridCol.ColMd\"\n                [colLg]=\"gridCol.ColLg\"\n                [colXl]=\"gridCol.ColXl\"\n            >\n                <bsu-ly-layout-panel *ngIf=\"gridCol.$LayoutGroup\" [config]=\"gridCol.$LayoutGroup\" [hideTitle]=\"true\">\n                </bsu-ly-layout-panel>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-template>\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}\n"] }]
         }] });
 
 class BarsaDynamicFieldComponent extends FieldBaseComponent {