barsa-sap-ui 1.0.329 → 1.0.331

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4938,10 +4938,10 @@ class ListItemComponent extends BaseViewItemPropsComponent {
4938
4938
  }
4939
4939
  }
4940
4940
  ListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
4941
- ListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ListItemComponent, selector: "bsu-list-item", inputs: { setting: "setting", isDisplayType: "isDisplayType" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n <li\n fd-list-item\n class=\"standard-list-row\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [class.selected]=\"isChecked === true\"\n [selected]=\"isChecked === true\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n >\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n\n <span fd-list-thumbnail *ngIf=\"setting.IconFont || setting.AvatarField\">\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n [circle]=\"true\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"avatarSize\"\n [transparent]=\"true\"\n [glyph]=\"\n setting.IconFont ??\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n </span>\n <div fd-list-content>\n <div fd-list-byline [twoCol]=\"true\">\n <div fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats,\n index: 0\n }\n \"\n ></ng-container>\n </div>\n <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.StatusField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <div fd-list-byline>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <bsu-ulv-context-menu\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n\n <button\n *ngIf=\"canView\"\n (click)=\"onRowClick()\"\n fdType=\"transparent\"\n [glyph]=\"navigationArrow\"\n fd-button\n ></button>\n </a>\n </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n <li\n class=\"display\"\n fd-list-item\n [interactive]=\"false\"\n *ngIf=\"!mo.parent || mo.parent?.expanded\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n style=\"cursor: default\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n style=\"column-gap: 3px\"\n >\n <img\n *ngIf=\"setting.AvatarField\"\n [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n style=\"width: 24px; height: 24px\"\n />\n <i\n fd-list-icon\n *ngIf=\"setting.IconFont\"\n [glyph]=\"setting.IconFont\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n >\n </i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && inlineEditMode && isChecked\" glyph=\"edit\"></i>\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n <span fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: 0\n }\n \"\n ></ng-container>\n </span>\n <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n <bsu-ulv-context-menu\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n <button\n *ngIf=\"canView\"\n fd-button\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n </span>\n </a>\n </li>\n</ng-template>\n<ng-template\n #renderColumn\n let-column\n let-mo=\"mo\"\n let-conditionalFormats=\"conditionalFormats\"\n let-index=\"index\"\n let-layout94=\"layout94\"\n>\n <ng-container *ngIf=\"column\">\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n </ng-container>\n</ng-template>\n", styles: [":host .display ::ng-deep .fd-list__secondary{align-items:center;justify-content:stretch;display:flex}:host .display bsu-ulv-context-menu{margin:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: 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: i3$5.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.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: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i6$1.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "class", "role"] }, { kind: "directive", type: i6$1.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "directive", type: i6$1.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i6$1.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i6$1.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4941
+ ListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ListItemComponent, selector: "bsu-list-item", inputs: { setting: "setting", isDisplayType: "isDisplayType" }, usesInheritance: true, ngImport: i0, template: "<ng-container\n *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n <li\n fd-list-item\n class=\"standard-list-row\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [class.selected]=\"isChecked === true\"\n [selected]=\"isChecked === true\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n >\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n\n <span fd-list-thumbnail *ngIf=\"setting.IconFont || setting.AvatarField\">\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n [circle]=\"true\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"avatarSize\"\n [transparent]=\"true\"\n [glyph]=\"\n setting.IconFont ??\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n </span>\n <div fd-list-content>\n <div fd-list-byline [twoCol]=\"true\">\n <div fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats,\n index: 0\n }\n \"\n ></ng-container>\n </div>\n <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.StatusField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <div fd-list-byline>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <bsu-ulv-context-menu\n *ngIf=\"contextMenuItems.length\"\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n <button\n *ngIf=\"canView && !hideOpenIcon\"\n (click)=\"onRowClick()\"\n fdType=\"transparent\"\n [glyph]=\"navigationArrow\"\n fd-button\n ></button>\n </a>\n </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n <li\n class=\"display\"\n fd-list-item\n [interactive]=\"false\"\n *ngIf=\"!mo.parent || mo.parent?.expanded\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n style=\"cursor: default\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n style=\"column-gap: 3px\"\n >\n <img\n *ngIf=\"setting.AvatarField\"\n [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n style=\"width: 24px; height: 24px\"\n />\n <i\n fd-list-icon\n *ngIf=\"setting.IconFont\"\n [glyph]=\"setting.IconFont\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n >\n </i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && inlineEditMode && isChecked\" glyph=\"edit\"></i>\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n <span fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: 0\n }\n \"\n ></ng-container>\n </span>\n <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n <button\n *ngIf=\"canView && !hideOpenIcon\"\n fd-button\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n <bsu-ulv-context-menu\n *ngIf=\"contextMenuItems.length\"\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n </span>\n </a>\n </li>\n</ng-template>\n<ng-template\n #renderColumn\n let-column\n let-mo=\"mo\"\n let-conditionalFormats=\"conditionalFormats\"\n let-index=\"index\"\n let-layout94=\"layout94\"\n>\n <ng-container *ngIf=\"column\">\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n </ng-container>\n</ng-template>\n", styles: [":host .display ::ng-deep .fd-list__secondary{align-items:center;justify-content:stretch;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: 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: i3$5.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "backgroundImage", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.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: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i6$1.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "class", "role"] }, { kind: "directive", type: i6$1.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated"] }, { kind: "directive", type: i6$1.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i6$1.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i6$1.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4942
4942
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ListItemComponent, decorators: [{
4943
4943
  type: Component,
4944
- args: [{ selector: 'bsu-list-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n <li\n fd-list-item\n class=\"standard-list-row\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [class.selected]=\"isChecked === true\"\n [selected]=\"isChecked === true\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n >\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n\n <span fd-list-thumbnail *ngIf=\"setting.IconFont || setting.AvatarField\">\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n [circle]=\"true\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"avatarSize\"\n [transparent]=\"true\"\n [glyph]=\"\n setting.IconFont ??\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n </span>\n <div fd-list-content>\n <div fd-list-byline [twoCol]=\"true\">\n <div fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats,\n index: 0\n }\n \"\n ></ng-container>\n </div>\n <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.StatusField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <div fd-list-byline>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <bsu-ulv-context-menu\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n\n <button\n *ngIf=\"canView\"\n (click)=\"onRowClick()\"\n fdType=\"transparent\"\n [glyph]=\"navigationArrow\"\n fd-button\n ></button>\n </a>\n </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n <li\n class=\"display\"\n fd-list-item\n [interactive]=\"false\"\n *ngIf=\"!mo.parent || mo.parent?.expanded\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n style=\"cursor: default\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n style=\"column-gap: 3px\"\n >\n <img\n *ngIf=\"setting.AvatarField\"\n [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n style=\"width: 24px; height: 24px\"\n />\n <i\n fd-list-icon\n *ngIf=\"setting.IconFont\"\n [glyph]=\"setting.IconFont\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n >\n </i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && inlineEditMode && isChecked\" glyph=\"edit\"></i>\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n <span fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: 0\n }\n \"\n ></ng-container>\n </span>\n <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n <bsu-ulv-context-menu\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n <button\n *ngIf=\"canView\"\n fd-button\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n </span>\n </a>\n </li>\n</ng-template>\n<ng-template\n #renderColumn\n let-column\n let-mo=\"mo\"\n let-conditionalFormats=\"conditionalFormats\"\n let-index=\"index\"\n let-layout94=\"layout94\"\n>\n <ng-container *ngIf=\"column\">\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n </ng-container>\n</ng-template>\n", styles: [":host .display ::ng-deep .fd-list__secondary{align-items:center;justify-content:stretch;display:flex}:host .display bsu-ulv-context-menu{margin:auto}\n"] }]
4944
+ args: [{ selector: 'bsu-list-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n *ngTemplateOutlet=\"isDisplayType ? displayTemplate : standardTemplate; context: { $implicit: mo }\"\n></ng-container>\n<ng-template #standardTemplate let-mo>\n <li\n fd-list-item\n class=\"standard-list-row\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [class.selected]=\"isChecked === true\"\n [selected]=\"isChecked === true\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n >\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n\n <span fd-list-thumbnail *ngIf=\"setting.IconFont || setting.AvatarField\">\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n [circle]=\"true\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"avatarSize\"\n [transparent]=\"true\"\n [glyph]=\"\n setting.IconFont ??\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n </span>\n <div fd-list-content>\n <div fd-list-byline [twoCol]=\"true\">\n <div fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats,\n index: 0\n }\n \"\n ></ng-container>\n </div>\n <div fd-list-byline [style.padding-left]=\"canView && deviceName === 'desktop' ? '.9rem' : '0'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.StatusField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <div fd-list-byline>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n conditionalFormats: conditionalFormats\n }\n \"\n ></ng-container>\n </div>\n </div>\n <bsu-ulv-context-menu\n *ngIf=\"contextMenuItems.length\"\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n <button\n *ngIf=\"canView && !hideOpenIcon\"\n (click)=\"onRowClick()\"\n fdType=\"transparent\"\n [glyph]=\"navigationArrow\"\n fd-button\n ></button>\n </a>\n </li>\n</ng-template>\n<ng-template #displayTemplate let-mo>\n <li\n class=\"display\"\n fd-list-item\n [interactive]=\"false\"\n *ngIf=\"!mo.parent || mo.parent?.expanded\"\n (dblclick)=\"onRowClick()\"\n (click)=\"onRowCheck()\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n >\n <a\n fd-list-link\n [attr.rtl]=\"rtl\"\n class=\"li-link\"\n style=\"cursor: default\"\n [class.checklist]=\"isCheckList\"\n #aEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"aEl\"\n style=\"column-gap: 3px\"\n >\n <img\n *ngIf=\"setting.AvatarField\"\n [src]=\"mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId\"\n style=\"width: 24px; height: 24px\"\n />\n <i\n fd-list-icon\n *ngIf=\"setting.IconFont\"\n [glyph]=\"setting.IconFont\"\n [style.color]=\"setting.IconColor ? setting.IconColor : null\"\n >\n </i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && mo.$State === 'New' && !isChecked\" glyph=\"favorite\"></i>\n <i fd-list-icon *ngIf=\"!setting.IconFont && inlineEditMode && isChecked\" glyph=\"edit\"></i>\n <fd-checkbox\n *ngIf=\"isCheckList\"\n [name]=\"mo.$Caption\"\n [ngModel]=\"isChecked\"\n (change)=\"onRowCheck2($event)\"\n ></fd-checkbox>\n <span fd-list-title>\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.TitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: 0\n }\n \"\n ></ng-container>\n </span>\n <span fd-list-secondary [dir]=\"rtl ? 'ltr' : 'rtl'\">\n <ng-container\n *ngTemplateOutlet=\"\n renderColumn;\n context: {\n $implicit: setting.SubtitleField,\n conditionalFormats: conditionalFormats,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n <button\n *ngIf=\"canView && !hideOpenIcon\"\n fd-button\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n <bsu-ulv-context-menu\n *ngIf=\"contextMenuItems.length\"\n [menuItems]=\"contextMenuItems\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></bsu-ulv-context-menu>\n </span>\n </a>\n </li>\n</ng-template>\n<ng-template\n #renderColumn\n let-column\n let-mo=\"mo\"\n let-conditionalFormats=\"conditionalFormats\"\n let-index=\"index\"\n let-layout94=\"layout94\"\n>\n <ng-container *ngIf=\"column\">\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n </ng-container>\n</ng-template>\n", styles: [":host .display ::ng-deep .fd-list__secondary{align-items:center;justify-content:stretch;display:flex}\n"] }]
4945
4945
  }], propDecorators: { setting: [{
4946
4946
  type: Input
4947
4947
  }], isDisplayType: [{
@@ -4985,10 +4985,10 @@ class UiListViewComponent extends ReportViewBaseComponent {
4985
4985
  }
4986
4986
  }
4987
4987
  UiListViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiListViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
4988
- UiListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiListViewComponent, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupMode"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupMode>\n <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n <!-- <fd-menu [appendTo]=\"_el\"\n #menu [mobile]=\"deviceSize === 's'\" >\n </fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n <div class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n <fd-popover #popover fillControlMode=\"equal\">\n <fd-popover-control class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ng-container\n *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n ></ng-container>\n </fd-popover-body>\n </fd-popover>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n <button class=\"drop-down\" fd-button [label]=\"title | bbbTranslate\" [fdMenu]=\"true\" [fdMenuTrigger]=\"menu\">\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </button>\n</ng-template>\n<ng-template #tokensTpl>\n <div *ngIf=\"hasSelected\" style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n <ng-container *ngFor=\"let mo of moDataList; let index = index\">\n <fd-token *ngIf=\"mo.$IsChecked\" fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n columns[0].Caption | rval: mo:columns:true\n }}</fd-token>\n </ng-container>\n </div>\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n <fd-layout-panel-header>\n <fd-layout-panel-head>\n <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </fd-layout-panel-head>\n <fd-layout-panel-actions>\n <button\n *ngIf=\"deviceSize !== 's'\"\n style=\"margin-top: 5px\"\n fd-button\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"popover.close()\"\n ></button>\n </fd-layout-panel-actions>\n </fd-layout-panel-header>\n <fd-layout-panel-filters *ngIf=\"isCheckList\">\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n 'All' | bbbTranslate\n }}</a>\n <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n <a\n (click)=\"onClearCheckbox()\"\n fd-toolbar-item\n class=\"clearCheckAll\"\n fd-link\n [aria-label]=\"'Clear' | bbbTranslate\"\n >{{ 'Clear' | bbbTranslate }}</a\n >\n </fd-toolbar>\n </fd-layout-panel-filters>\n\n <fd-layout-panel-body [bleed]=\"true\">\n <ng-container\n *ngTemplateOutlet=\"\n isDisplayType ? displayListTemplate : standardListTemplate;\n context: {\n $implicit: moDataList,\n isCheckList: isCheckList,\n groupby: groupby,\n conditionalFormats: conditionalFormats,\n deviceName: deviceName,\n viewSetting: viewSetting,\n allColumns: allColumns,\n access: access,\n rtl: rtl,\n popover: popover\n }\n \"\n >\n </ng-container>\n </fd-layout-panel-body>\n </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n #displayListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-deviceName=\"deviceName\"\n let-allColumns=\"allColumns\"\n let-viewSetting=\"viewSetting\"\n let-access=\"access\"\n let-rtl=\"rtl\"\n>\n <ul\n fd-list\n class=\"display-list fd-list--navigation\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index; let last = last\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n<!--standard list-->\n<ng-template\n #standardListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-allColumns=\"allColumns\"\n let-deviceName=\"deviceName\"\n let-access=\"access\"\n let-viewSetting=\"viewSetting\"\n let-rtl=\"rtl\"\n let-last=\"last\"\n>\n <ul\n class=\"fd-list--navigation\"\n [class.fd-list--byline]=\"!isDisplayType\"\n fd-list\n [byline]=\"true\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n\n<!--noData-->\n<ng-template #noData>\n <bsu-no-data></bsu-no-data>\n</ng-template>\n<ng-template\n #itemTemplate\n let-mo\n let-index=\"index\"\n let-last=\"last\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n>\n <li\n fd-list-group-header\n *ngIf=\"mo.group || mo.group === ''; else listItemTemplate\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [attr.level]=\"mo.level\"\n [class.root-group]=\"mo.level === 0\"\n >\n <fd-icon\n [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick(mo)\"\n ></fd-icon>\n <span fd-list-title>{{ mo.group }}</span>\n </li>\n <ng-template #listItemTemplate>\n <ng-container\n *ngTemplateOutlet=\"\n hasRowOlgo ? dynamicItemTemplate : defaultItem;\n context: {\n $implicit: mo,\n index: index,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n <ng-template\n #defaultItem\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bsu-list-item\n *ngIf=\"!hasRowOlgo; else dynamicItemTemplate\"\n [isDisplayType]=\"isDisplayType\"\n [mo]=\"mo\"\n [isChecked]=\"mo.$IsChecked\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"listSetting\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [allColumns]=\"allColumns\"\n [contentDensity]=\"contentDensity\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n >\n </bsu-list-item>\n </ng-template>\n\n <ng-template\n #dynamicItemTemplate\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bnrc-dynamic-item-component\n [component]=\"viewSetting.RowOlgo\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [moDataList]=\"moDataList\"\n [showDetailsInRow]=\"showDetailsInRow\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [detailsColumns]=\"detailsColumns\"\n [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n [cartableMo]=\"mo.RelatedMo\"\n [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n [detailsComponent]=\"detailsComponent\"\n [isChecked]=\"mo.$IsChecked\"\n [visibility]=\"mo.$Visibility\"\n [expanded]=\"mo.$Expanded\"\n [level]=\"mo.$Level\"\n [parentExpanded]=\"mo.$Parent?.$Expanded\"\n [moDataListCount]=\"moDataListCount\"\n [columnsCount]=\"columnsCount - detailsColumns.length\"\n [typeDefId]=\"typeDefId\"\n [extraRelation]=\"extraRelation\"\n [formSetting]=\"formSetting\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"viewSetting\"\n [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [access]=\"access\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n (events)=\"onOlgoEvents($event)\"\n >\n </bnrc-dynamic-item-component>\n </ng-template>\n </ng-template>\n</ng-template>\n", styles: [".fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.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"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i3$7.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3$6.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage"] }, { kind: "component", type: i7$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7$3.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7$3.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7$3.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i9.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i9.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { 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: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "directive", type: i7$1.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i9$2.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data" }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4988
+ UiListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: UiListViewComponent, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupMode"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupMode>\n <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n <!-- <fd-menu [appendTo]=\"_el\"\n #menu [mobile]=\"deviceSize === 's'\" >\n </fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n <div class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n <fd-popover #popover fillControlMode=\"equal\">\n <fd-popover-control class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ng-container\n *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n ></ng-container>\n </fd-popover-body>\n </fd-popover>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n <button class=\"drop-down\" fd-button [label]=\"title | bbbTranslate\" [fdMenu]=\"true\" [fdMenuTrigger]=\"menu\">\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </button>\n</ng-template>\n<ng-template #tokensTpl>\n <div *ngIf=\"hasSelected\" style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n <ng-container *ngFor=\"let mo of moDataList; let index = index\">\n <fd-token *ngIf=\"mo.$IsChecked\" fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n columns[0].Caption | rval: mo:columns:true\n }}</fd-token>\n </ng-container>\n </div>\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n <fd-layout-panel-header>\n <fd-layout-panel-head>\n <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </fd-layout-panel-head>\n <fd-layout-panel-actions>\n <button\n *ngIf=\"deviceSize !== 's'\"\n style=\"margin-top: 5px\"\n fd-button\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"popover.close()\"\n ></button>\n </fd-layout-panel-actions>\n </fd-layout-panel-header>\n <fd-layout-panel-filters *ngIf=\"isCheckList\">\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n 'All' | bbbTranslate\n }}</a>\n <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n <a\n (click)=\"onClearCheckbox()\"\n fd-toolbar-item\n class=\"clearCheckAll\"\n fd-link\n [aria-label]=\"'Clear' | bbbTranslate\"\n >{{ 'Clear' | bbbTranslate }}</a\n >\n </fd-toolbar>\n </fd-layout-panel-filters>\n\n <fd-layout-panel-body [bleed]=\"true\">\n <ng-container\n *ngTemplateOutlet=\"\n isDisplayType ? displayListTemplate : standardListTemplate;\n context: {\n $implicit: moDataList,\n isCheckList: isCheckList,\n groupby: groupby,\n conditionalFormats: conditionalFormats,\n deviceName: deviceName,\n viewSetting: viewSetting,\n allColumns: allColumns,\n access: access,\n rtl: rtl,\n popover: popover\n }\n \"\n >\n </ng-container>\n </fd-layout-panel-body>\n </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n #displayListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-deviceName=\"deviceName\"\n let-allColumns=\"allColumns\"\n let-viewSetting=\"viewSetting\"\n let-access=\"access\"\n let-rtl=\"rtl\"\n>\n <ul\n fd-list\n class=\"display-list fd-list--navigation\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index; let last = last\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n<!--standard list-->\n<ng-template\n #standardListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-allColumns=\"allColumns\"\n let-deviceName=\"deviceName\"\n let-access=\"access\"\n let-viewSetting=\"viewSetting\"\n let-rtl=\"rtl\"\n let-last=\"last\"\n>\n <ul\n class=\"fd-list--navigation\"\n [class.fd-list--byline]=\"!isDisplayType\"\n fd-list\n [byline]=\"true\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n\n<!--noData-->\n<ng-template #noData>\n <bsu-no-data></bsu-no-data>\n</ng-template>\n<ng-template\n #itemTemplate\n let-mo\n let-index=\"index\"\n let-last=\"last\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n>\n <li\n fd-list-group-header\n *ngIf=\"mo.group || mo.group === ''; else listItemTemplate\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [attr.level]=\"mo.level\"\n [class.root-group]=\"mo.level === 0\"\n >\n <fd-icon\n [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick(mo)\"\n ></fd-icon>\n <span fd-list-title>{{ mo.group }}</span>\n </li>\n <ng-template #listItemTemplate>\n <ng-container\n *ngTemplateOutlet=\"\n hasRowOlgo ? dynamicItemTemplate : defaultItem;\n context: {\n $implicit: mo,\n index: index,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n <ng-template\n #defaultItem\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bsu-list-item\n *ngIf=\"!hasRowOlgo; else dynamicItemTemplate\"\n [isDisplayType]=\"isDisplayType\"\n [mo]=\"mo\"\n [isChecked]=\"mo.$IsChecked\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"listSetting\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [allColumns]=\"allColumns\"\n [contentDensity]=\"contentDensity\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n >\n </bsu-list-item>\n </ng-template>\n\n <ng-template\n #dynamicItemTemplate\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bnrc-dynamic-item-component\n [component]=\"viewSetting.RowOlgo\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [moDataList]=\"moDataList\"\n [showDetailsInRow]=\"showDetailsInRow\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [detailsColumns]=\"detailsColumns\"\n [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n [cartableMo]=\"mo.RelatedMo\"\n [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n [detailsComponent]=\"detailsComponent\"\n [isChecked]=\"mo.$IsChecked\"\n [visibility]=\"mo.$Visibility\"\n [expanded]=\"mo.$Expanded\"\n [level]=\"mo.$Level\"\n [parentExpanded]=\"mo.$Parent?.$Expanded\"\n [moDataListCount]=\"moDataListCount\"\n [columnsCount]=\"columnsCount - detailsColumns.length\"\n [typeDefId]=\"typeDefId\"\n [extraRelation]=\"extraRelation\"\n [formSetting]=\"formSetting\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"viewSetting\"\n [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [access]=\"access\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n (events)=\"onOlgoEvents($event)\"\n >\n </bnrc-dynamic-item-component>\n </ng-template>\n </ng-template>\n</ng-template>\n", styles: [".fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.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"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i3$7.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3$6.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage"] }, { kind: "component", type: i7$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7$3.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7$3.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7$3.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i9.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i9.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large"] }, { 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: "component", type: i7$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7$1.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "directive", type: i7$1.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i9$2.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data" }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
4989
4989
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: UiListViewComponent, decorators: [{
4990
4990
  type: Component,
4991
- args: [{ selector: 'bsu-ui-list-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupMode>\n <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n <!-- <fd-menu [appendTo]=\"_el\"\n #menu [mobile]=\"deviceSize === 's'\" >\n </fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n <div class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n <fd-popover #popover fillControlMode=\"equal\">\n <fd-popover-control class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ng-container\n *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n ></ng-container>\n </fd-popover-body>\n </fd-popover>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n <button class=\"drop-down\" fd-button [label]=\"title | bbbTranslate\" [fdMenu]=\"true\" [fdMenuTrigger]=\"menu\">\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </button>\n</ng-template>\n<ng-template #tokensTpl>\n <div *ngIf=\"hasSelected\" style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n <ng-container *ngFor=\"let mo of moDataList; let index = index\">\n <fd-token *ngIf=\"mo.$IsChecked\" fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n columns[0].Caption | rval: mo:columns:true\n }}</fd-token>\n </ng-container>\n </div>\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n <fd-layout-panel-header>\n <fd-layout-panel-head>\n <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </fd-layout-panel-head>\n <fd-layout-panel-actions>\n <button\n *ngIf=\"deviceSize !== 's'\"\n style=\"margin-top: 5px\"\n fd-button\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"popover.close()\"\n ></button>\n </fd-layout-panel-actions>\n </fd-layout-panel-header>\n <fd-layout-panel-filters *ngIf=\"isCheckList\">\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n 'All' | bbbTranslate\n }}</a>\n <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n <a\n (click)=\"onClearCheckbox()\"\n fd-toolbar-item\n class=\"clearCheckAll\"\n fd-link\n [aria-label]=\"'Clear' | bbbTranslate\"\n >{{ 'Clear' | bbbTranslate }}</a\n >\n </fd-toolbar>\n </fd-layout-panel-filters>\n\n <fd-layout-panel-body [bleed]=\"true\">\n <ng-container\n *ngTemplateOutlet=\"\n isDisplayType ? displayListTemplate : standardListTemplate;\n context: {\n $implicit: moDataList,\n isCheckList: isCheckList,\n groupby: groupby,\n conditionalFormats: conditionalFormats,\n deviceName: deviceName,\n viewSetting: viewSetting,\n allColumns: allColumns,\n access: access,\n rtl: rtl,\n popover: popover\n }\n \"\n >\n </ng-container>\n </fd-layout-panel-body>\n </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n #displayListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-deviceName=\"deviceName\"\n let-allColumns=\"allColumns\"\n let-viewSetting=\"viewSetting\"\n let-access=\"access\"\n let-rtl=\"rtl\"\n>\n <ul\n fd-list\n class=\"display-list fd-list--navigation\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index; let last = last\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n<!--standard list-->\n<ng-template\n #standardListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-allColumns=\"allColumns\"\n let-deviceName=\"deviceName\"\n let-access=\"access\"\n let-viewSetting=\"viewSetting\"\n let-rtl=\"rtl\"\n let-last=\"last\"\n>\n <ul\n class=\"fd-list--navigation\"\n [class.fd-list--byline]=\"!isDisplayType\"\n fd-list\n [byline]=\"true\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n\n<!--noData-->\n<ng-template #noData>\n <bsu-no-data></bsu-no-data>\n</ng-template>\n<ng-template\n #itemTemplate\n let-mo\n let-index=\"index\"\n let-last=\"last\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n>\n <li\n fd-list-group-header\n *ngIf=\"mo.group || mo.group === ''; else listItemTemplate\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [attr.level]=\"mo.level\"\n [class.root-group]=\"mo.level === 0\"\n >\n <fd-icon\n [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick(mo)\"\n ></fd-icon>\n <span fd-list-title>{{ mo.group }}</span>\n </li>\n <ng-template #listItemTemplate>\n <ng-container\n *ngTemplateOutlet=\"\n hasRowOlgo ? dynamicItemTemplate : defaultItem;\n context: {\n $implicit: mo,\n index: index,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n <ng-template\n #defaultItem\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bsu-list-item\n *ngIf=\"!hasRowOlgo; else dynamicItemTemplate\"\n [isDisplayType]=\"isDisplayType\"\n [mo]=\"mo\"\n [isChecked]=\"mo.$IsChecked\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"listSetting\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [allColumns]=\"allColumns\"\n [contentDensity]=\"contentDensity\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n >\n </bsu-list-item>\n </ng-template>\n\n <ng-template\n #dynamicItemTemplate\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bnrc-dynamic-item-component\n [component]=\"viewSetting.RowOlgo\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [moDataList]=\"moDataList\"\n [showDetailsInRow]=\"showDetailsInRow\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [detailsColumns]=\"detailsColumns\"\n [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n [cartableMo]=\"mo.RelatedMo\"\n [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n [detailsComponent]=\"detailsComponent\"\n [isChecked]=\"mo.$IsChecked\"\n [visibility]=\"mo.$Visibility\"\n [expanded]=\"mo.$Expanded\"\n [level]=\"mo.$Level\"\n [parentExpanded]=\"mo.$Parent?.$Expanded\"\n [moDataListCount]=\"moDataListCount\"\n [columnsCount]=\"columnsCount - detailsColumns.length\"\n [typeDefId]=\"typeDefId\"\n [extraRelation]=\"extraRelation\"\n [formSetting]=\"formSetting\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"viewSetting\"\n [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [access]=\"access\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n (events)=\"onOlgoEvents($event)\"\n >\n </bnrc-dynamic-item-component>\n </ng-template>\n </ng-template>\n</ng-template>\n", styles: [".fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"] }]
4991
+ args: [{ selector: 'bsu-ui-list-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\n\n<ng-template #popupMode>\n <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\n\n <!-- <fd-menu [appendTo]=\"_el\"\n #menu [mobile]=\"deviceSize === 's'\" >\n </fd-menu> -->\n</ng-template>\n<ng-template #mobileTpl>\n <div class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\n <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\n </fd-menu>\n</ng-template>\n<ng-template #desktopTpl>\n <fd-popover #popover fillControlMode=\"equal\">\n <fd-popover-control class=\"popup-mode\">\n <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ng-container\n *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\n ></ng-container>\n </fd-popover-body>\n </fd-popover>\n <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\n</ng-template>\n<ng-template #buttonDropDown let-menu=\"menu\">\n <button class=\"drop-down\" fd-button [label]=\"title | bbbTranslate\" [fdMenu]=\"true\" [fdMenuTrigger]=\"menu\">\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </button>\n</ng-template>\n<ng-template #tokensTpl>\n <div *ngIf=\"hasSelected\" style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\n <ng-container *ngFor=\"let mo of moDataList; let index = index\">\n <fd-token *ngIf=\"mo.$IsChecked\" fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\n columns[0].Caption | rval: mo:columns:true\n }}</fd-token>\n </ng-container>\n </div>\n</ng-template>\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\n <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\n <fd-layout-panel-header>\n <fd-layout-panel-head>\n <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\n <span\n *ngIf=\"selectedCount > 0\"\n fd-object-status\n [inverted]=\"true\"\n [label]=\"selectedCount\"\n [title]=\"selectedCount\"\n ></span>\n </fd-layout-panel-head>\n <fd-layout-panel-actions>\n <button\n *ngIf=\"deviceSize !== 's'\"\n style=\"margin-top: 5px\"\n fd-button\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"popover.close()\"\n ></button>\n </fd-layout-panel-actions>\n </fd-layout-panel-header>\n <fd-layout-panel-filters *ngIf=\"isCheckList\">\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\n 'All' | bbbTranslate\n }}</a>\n <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\n <a\n (click)=\"onClearCheckbox()\"\n fd-toolbar-item\n class=\"clearCheckAll\"\n fd-link\n [aria-label]=\"'Clear' | bbbTranslate\"\n >{{ 'Clear' | bbbTranslate }}</a\n >\n </fd-toolbar>\n </fd-layout-panel-filters>\n\n <fd-layout-panel-body [bleed]=\"true\">\n <ng-container\n *ngTemplateOutlet=\"\n isDisplayType ? displayListTemplate : standardListTemplate;\n context: {\n $implicit: moDataList,\n isCheckList: isCheckList,\n groupby: groupby,\n conditionalFormats: conditionalFormats,\n deviceName: deviceName,\n viewSetting: viewSetting,\n allColumns: allColumns,\n access: access,\n rtl: rtl,\n popover: popover\n }\n \"\n >\n </ng-container>\n </fd-layout-panel-body>\n </fd-layout-panel>\n</ng-template>\n\n<!--display list-->\n<ng-template\n #displayListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-deviceName=\"deviceName\"\n let-allColumns=\"allColumns\"\n let-viewSetting=\"viewSetting\"\n let-access=\"access\"\n let-rtl=\"rtl\"\n>\n <ul\n fd-list\n class=\"display-list fd-list--navigation\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index; let last = last\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n<!--standard list-->\n<ng-template\n #standardListTemplate\n let-moDataList\n let-isCheckList=\"isCheckList\"\n let-groupby=\"groupby\"\n let-conditionalFormats=\"conditionalFormats\"\n let-allColumns=\"allColumns\"\n let-deviceName=\"deviceName\"\n let-access=\"access\"\n let-viewSetting=\"viewSetting\"\n let-rtl=\"rtl\"\n let-last=\"last\"\n>\n <ul\n class=\"fd-list--navigation\"\n [class.fd-list--byline]=\"!isDisplayType\"\n fd-list\n [byline]=\"true\"\n *ngIf=\"moDataList && moDataList.length > 0; else noData\"\n ellipsify\n >\n <ng-container *ngFor=\"let mo of moDataList | multipleGroupBy: groupby; let index = index\">\n <ng-container *ngIf=\"!mo.parent || mo.parent?.expanded\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n $implicit: mo,\n index: index,\n last: last,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n </ng-container>\n </ng-container>\n </ul>\n</ng-template>\n\n<!--noData-->\n<ng-template #noData>\n <bsu-no-data></bsu-no-data>\n</ng-template>\n<ng-template\n #itemTemplate\n let-mo\n let-index=\"index\"\n let-last=\"last\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n>\n <li\n fd-list-group-header\n *ngIf=\"mo.group || mo.group === ''; else listItemTemplate\"\n [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\n [attr.level]=\"mo.level\"\n [class.root-group]=\"mo.level === 0\"\n >\n <fd-icon\n [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick(mo)\"\n ></fd-icon>\n <span fd-list-title>{{ mo.group }}</span>\n </li>\n <ng-template #listItemTemplate>\n <ng-container\n *ngTemplateOutlet=\"\n hasRowOlgo ? dynamicItemTemplate : defaultItem;\n context: {\n $implicit: mo,\n index: index,\n columns: columns,\n moDataList: moDataList,\n moDataListCount: moDataList.length\n }\n \"\n ></ng-container>\n <ng-template\n #defaultItem\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bsu-list-item\n *ngIf=\"!hasRowOlgo; else dynamicItemTemplate\"\n [isDisplayType]=\"isDisplayType\"\n [mo]=\"mo\"\n [isChecked]=\"mo.$IsChecked\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"listSetting\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [allColumns]=\"allColumns\"\n [contentDensity]=\"contentDensity\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n >\n </bsu-list-item>\n </ng-template>\n\n <ng-template\n #dynamicItemTemplate\n let-mo\n let-index=\"index\"\n let-columns=\"columns\"\n let-moDataListCount=\"moDataListCount\"\n let-moDataList=\"moDataList\"\n >\n <bnrc-dynamic-item-component\n [component]=\"viewSetting.RowOlgo\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [moDataList]=\"moDataList\"\n [showDetailsInRow]=\"showDetailsInRow\"\n [hideOpenIcon]=\"hideOpenIcon\"\n [detailsColumns]=\"detailsColumns\"\n [columnComponents]=\"viewSetting?.ColumnComponents || null\"\n [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\n [cartableMo]=\"mo.RelatedMo\"\n [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\n [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\n [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\n [detailsComponent]=\"detailsComponent\"\n [isChecked]=\"mo.$IsChecked\"\n [visibility]=\"mo.$Visibility\"\n [expanded]=\"mo.$Expanded\"\n [level]=\"mo.$Level\"\n [parentExpanded]=\"mo.$Parent?.$Expanded\"\n [moDataListCount]=\"moDataListCount\"\n [columnsCount]=\"columnsCount - detailsColumns.length\"\n [typeDefId]=\"typeDefId\"\n [extraRelation]=\"extraRelation\"\n [formSetting]=\"formSetting\"\n [index]=\"index\"\n [last]=\"last\"\n [setting]=\"viewSetting\"\n [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns\"\n [columns]=\"columns | filterColumnsByDetails: detailsColumns\"\n [isNewInlineMo]=\"mo.$NewInlineMo\"\n [access]=\"access\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\n (events)=\"onOlgoEvents($event)\"\n >\n </bnrc-dynamic-item-component>\n </ng-template>\n </ng-template>\n</ng-template>\n", styles: [".fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"] }]
4992
4992
  }], propDecorators: { popupModeTemplateRef: [{
4993
4993
  type: ViewChild,
4994
4994
  args: ['popupMode', { static: true, read: TemplateRef }]