@pepperi-addons/ngx-lib 0.3.15-beta.7 → 0.3.15-beta.8

package/bundles/pepperi-addons-ngx-lib-dialog.umd.js

@@ -48,7 +48,7 @@
             this.title = options.title || '';
             this.actionsType = options.actionsType || 'close';
             this.content = options.content || '';
-            this.showClose = (_a = options.showClose) !== null && _a !== void 0 ? _a : true;
+            this.showClose = (_a = options.showClose) !== null && _a !== void 0 ? _a : false;
             this.showHeader = (_b = options.showHeader) !== null && _b !== void 0 ? _b : true;
             this.showFooter = (_c = options.showFooter) !== null && _c !== void 0 ? _c : true;
             this.actionButtons = (_d = options.actionButtons) !== null && _d !== void 0 ? _d : null;
@@ -88,16 +88,12 @@
 
     var PepDialogComponent = /** @class */ (function () {
         function PepDialogComponent() {
-            this.showClose = true;
+            this.showClose = false;
             this.showHeader = true;
             this.showFooter = true;
-            // @Input() dialogRef: MatDialogRef<any>;
             this.close = new i0.EventEmitter();
         }
         PepDialogComponent.prototype.closeDialog = function () {
-            // if (this.dialogRef) {
-            //     this.dialogRef.close(null);
-            // }
             this.close.emit(null);
         };
         return PepDialogComponent;

package/bundles/pepperi-addons-ngx-lib-dialog.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"pepperi-addons-ngx-lib-dialog.umd.js","sources":["../../../projects/ngx-lib/dialog/dialog.model.ts","../../../projects/ngx-lib/dialog/default-dialog.component.ts","../../../projects/ngx-lib/dialog/dialog.component.ts","../../../projects/ngx-lib/dialog/dialog.service.ts","../../../projects/ngx-lib/dialog/dialog.module.ts","../../../projects/ngx-lib/dialog/public-api.ts","../../../projects/ngx-lib/dialog/pepperi-addons-ngx-lib-dialog.ts"],"sourcesContent":["export type PepDialogSizeType =\n    | 'inline'\n    | 'small'\n    | 'regular'\n    | 'large'\n    | 'full-screen';\n\nexport type PepDialogActionsType =\n    | 'close'\n    | 'cancel-continue'\n    | 'cancel-ok'\n    | 'cancel-delete'\n    | 'custom';\n\nexport class PepDialogActionButton {\n    title = '';\n    className = '';\n    callback: () => void;\n\n    constructor(title = '', className = '', callback: () => void = null) {\n        this.title = title;\n        this.className = className;\n        this.callback = callback;\n    }\n}\n\nexport class PepDialogData {\n    title: string;\n    actionsType: PepDialogActionsType;\n    content: any;\n    showClose: boolean;\n    showHeader: boolean;\n    showFooter: boolean;\n    actionButtons: Array<PepDialogActionButton>;\n\n    constructor(options: {\n        title?: string;\n        actionsType?: PepDialogActionsType;\n        content?: any;\n        contentDisabled?: boolean;\n        showClose?: boolean;\n        showHeader?: boolean;\n        showFooter?: boolean;\n        actionButtons?: Array<PepDialogActionButton>;\n    }) {\n        this.title = options.title || '';\n        this.actionsType = options.actionsType || 'close';\n        this.content = options.content || '';\n        this.showClose = options.showClose ?? true;\n        this.showHeader = options.showHeader ?? true;\n        this.showFooter = options.showFooter ?? true;\n        this.actionButtons = options.actionButtons ?? null;\n    }\n}\n","import { Component, Inject, ViewEncapsulation } from '@angular/core';\nimport { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';\nimport { PepDialogData, PepDialogActionButton } from './dialog.model';\n\n@Component({\n    templateUrl: './default-dialog.component.html',\n    styleUrls: ['./default-dialog.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class PepDefaultDialogComponent {\n    constructor(\n        @Inject(MAT_DIALOG_DATA) public data: PepDialogData,\n        public dialogRef: MatDialogRef<any>\n    ) {}\n\n    onActionButtonClicked(button: PepDialogActionButton): void {\n        this.dialogRef.close(true);\n        this.dialogRef.afterClosed().subscribe((isActionButtonClicked) => {\n            if (isActionButtonClicked && button?.callback) {\n                button.callback();\n            }\n        });\n    }\n\n    closeDialog(res) {\n        this.dialogRef.close(res);\n    }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { MatDialogRef } from '@angular/material/dialog';\n\n@Component({\n    selector: 'pep-dialog',\n    styleUrls: ['./dialog.component.scss', './dialog.component.theme.scss'],\n    templateUrl: './dialog.component.html',\n})\nexport class PepDialogComponent {\n    @Input() title: string;\n    @Input() showClose = true;\n    @Input() showHeader = true;\n    @Input() showFooter = true;\n\n    // @Input() dialogRef: MatDialogRef<any>;\n\n    @Output() close: EventEmitter<any> = new EventEmitter<any>();\n\n    constructor() {}\n    \n    closeDialog() {\n        // if (this.dialogRef) {\n        //     this.dialogRef.close(null);\n        // }\n\n        this.close.emit(null);\n    }\n}\n","import { Injectable, TemplateRef } from '@angular/core';\nimport {\n    MatDialog,\n    MatDialogConfig,\n    MatDialogRef,\n} from '@angular/material/dialog';\nimport { PepLayoutService } from '@pepperi-addons/ngx-lib';\nimport { Overlay } from '@angular/cdk/overlay';\nimport { ComponentType } from '@angular/cdk/portal';\nimport { PepDialogSizeType, PepDialogData } from './dialog.model';\nimport { PepDefaultDialogComponent } from './default-dialog.component';\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class PepDialogService {\n    constructor(\n        private dialog: MatDialog,\n        private layoutService: PepLayoutService,\n        private overlay: Overlay\n    ) { }\n\n    private fixConfigIfNeeded(data: PepDialogData, config: MatDialogConfig) {\n        if (config.disableClose) {\n            if (\n                (((data.showClose !== undefined && !data.showClose) || (data.showHeader !== undefined && !data.showHeader)) && (data.showFooter !== undefined && !data.showFooter)) ||\n                (data.actionsType === 'custom' &&\n                    (data.actionButtons === null ||\n                        data.actionButtons.length === 0))\n            ) {\n                config.disableClose = false;\n            }\n        }\n    }\n\n    getDialogConfig(\n        options: {\n            disableClose?: boolean;\n            height?: string;\n            minWidth?: string;\n            maxWidth?: string;\n            maxHeight?: string;\n            panelClass?: string;\n        } = {},\n        size: PepDialogSizeType = 'regular'\n    ): MatDialogConfig {\n        const dialogConfig = new MatDialogConfig();\n\n        dialogConfig.autoFocus = false;\n        dialogConfig.direction = this.layoutService.isRtl() ? 'rtl' : 'ltr';\n        dialogConfig.disableClose = options.disableClose ?? true;\n        \n        dialogConfig.panelClass = ['pep-dialog'];\n        if (options.panelClass) {\n            dialogConfig.panelClass.push(options.panelClass);\n        }\n\n        if (size === 'inline') {\n            dialogConfig.height = options.height || 'auto';\n            dialogConfig.maxWidth = options.maxWidth || '100vw';\n            dialogConfig.maxHeight = options.maxHeight || '100vh';\n            dialogConfig.minWidth = options.minWidth || '300px';\n        }\n\n        dialogConfig.panelClass.push(size);\n\n        dialogConfig.scrollStrategy = this.overlay.scrollStrategies.noop();\n        // dialogConfig.scrollStrategy = this.overlay.scrollStrategies.block();\n\n        return dialogConfig;\n    }\n\n    openDefaultDialog(\n        data: PepDialogData,\n        config: MatDialogConfig = null\n    ): MatDialogRef<PepDefaultDialogComponent> {\n        if (!config) {\n            config = this.getDialogConfig();\n        }\n        this.fixConfigIfNeeded(data, config);\n\n        config.data = data;\n        const dialogRef = this.dialog.open(PepDefaultDialogComponent, config);\n        return dialogRef;\n    }\n\n    openDialog<T>(\n        componentOrTemplateRef: ComponentType<T> | TemplateRef<T>,\n        data: any = {},\n        config: MatDialogConfig = null\n    ): MatDialogRef<T> {\n        if (!config) {\n            config = this.getDialogConfig();\n        }\n        this.fixConfigIfNeeded(data, config);\n\n        config.data = data;\n        const dialogRef = this.dialog.open(componentOrTemplateRef, config);\n        return dialogRef;\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatDialogModule } from '@angular/material/dialog';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport {\n    PepIconModule,\n    PepIconRegistry,\n    pepIconSystemClose,\n} from '@pepperi-addons/ngx-lib/icon';\n\nimport { PepDefaultDialogComponent } from './default-dialog.component';\nimport { PepDialogComponent } from './dialog.component';\nimport { PepDialogService } from './dialog.service';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        // Material modules,\n        MatCommonModule,\n        MatButtonModule,\n        MatIconModule,\n        MatDialogModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepIconModule,\n    ],\n    exports: [PepDialogComponent],\n    declarations: [PepDefaultDialogComponent, PepDialogComponent],\n    entryComponents: [PepDefaultDialogComponent],\n    providers: [PepDialogService]\n})\nexport class PepDialogModule {\n    constructor(private pepIconRegistry: PepIconRegistry) {\n        this.pepIconRegistry.registerIcons([pepIconSystemClose]);\n    }\n}\n","/*\n * Public API Surface of ngx-lib/dialog\n */\nexport * from './dialog.module';\nexport * from './dialog.model';\nexport * from './dialog.component';\nexport * from './dialog.service';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n\nexport {PepDefaultDialogComponent as ɵa} from './default-dialog.component';"],"names":["Component","ViewEncapsulation","Inject","MAT_DIALOG_DATA","MatDialogRef","EventEmitter","Input","Output","MatDialogConfig","Injectable","MatDialog","PepLayoutService","Overlay","pepIconSystemClose","NgModule","CommonModule","MatCommonModule","MatButtonModule","MatIconModule","MatDialogModule","PepNgxLibModule","PepIconModule","PepIconRegistry"],"mappings":"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"}
+{"version":3,"file":"pepperi-addons-ngx-lib-dialog.umd.js","sources":["../../../projects/ngx-lib/dialog/dialog.model.ts","../../../projects/ngx-lib/dialog/default-dialog.component.ts","../../../projects/ngx-lib/dialog/dialog.component.ts","../../../projects/ngx-lib/dialog/dialog.service.ts","../../../projects/ngx-lib/dialog/dialog.module.ts","../../../projects/ngx-lib/dialog/public-api.ts","../../../projects/ngx-lib/dialog/pepperi-addons-ngx-lib-dialog.ts"],"sourcesContent":["export type PepDialogSizeType =\n    | 'inline'\n    | 'small'\n    | 'regular'\n    | 'large'\n    | 'full-screen';\n\nexport type PepDialogActionsType =\n    | 'close'\n    | 'cancel-continue'\n    | 'cancel-ok'\n    | 'cancel-delete'\n    | 'custom';\n\nexport class PepDialogActionButton {\n    title = '';\n    className = '';\n    callback: () => void;\n\n    constructor(title = '', className = '', callback: () => void = null) {\n        this.title = title;\n        this.className = className;\n        this.callback = callback;\n    }\n}\n\nexport class PepDialogData {\n    title: string;\n    actionsType: PepDialogActionsType;\n    content: any;\n    showClose: boolean;\n    showHeader: boolean;\n    showFooter: boolean;\n    actionButtons: Array<PepDialogActionButton>;\n\n    constructor(options: {\n        title?: string;\n        actionsType?: PepDialogActionsType;\n        content?: any;\n        contentDisabled?: boolean;\n        showClose?: boolean;\n        showHeader?: boolean;\n        showFooter?: boolean;\n        actionButtons?: Array<PepDialogActionButton>;\n    }) {\n        this.title = options.title || '';\n        this.actionsType = options.actionsType || 'close';\n        this.content = options.content || '';\n        this.showClose = options.showClose ?? false;\n        this.showHeader = options.showHeader ?? true;\n        this.showFooter = options.showFooter ?? true;\n        this.actionButtons = options.actionButtons ?? null;\n    }\n}\n","import { Component, Inject, ViewEncapsulation } from '@angular/core';\nimport { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';\nimport { PepDialogData, PepDialogActionButton } from './dialog.model';\n\n@Component({\n    templateUrl: './default-dialog.component.html',\n    styleUrls: ['./default-dialog.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class PepDefaultDialogComponent {\n    constructor(\n        @Inject(MAT_DIALOG_DATA) public data: PepDialogData,\n        public dialogRef: MatDialogRef<any>\n    ) {}\n\n    onActionButtonClicked(button: PepDialogActionButton): void {\n        this.dialogRef.close(true);\n        this.dialogRef.afterClosed().subscribe((isActionButtonClicked) => {\n            if (isActionButtonClicked && button?.callback) {\n                button.callback();\n            }\n        });\n    }\n\n    closeDialog(res) {\n        this.dialogRef.close(res);\n    }\n}\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { MatDialogRef } from '@angular/material/dialog';\n\n@Component({\n    selector: 'pep-dialog',\n    styleUrls: ['./dialog.component.scss', './dialog.component.theme.scss'],\n    templateUrl: './dialog.component.html',\n})\nexport class PepDialogComponent {\n    @Input() title: string;\n    @Input() showClose = false;\n    @Input() showHeader = true;\n    @Input() showFooter = true;\n\n    @Output() close: EventEmitter<any> = new EventEmitter<any>();\n\n    constructor() {}\n    \n    closeDialog() {\n        this.close.emit(null);\n    }\n}\n","import { Injectable, TemplateRef } from '@angular/core';\nimport {\n    MatDialog,\n    MatDialogConfig,\n    MatDialogRef,\n} from '@angular/material/dialog';\nimport { PepLayoutService } from '@pepperi-addons/ngx-lib';\nimport { Overlay } from '@angular/cdk/overlay';\nimport { ComponentType } from '@angular/cdk/portal';\nimport { PepDialogSizeType, PepDialogData } from './dialog.model';\nimport { PepDefaultDialogComponent } from './default-dialog.component';\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class PepDialogService {\n    constructor(\n        private dialog: MatDialog,\n        private layoutService: PepLayoutService,\n        private overlay: Overlay\n    ) { }\n\n    private fixConfigIfNeeded(data: PepDialogData, config: MatDialogConfig) {\n        if (config.disableClose) {\n            if (\n                (((data.showClose !== undefined && !data.showClose) || (data.showHeader !== undefined && !data.showHeader)) && (data.showFooter !== undefined && !data.showFooter)) ||\n                (data.actionsType === 'custom' &&\n                    (data.actionButtons === null ||\n                        data.actionButtons.length === 0))\n            ) {\n                config.disableClose = false;\n            }\n        }\n    }\n\n    getDialogConfig(\n        options: {\n            disableClose?: boolean;\n            height?: string;\n            minWidth?: string;\n            maxWidth?: string;\n            maxHeight?: string;\n            panelClass?: string;\n        } = {},\n        size: PepDialogSizeType = 'regular'\n    ): MatDialogConfig {\n        const dialogConfig = new MatDialogConfig();\n\n        dialogConfig.autoFocus = false;\n        dialogConfig.direction = this.layoutService.isRtl() ? 'rtl' : 'ltr';\n        dialogConfig.disableClose = options.disableClose ?? true;\n        \n        dialogConfig.panelClass = ['pep-dialog'];\n        if (options.panelClass) {\n            dialogConfig.panelClass.push(options.panelClass);\n        }\n\n        if (size === 'inline') {\n            dialogConfig.height = options.height || 'auto';\n            dialogConfig.maxWidth = options.maxWidth || '100vw';\n            dialogConfig.maxHeight = options.maxHeight || '100vh';\n            dialogConfig.minWidth = options.minWidth || '300px';\n        }\n\n        dialogConfig.panelClass.push(size);\n\n        dialogConfig.scrollStrategy = this.overlay.scrollStrategies.noop();\n        // dialogConfig.scrollStrategy = this.overlay.scrollStrategies.block();\n\n        return dialogConfig;\n    }\n\n    openDefaultDialog(\n        data: PepDialogData,\n        config: MatDialogConfig = null\n    ): MatDialogRef<PepDefaultDialogComponent> {\n        if (!config) {\n            config = this.getDialogConfig();\n        }\n        this.fixConfigIfNeeded(data, config);\n\n        config.data = data;\n        const dialogRef = this.dialog.open(PepDefaultDialogComponent, config);\n        return dialogRef;\n    }\n\n    openDialog<T>(\n        componentOrTemplateRef: ComponentType<T> | TemplateRef<T>,\n        data: any = {},\n        config: MatDialogConfig = null\n    ): MatDialogRef<T> {\n        if (!config) {\n            config = this.getDialogConfig();\n        }\n        this.fixConfigIfNeeded(data, config);\n\n        config.data = data;\n        const dialogRef = this.dialog.open(componentOrTemplateRef, config);\n        return dialogRef;\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatDialogModule } from '@angular/material/dialog';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport {\n    PepIconModule,\n    PepIconRegistry,\n    pepIconSystemClose,\n} from '@pepperi-addons/ngx-lib/icon';\n\nimport { PepDefaultDialogComponent } from './default-dialog.component';\nimport { PepDialogComponent } from './dialog.component';\nimport { PepDialogService } from './dialog.service';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        // Material modules,\n        MatCommonModule,\n        MatButtonModule,\n        MatIconModule,\n        MatDialogModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepIconModule,\n    ],\n    exports: [PepDialogComponent],\n    declarations: [PepDefaultDialogComponent, PepDialogComponent],\n    entryComponents: [PepDefaultDialogComponent],\n    providers: [PepDialogService]\n})\nexport class PepDialogModule {\n    constructor(private pepIconRegistry: PepIconRegistry) {\n        this.pepIconRegistry.registerIcons([pepIconSystemClose]);\n    }\n}\n","/*\n * Public API Surface of ngx-lib/dialog\n */\nexport * from './dialog.module';\nexport * from './dialog.model';\nexport * from './dialog.component';\nexport * from './dialog.service';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n\nexport {PepDefaultDialogComponent as ɵa} from './default-dialog.component';"],"names":["Component","ViewEncapsulation","Inject","MAT_DIALOG_DATA","MatDialogRef","EventEmitter","Input","Output","MatDialogConfig","Injectable","MatDialog","PepLayoutService","Overlay","pepIconSystemClose","NgModule","CommonModule","MatCommonModule","MatButtonModule","MatIconModule","MatDialogModule","PepNgxLibModule","PepIconModule","PepIconRegistry"],"mappings":"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"}

package/bundles/pepperi-addons-ngx-lib-list.umd.js

@@ -2581,7 +2581,7 @@
     PepListComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'pep-list',
-                    template: "<ng-container *ngIf=\"totalRows == 0\">\n    <ng-container *ngIf=\"noDataFoundMsg; then noDataMsgInputBlock; else noDataMsgDefaultBlock\"></ng-container>\n    <ng-template #noDataMsgInputBlock>\n        <div class=\"pep-border-bottom\">\n            <p class=\"title-xl no-data\">\n                {{ noDataFoundMsg }}\n            </p>\n        </div>\n    </ng-template>\n    <ng-template #noDataMsgDefaultBlock>\n        <div class=\"pep-border-bottom\">\n            <p class=\"title-xl no-data\">\n                {{ 'LIST.NO_DATA_FOUND' | translate}}\n            </p>\n        </div>\n        <div class=\"no-data-suggestions\">\n            <p class=\"suggestions-title title-lg\">\n                {{ 'LIST.NO_DATA_FOUND_SUGGESTIONS_TITLE' | translate}}\n            </p>\n            <ul class=\"suggestions-list body-lg\" [innerHtml]=\"'LIST.NO_DATA_FOUND_SUGGESTIONS_LIST' | translate\"></ul>\n        </div>\n    </ng-template>\n</ng-container>\n<ng-container *ngIf=\"totalRows > 0\">\n    <ng-container *ngTemplateOutlet=\"tableHeader\"></ng-container>\n\n    <virtual-scroller #scroller [items]=\"pagerType === 'pages' ? currentPageItems : items\"\n        [scrollDebounceTime]=\"scrollDebounceTime\" [scrollThrottlingTime]=\"scrollThrottlingTime\"\n        [bufferAmount]=\"printMode ? totalRows : -1\" [parentScroll]=\"parentScroll\" [disable]=\"loadingItemsFromApi\"\n        class=\"virtual-scroller\" [ngClass]=\"{ 'table-body': isTable, 'cards-body': !isTable }\"\n        (vsChange)=\"onVirtualScrollerChange($event)\" (vsChildRectChange)=\"onChildRectChange($event)\">\n        <ng-container *ngFor=\"let item of scroller.viewPortItems; let index = index; let isFirst = first;\">\n            <ng-container *ngTemplateOutlet=\"listData; context: {item: item, index:index}\"></ng-container>\n        </ng-container>\n    </virtual-scroller>\n\n    <pep-list-pager *ngIf=\"pagerType === 'pages'\" class=\" list-pager\" [disabled]=\"loadingItemsFromApi\"\n        [length]=\"totalRows\" [pageSize]=\"pageSize\" [pageIndex]=\"pageIndex\" (pagerChange)=\"onPagerChange($event)\">\n    </pep-list-pager>\n\n    <ng-container *ngTemplateOutlet=\"tableTotal\"></ng-container>\n</ng-container>\n\n<ng-template #listData let-item=\"item\" let-index=\"index\">\n    <ng-container *ngIf=\"isTable\">\n        <!-- getIsItemSelected(item) -> item | isItemSelected: selectionTypeForActions : selectedItemId : isAllSelected : selectedItems : unSelectedItems -->\n        <div class=\"table-row\" (mouseenter)=\"onTableRowMouseEnter($event, item?.UID, item?.Type)\" \n            (mouseleave)=\"onTableRowMouseLeave($event, item?.UID, item?.Type)\" [ngClass]=\"{\n                'compact-view': tableViewType === 'compact',\n                even: zebraStripes && index % 2 !== 0,\n                selected: getIsItemSelected(item),\n                highlighted: item?.UID + SEPARATOR + item?.Type === selectedItemId}\" [ngStyle]=\"{ visibility: !loadingItemsFromApi || item ? 'visible' : 'hidden' }\">\n            <fieldset class=\"table-row-fieldset\" [ngStyle]=\"{ 'background-color': item?.BackgroundColor }\">\n                <mat-checkbox *ngIf=\"selectionTypeForActions == 'multi'\" type=\"checkbox\"\n                    class=\"pull-left flip row-selection\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                    [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\" [ngStyle]=\"{\n                            visibility: !deviceHasMouse ||\n                            item?.UID + SEPARATOR + item?.Type === hoveredItemId || isAllSelected || selectedItems.size > 0 ? 'visible' : 'hidden'\n                        }\" [checked]=\"getIsItemSelected(item)\"\n                    (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n                </mat-checkbox>\n                <mat-radio-button *ngIf=\"selectionTypeForActions == 'single'\" name=\"selection\"\n                    class=\"pull-left flip row-selection pep-radio-button\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                    [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\"\n                    [checked]=\"getIsItemSelected(item)\"\n                    (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n                </mat-radio-button>\n                <pep-form [layoutType]=\"'table'\" [checkForChanges]=\"checkForChanges\" [layout]=\"layout\"\n                    [firstFieldAsLink]=\"firstFieldAsLink\" [data]=\"item\" [canEditObject]=\"!disabled\"\n                    [lockEvents]=\"lockItemInnerEvents || printMode\" [isReport]=\"isReport\" [isActive]=\"\n                            (item?.UID + SEPARATOR + item?.Type === selectedItemId ||\n                            item?.UID + SEPARATOR + item?.Type === hoveredItemId) && deviceHasMouse\n                        \" (valueChange)=\"onValueChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\"\n                    (click)=\"itemClicked($event, item)\">\n                </pep-form>\n            </fieldset>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"!isTable\">\n        <div (mouseenter)=\"onCardMouseEnter($event, item?.UID, item?.Type)\"\n            (mouseleave)=\"onCardMouseLeave($event, item?.UID, item?.Type)\" [ngClass]=\"{\n                    selected: getIsItemSelected(item),\n                    highlighted: item?.UID + SEPARATOR + item?.Type === selectedItemId,\n                    'line-view': viewType === 'lines',\n                    'card-view': viewType === 'cards',\n                    'small-card': cardSize === 'sm'\n                }\" class=\"pull-left flip\"\n            [ngStyle]=\"{ height: calculatedObjectHeight, visibility: !loadingItemsFromApi || item ? 'visible' : 'hidden' }\">\n            <mat-checkbox *ngIf=\"showCardSelection\" class=\"pull-left flip card-selection\"\n                [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\" [checked]=\"getIsItemSelected(item)\"\n                (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n            </mat-checkbox>\n            <pep-form [layoutType]=\"'card'\" [firstFieldAsLink]=\"firstFieldAsLink\" [checkForChanges]=\"checkForChanges\"\n                [layout]=\"layout\" [data]=\"item\" [canEditObject]=\"!disabled\"\n                [lockEvents]=\"lockItemInnerEvents || printMode\" [isActive]=\"\n                        (item?.UID + SEPARATOR + item?.Type === selectedItemId ||\n                        item?.UID + SEPARATOR + item?.Type === hoveredItemId) && deviceHasMouse\n                    \" (valueChange)=\"onValueChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\"\n                (click)=\"itemClicked($event, item)\">\n            </pep-form>\n        </div>\n    </ng-container>\n</ng-template>\n\n<ng-template #tableHeader>\n    <div *ngIf=\"isTable\" class=\"table-header\" (mouseup)=\"onListResizeEnd($event)\"\n        (mouseenter)=\"onListHeaderMouseEnter($event)\" (mouseleave)=\"onListHeaderMouseLeave($event)\"\n        (mousemove)=\"onListResize($event)\">\n\n        <div class=\"table-header-padding-top\"></div>\n        <fieldset class=\"table-header-fieldset\">\n            <mat-checkbox *ngIf=\"selectionTypeForActions !== 'none'\" #selectAllCB class=\"pull-left flip row-selection\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                type=\"checkbox\" [ngStyle]=\"{\n                        visibility:\n                            selectionTypeForActions == 'single' || \n                            (selectionTypeForActions == 'multi' && hideAllSelectionInMulti) ? 'hidden' : 'visible'\n                    }\"\n                [indeterminate]=\"isAllSelected ? unSelectedItems.size > 0 && unSelectedItems.size < totalRows : (selectedItems.size > 0 && !getIsAllSelectedForActions())\"\n                [disabled]=\"disabled || selectionTypeForActions === 'single'\" [checked]=\"getIsAllSelectedForActions()\"\n                (change)=\"selectAllItemsForActions($event)\"></mat-checkbox>\n            <fieldset>\n                <div *ngFor=\"let field of layout?.ControlFields; let j = index\" class=\"header-column pull-left flip\"\n                    [ngStyle]=\"{ width: field.calcTitleColumnWidthString }\" [ngClass]=\"{\n                            'compact-view': tableViewType === 'compact',\n                            'support-sorting': supportSorting,\n                            'has-sorting': field.ApiName === sortBy,\n                            'is-resizing': field.ApiName === pressedColumn,\n                            'is-first': j === 0 && selectionTypeForActions !== 'multi',\n                            'is-last': j === layout?.ControlFields?.length - 1\n                        }\"\n                    (click)=\"supportSorting ? (onListSortingChange(field.ApiName, sortBy !== null && sortBy != field.ApiName ? true : !isAsc, $event)) : false\">\n\n                    <label id=\"{{ field.ApiName }}\"\n                        class=\"header-label body-sm pull-left flip text-align-{{ field.Layout.XAlignment }}\"\n                        title=\"{{ field.Title }}\">\n                        <span *ngIf=\"field.Mandatory\" class=\"mandatory\">\n                            <pep-icon name=\"system_must\"></pep-icon>\n                        </span>\n                        {{ field.Title != '' ? field.Title : ' '}}\n                    </label>\n\n                    <div *ngIf=\"supportResizing\" class=\"resize-box pull-right flip\"\n                        (mousedown)=\"onListResizeStart($event, field.ApiName)\">\n                        <div class=\"splitter\"></div>\n                    </div>\n\n                    <div *ngIf=\"supportSorting\" class=\"sorting-box pull-left flip\"\n                        [ngClass]=\"{ 'has-sorting': field.ApiName === sortBy }\">\n                        <mat-icon *ngIf=\"field.ApiName !== sortBy\">\n                            <pep-icon name=\"arrow_either\" class=\"asc\"></pep-icon>\n                        </mat-icon>\n                        <ng-container *ngIf=\"field.ApiName === sortBy\">\n                            <mat-icon *ngIf=\"!isAsc\" [ngClass]=\"{ 'sort-by': field.ApiName === sortBy && isAsc }\"\n                                title=\"{{ 'LIST.SORT_ASC' | translate }}\">\n                                <pep-icon name=\"arrow_up\" class=\"asc\"></pep-icon>\n                            </mat-icon>\n                            <mat-icon *ngIf=\"isAsc\" [ngClass]=\"{ 'sort-by': field.ApiName === sortBy && !isAsc }\"\n                                title=\"{{ 'LIST.SORT_DESC' | translate }}\">\n                                <pep-icon name=\"arrow_down\" class=\"desc\"></pep-icon>\n                            </mat-icon>\n                        </ng-container>\n                    </div>\n                </div>\n            </fieldset>\n        </fieldset>\n    </div>\n</ng-template>\n\n<ng-template #tableTotal>\n    <div *ngIf=\"isTable && totalsRow?.length > 0 && totalsRow.length <= layout?.ControlFields.length\"\n        class=\"table-total\">\n        <fieldset class=\"table-header-fieldset\">\n            <div *ngFor=\"let field of layout?.ControlFields; let j = index\" class=\"total-column pull-left flip\"\n                [ngStyle]=\"{ width: field.calcTitleColumnWidthString }\">\n                <label class=\"total-label body-sm text-align-{{ field.Layout.XAlignment }}\">\n                    {{ totalsRow[j] }}\n                </label>\n            </div>\n        </fieldset>\n    </div>\n</ng-template>",
+                    template: "<ng-container *ngIf=\"totalRows == 0\">\n    <ng-container *ngIf=\"noDataFoundMsg; then noDataMsgInputBlock; else noDataMsgDefaultBlock\"></ng-container>\n    <ng-template #noDataMsgInputBlock>\n        <div class=\"pep-border-bottom\">\n            <p class=\"title-xl no-data\">\n                {{ noDataFoundMsg }}\n            </p>\n        </div>\n    </ng-template>\n    <ng-template #noDataMsgDefaultBlock>\n        <div class=\"pep-border-bottom\">\n            <p class=\"title-xl no-data\">\n                {{ 'LIST.NO_DATA_FOUND' | translate}}\n            </p>\n        </div>\n        <div class=\"no-data-suggestions\">\n            <p class=\"suggestions-title title-lg\">\n                {{ 'LIST.NO_DATA_FOUND_SUGGESTIONS_TITLE' | translate}}\n            </p>\n            <ul class=\"suggestions-list body-lg\" [innerHtml]=\"'LIST.NO_DATA_FOUND_SUGGESTIONS_LIST' | translate\"></ul>\n        </div>\n    </ng-template>\n</ng-container>\n<ng-container *ngIf=\"totalRows > 0\">\n    <ng-container *ngTemplateOutlet=\"tableHeader\"></ng-container>\n\n    <virtual-scroller #scroller [items]=\"pagerType === 'pages' ? currentPageItems : items\"\n        [scrollDebounceTime]=\"scrollDebounceTime\" [scrollThrottlingTime]=\"scrollThrottlingTime\"\n        [bufferAmount]=\"printMode ? totalRows : -1\" [parentScroll]=\"parentScroll\" [disable]=\"loadingItemsFromApi\"\n        class=\"virtual-scroller\" [ngClass]=\"{ 'table-body': isTable, 'cards-body': !isTable }\"\n        (vsChange)=\"onVirtualScrollerChange($event)\" (vsChildRectChange)=\"onChildRectChange($event)\">\n        <ng-container *ngFor=\"let item of scroller.viewPortItems; let index = index; let isFirst = first;\">\n            <ng-container *ngTemplateOutlet=\"listData; context: {item: item, index:index}\"></ng-container>\n        </ng-container>\n    </virtual-scroller>\n\n    <pep-list-pager *ngIf=\"pagerType === 'pages'\" class=\" list-pager\" [disabled]=\"loadingItemsFromApi\"\n        [length]=\"totalRows\" [pageSize]=\"pageSize\" [pageIndex]=\"pageIndex\" (pagerChange)=\"onPagerChange($event)\">\n    </pep-list-pager>\n\n    <ng-container *ngTemplateOutlet=\"tableTotal\"></ng-container>\n</ng-container>\n\n<ng-template #listData let-item=\"item\" let-index=\"index\">\n    <ng-container *ngIf=\"isTable\">\n        <!-- getIsItemSelected(item) -> item | isItemSelected: selectionTypeForActions : selectedItemId : isAllSelected : selectedItems : unSelectedItems -->\n        <div class=\"table-row\" (mouseenter)=\"onTableRowMouseEnter($event, item?.UID, item?.Type)\" \n            (mouseleave)=\"onTableRowMouseLeave($event, item?.UID, item?.Type)\" [ngClass]=\"{\n                'compact-view': tableViewType === 'compact',\n                even: zebraStripes && index % 2 !== 0,\n                selected: getIsItemSelected(item),\n                highlighted: item?.UID + SEPARATOR + item?.Type === selectedItemId}\" [ngStyle]=\"{ visibility: !loadingItemsFromApi || item ? 'visible' : 'hidden' }\">\n            <fieldset class=\"table-row-fieldset\" [ngStyle]=\"{ 'background-color': item?.BackgroundColor }\">\n                <mat-checkbox *ngIf=\"selectionTypeForActions == 'multi'\" type=\"checkbox\"\n                    class=\"pull-left flip row-selection\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                    [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\" [ngStyle]=\"{\n                            visibility: !deviceHasMouse ||\n                            item?.UID + SEPARATOR + item?.Type === hoveredItemId || isAllSelected || selectedItems.size > 0 ? 'visible' : 'hidden'\n                        }\" [checked]=\"getIsItemSelected(item)\"\n                    (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n                </mat-checkbox>\n                <mat-radio-button *ngIf=\"selectionTypeForActions == 'single'\" name=\"selection\"\n                    class=\"pull-left flip row-selection pep-radio-button\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                    [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\"\n                    [checked]=\"getIsItemSelected(item)\"\n                    (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n                </mat-radio-button>\n                <pep-form [layoutType]=\"'table'\" [checkForChanges]=\"checkForChanges\" [layout]=\"layout\"\n                    [firstFieldAsLink]=\"firstFieldAsLink\" [data]=\"item\" [canEditObject]=\"!disabled\"\n                    [lockEvents]=\"lockItemInnerEvents || printMode\" [isReport]=\"isReport\" [isActive]=\"\n                            (item?.UID + SEPARATOR + item?.Type === selectedItemId ||\n                            item?.UID + SEPARATOR + item?.Type === hoveredItemId) && deviceHasMouse\n                        \" (valueChange)=\"onValueChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\"\n                    (click)=\"itemClicked($event, item)\">\n                </pep-form>\n            </fieldset>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"!isTable\">\n        <div (mouseenter)=\"onCardMouseEnter($event, item?.UID, item?.Type)\"\n            (mouseleave)=\"onCardMouseLeave($event, item?.UID, item?.Type)\" [ngClass]=\"{\n                    selected: getIsItemSelected(item),\n                    highlighted: item?.UID + SEPARATOR + item?.Type === selectedItemId,\n                    'line-view': viewType === 'lines',\n                    'card-view': viewType === 'cards',\n                    'small-card': cardSize === 'sm'\n                }\" class=\"pull-left flip\"\n            [ngStyle]=\"{ height: 'initial', visibility: !loadingItemsFromApi || item ? 'visible' : 'hidden' }\">\n            <mat-checkbox *ngIf=\"showCardSelection\" class=\"pull-left flip card-selection\"\n                [disabled]=\"item | isItemDisabled: lockItemInnerEvents : printMode\" [checked]=\"getIsItemSelected(item)\"\n                (change)=\"selectItemForActions($event, item?.UID, item?.IsSelectableForActions, item?.Type)\">\n            </mat-checkbox>\n            <pep-form [layoutType]=\"'card'\" [firstFieldAsLink]=\"firstFieldAsLink\" [checkForChanges]=\"checkForChanges\"\n                [layout]=\"layout\" [data]=\"item\" [canEditObject]=\"!disabled\"\n                [lockEvents]=\"lockItemInnerEvents || printMode\" [isActive]=\"\n                        (item?.UID + SEPARATOR + item?.Type === selectedItemId ||\n                        item?.UID + SEPARATOR + item?.Type === hoveredItemId) && deviceHasMouse\n                    \" (valueChange)=\"onValueChanged($event)\" (fieldClick)=\"onCustomizeFieldClick($event)\"\n                (click)=\"itemClicked($event, item)\">\n            </pep-form>\n        </div>\n    </ng-container>\n</ng-template>\n\n<ng-template #tableHeader>\n    <div *ngIf=\"isTable\" class=\"table-header\" (mouseup)=\"onListResizeEnd($event)\"\n        (mouseenter)=\"onListHeaderMouseEnter($event)\" (mouseleave)=\"onListHeaderMouseLeave($event)\"\n        (mousemove)=\"onListResize($event)\">\n\n        <div class=\"table-header-padding-top\"></div>\n        <fieldset class=\"table-header-fieldset\">\n            <mat-checkbox *ngIf=\"selectionTypeForActions !== 'none'\" #selectAllCB class=\"pull-left flip row-selection\" [ngClass]=\"{ 'md': tableViewType === 'compact' }\"\n                type=\"checkbox\" [ngStyle]=\"{\n                        visibility:\n                            selectionTypeForActions == 'single' || \n                            (selectionTypeForActions == 'multi' && hideAllSelectionInMulti) ? 'hidden' : 'visible'\n                    }\"\n                [indeterminate]=\"isAllSelected ? unSelectedItems.size > 0 && unSelectedItems.size < totalRows : (selectedItems.size > 0 && !getIsAllSelectedForActions())\"\n                [disabled]=\"disabled || selectionTypeForActions === 'single'\" [checked]=\"getIsAllSelectedForActions()\"\n                (change)=\"selectAllItemsForActions($event)\"></mat-checkbox>\n            <fieldset>\n                <div *ngFor=\"let field of layout?.ControlFields; let j = index\" class=\"header-column pull-left flip\"\n                    [ngStyle]=\"{ width: field.calcTitleColumnWidthString }\" [ngClass]=\"{\n                            'compact-view': tableViewType === 'compact',\n                            'support-sorting': supportSorting,\n                            'has-sorting': field.ApiName === sortBy,\n                            'is-resizing': field.ApiName === pressedColumn,\n                            'is-first': j === 0 && selectionTypeForActions !== 'multi',\n                            'is-last': j === layout?.ControlFields?.length - 1\n                        }\"\n                    (click)=\"supportSorting ? (onListSortingChange(field.ApiName, sortBy !== null && sortBy != field.ApiName ? true : !isAsc, $event)) : false\">\n\n                    <label id=\"{{ field.ApiName }}\"\n                        class=\"header-label body-sm pull-left flip text-align-{{ field.Layout.XAlignment }}\"\n                        title=\"{{ field.Title }}\">\n                        <span *ngIf=\"field.Mandatory\" class=\"mandatory\">\n                            <pep-icon name=\"system_must\"></pep-icon>\n                        </span>\n                        {{ field.Title != '' ? field.Title : ' '}}\n                    </label>\n\n                    <div *ngIf=\"supportResizing\" class=\"resize-box pull-right flip\"\n                        (mousedown)=\"onListResizeStart($event, field.ApiName)\">\n                        <div class=\"splitter\"></div>\n                    </div>\n\n                    <div *ngIf=\"supportSorting\" class=\"sorting-box pull-left flip\"\n                        [ngClass]=\"{ 'has-sorting': field.ApiName === sortBy }\">\n                        <mat-icon *ngIf=\"field.ApiName !== sortBy\">\n                            <pep-icon name=\"arrow_either\" class=\"asc\"></pep-icon>\n                        </mat-icon>\n                        <ng-container *ngIf=\"field.ApiName === sortBy\">\n                            <mat-icon *ngIf=\"!isAsc\" [ngClass]=\"{ 'sort-by': field.ApiName === sortBy && isAsc }\"\n                                title=\"{{ 'LIST.SORT_ASC' | translate }}\">\n                                <pep-icon name=\"arrow_up\" class=\"asc\"></pep-icon>\n                            </mat-icon>\n                            <mat-icon *ngIf=\"isAsc\" [ngClass]=\"{ 'sort-by': field.ApiName === sortBy && !isAsc }\"\n                                title=\"{{ 'LIST.SORT_DESC' | translate }}\">\n                                <pep-icon name=\"arrow_down\" class=\"desc\"></pep-icon>\n                            </mat-icon>\n                        </ng-container>\n                    </div>\n                </div>\n            </fieldset>\n        </fieldset>\n    </div>\n</ng-template>\n\n<ng-template #tableTotal>\n    <div *ngIf=\"isTable && totalsRow?.length > 0 && totalsRow.length <= layout?.ControlFields.length\"\n        class=\"table-total\">\n        <fieldset class=\"table-header-fieldset\">\n            <div *ngFor=\"let field of layout?.ControlFields; let j = index\" class=\"total-column pull-left flip\"\n                [ngStyle]=\"{ width: field.calcTitleColumnWidthString }\">\n                <label class=\"total-label body-sm text-align-{{ field.Layout.XAlignment }}\">\n                    {{ totalsRow[j] }}\n                </label>\n            </div>\n        </fieldset>\n    </div>\n</ng-template>",
                     host: {
                         '(window:resize)': 'onWinResize($event)',
                     },