@pepperi-addons/ngx-composite-lib 0.0.16-beta.4 → 0.0.16-beta.42

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

@@ -1,8 +1,8 @@
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@pepperi-addons/ngx-lib'), require('rxjs'), require('@pepperi-addons/ngx-lib/list'), require('@pepperi-addons/papi-sdk/dist/entities/data-view'), require('@ngx-translate/core'), require('@pepperi-addons/ngx-lib/query-builder'), require('@pepperi-addons/data-views'), require('@pepperi-addons/ngx-lib/page-layout'), require('@pepperi-addons/ngx-lib/top-bar'), require('@pepperi-addons/ngx-lib/search'), require('@pepperi-addons/ngx-lib/side-bar'), require('@pepperi-addons/ngx-lib/smart-filters'), require('@pepperi-addons/ngx-lib/bread-crumbs'), require('@pepperi-addons/ngx-lib/form'), require('@pepperi-addons/ngx-lib/menu')) :
     typeof define === 'function' && define.amd ? define('@pepperi-addons/ngx-composite-lib/generic-list', ['exports', '@angular/core', '@angular/common', '@pepperi-addons/ngx-lib', 'rxjs', '@pepperi-addons/ngx-lib/list', '@pepperi-addons/papi-sdk/dist/entities/data-view', '@ngx-translate/core', '@pepperi-addons/ngx-lib/query-builder', '@pepperi-addons/data-views', '@pepperi-addons/ngx-lib/page-layout', '@pepperi-addons/ngx-lib/top-bar', '@pepperi-addons/ngx-lib/search', '@pepperi-addons/ngx-lib/side-bar', '@pepperi-addons/ngx-lib/smart-filters', '@pepperi-addons/ngx-lib/bread-crumbs', '@pepperi-addons/ngx-lib/form', '@pepperi-addons/ngx-lib/menu'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["pepperi-addons"] = global["pepperi-addons"] || {}, global["pepperi-addons"]["ngx-composite-lib"] = global["pepperi-addons"]["ngx-composite-lib"] || {}, global["pepperi-addons"]["ngx-composite-lib"]["generic-list"] = {}), global.ng.core, global.ng.common, global["ngx-lib"], global.rxjs, global["ngx-lib/list"], global["papi-sdk/data-view"], global.translate, global.i2, global.dataViews, global["ngx-lib/page-layout"], global["ngx-lib/top-bar"], global["ngx-lib/search"], global.i8, global.i9, global["ngx-lib/bread-crumbs"], global["ngx-lib/form"], global["ngx-lib/menu"]));
-})(this, (function (exports, i0, i11, i1, rxjs, i6, dataView, i1$1, i2, dataViews, i4, i5, i7, i8, i9, i10, form, menu) { 'use strict';
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["pepperi-addons"] = global["pepperi-addons"] || {}, global["pepperi-addons"]["ngx-composite-lib"] = global["pepperi-addons"]["ngx-composite-lib"] || {}, global["pepperi-addons"]["ngx-composite-lib"]["generic-list"] = {}), global.ng.core, global.ng.common, global["ngx-lib"], global.rxjs, global["ngx-lib/list"], global["papi-sdk/data-view"], global.translate, global["ngx-lib/query-builder"], global["data-views"], global["ngx-lib/page-layout"], global["ngx-lib/top-bar"], global["ngx-lib/search"], global["ngx-lib/side-bar"], global["ngx-lib/smart-filters"], global["ngx-lib/bread-crumbs"], global["ngx-lib/form"], global["ngx-lib/menu"]));
+})(this, (function (exports, i0, i10, i1, rxjs, i5, dataView, i1$1, i2, dataViews, i3, i4, i6, i7, i8, i9, form, menu) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -23,17 +23,17 @@
     }
 
     var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
-    var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
+    var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
     var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1);
-    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
     var i1__namespace = /*#__PURE__*/_interopNamespace(i1$1);
     var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
+    var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
     var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
-    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
     var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
     var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
     var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
-    var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -368,20 +368,33 @@
         PepGenericListService.prototype.hasProperty = function (obj, prop) {
             return Object.prototype.hasOwnProperty.call(obj, prop);
         };
-        PepGenericListService.prototype.convertToPepRowData = function (object, dataView$1, uuidMapping) {
+        PepGenericListService.prototype.getListViewType = function (dataViewType) {
+            switch (dataViewType) {
+                case 'Grid':
+                    return 'table';
+                case 'Card':
+                    return 'cards';
+                case 'Line':
+                    return 'lines';
+                default:
+                    return 'table';
+            }
+        };
+        PepGenericListService.prototype.convertToPepRowData = function (item, dataView$1, uuidMapping) {
+            var _a;
             var row = new i1.PepRowData();
             var itemFields;
-            if (this.hasProperty(object, 'fields') && typeof object.fields === 'object') {
-                itemFields = object.fields;
-                if (object.isEditable === false) {
+            if (this.hasProperty(item, 'fields') && typeof item.fields === 'object') {
+                itemFields = item.fields;
+                if (item.isEditable === false) {
                     row.IsEditable = false;
                 }
-                if (object.isSelectableForActions === false) {
+                if (item.isSelectableForActions === false) {
                     row.IsSelectableForActions = false;
                 }
             }
             else {
-                itemFields = object;
+                itemFields = item;
             }
             row.UUID = itemFields[uuidMapping] || undefined;
             row.Fields = [];
@@ -390,13 +403,13 @@
                     var field = dataView$1.Fields[index];
                     row.Fields.push({
                         ApiName: field.FieldID,
-                        Title: this._translate.instant(field.Title),
+                        Title: field.Title ? this._translate.instant(field.Title) : '',
                         XAlignment: 1,
                         FormattedValue: (itemFields[field.FieldID] || '').toString(),
                         Value: (itemFields[field.FieldID] || '').toString(),
-                        ColumnWidth: dataView$1.Columns[index].Width,
+                        ColumnWidth: ((_a = dataView$1.Columns[index]) === null || _a === void 0 ? void 0 : _a.Width) || undefined,
                         AdditionalValue: '',
-                        OptionalValues: [],
+                        OptionalValues: field.OptionalValues || [],
                         FieldType: dataView.DataViewFieldTypes[field.Type],
                         ReadOnly: field.ReadOnly,
                         Enabled: !field.ReadOnly
@@ -463,12 +476,14 @@
             }], ctorParameters: function () { return [{ type: i1__namespace.TranslateService }, { type: i2__namespace.PepQueryBuilderService }]; } });
 
     var GenericListComponent = /** @class */ (function () {
-        function GenericListComponent(_resolver, _dataConvertorService, _layoutService, _translate, _genericListService) {
+        function GenericListComponent(_resolver, _dataConvertorService, _layoutService, _loaderService, 
+        // private _translate: TranslateService,
+        _genericListService) {
             var _this = this;
             this._resolver = _resolver;
             this._dataConvertorService = _dataConvertorService;
             this._layoutService = _layoutService;
-            this._translate = _translate;
+            this._loaderService = _loaderService;
             this._genericListService = _genericListService;
             this._dataSource = {
                 init: function (params) { return __awaiter(_this, void 0, void 0, function () {
@@ -494,10 +509,11 @@
             this.disabled = false;
             this.addPadding = false;
             this.title = '';
+            this.description = '';
             this.inline = false;
             this.showSearch = false;
             this.noDataFoundMsg = '';
-            this.selectionType = 'single';
+            this.selectionType = 'multi';
             this.supportSorting = false;
             this.pager = {
                 type: 'scroll'
@@ -510,6 +526,7 @@
             this.valueChange = new i0.EventEmitter();
             this.breadCrumbItemClick = new i0.EventEmitter();
             this._resize$ = new rxjs.Subscription();
+            this._loader$ = new rxjs.Subscription();
             this._dataView = {
                 Type: 'Grid'
             };
@@ -527,6 +544,9 @@
             this._resize$ = this._layoutService.onResize$.pipe().subscribe(function (size) {
                 //            
             });
+            this._loader$ = this._loaderService.onChanged$.subscribe(function (status) {
+                //
+            });
         }
         Object.defineProperty(GenericListComponent.prototype, "pepListContainer", {
             set: function (val) {
@@ -581,15 +601,16 @@
                                     if (this._pepListContainer.length > 0) {
                                         this._pepListContainer.remove();
                                     }
-                                    factory = this._resolver.resolveComponentFactory(i6.PepListComponent);
+                                    factory = this._resolver.resolveComponentFactory(i5.PepListComponent);
                                     componentRef = this._pepListContainer.createComponent(factory);
                                     this.pepList = componentRef.instance;
                                     //merge selector inputs with callback inputs
                                     this.loadTableInputs();
                                     fromIndex = 0;
                                     toIndex = 0;
-                                    if (this._tableInputs.pager.type === 'pages') {
-                                        toIndex = fromIndex + (this._tableInputs.pager.size || i6.DEFAULT_PAGE_SIZE) - 1;
+                                    if (this._listInputs.pager.type === 'pages') {
+                                        fromIndex = this._listInputs.pager.size * this._listInputs.pager.index;
+                                        toIndex = fromIndex + (this._listInputs.pager.size || i5.DEFAULT_PAGE_SIZE) - 1;
                                     }
                                     else {
                                         toIndex = 100; //TO DO - get value from - this.customList.getTopItems()
@@ -598,21 +619,22 @@
                                 case 1:
                                     data = _d.sent();
                                     this.totalRowCount = (data === null || data === void 0 ? void 0 : data.totalCount) || 0;
-                                    componentRef.instance.viewType = 'table';
-                                    componentRef.instance.tableViewType = this._tableInputs.tableViewType;
-                                    componentRef.instance.zebraStripes = this._tableInputs.zebraStripes;
+                                    componentRef.instance.viewType = this._genericListService.getListViewType(this._dataView.Type);
+                                    componentRef.instance.tableViewType = this._listInputs.tableViewType;
+                                    componentRef.instance.zebraStripes = this._listInputs.zebraStripes;
                                     if (this.disabled) {
                                         componentRef.instance.disabled = true;
                                         componentRef.instance.lockItemInnerEvents = true;
                                     }
-                                    componentRef.instance.supportSorting = this._tableInputs.supportSorting;
-                                    componentRef.instance.selectionTypeForActions = this._tableInputs.selectionType;
-                                    componentRef.instance.pagerType = this._tableInputs.pager.type;
-                                    if (this._tableInputs.pager.type === 'pages') {
-                                        componentRef.instance.pageSize = ((_a = this._tableInputs.pager) === null || _a === void 0 ? void 0 : _a.size) || i6.DEFAULT_PAGE_SIZE;
-                                        componentRef.instance.pageIndex = ((_b = this._tableInputs.pager) === null || _b === void 0 ? void 0 : _b.index) || 0;
+                                    componentRef.instance.supportSorting = this._listInputs.supportSorting;
+                                    componentRef.instance.selectionTypeForActions = this._listInputs.selectionType;
+                                    componentRef.instance.showCardSelection = this._listInputs.selectionType !== 'none';
+                                    componentRef.instance.pagerType = this._listInputs.pager.type;
+                                    if (this._listInputs.pager.type === 'pages') {
+                                        componentRef.instance.pageSize = ((_a = this._listInputs.pager) === null || _a === void 0 ? void 0 : _a.size) || i5.DEFAULT_PAGE_SIZE;
+                                        componentRef.instance.pageIndex = ((_b = this._listInputs.pager) === null || _b === void 0 ? void 0 : _b.index) || 0;
                                     }
-                                    componentRef.instance.noDataFoundMsg = this._tableInputs.noDataFoundMsg;
+                                    componentRef.instance.noDataFoundMsg = this._listInputs.noDataFoundMsg;
                                     componentRef.instance.fieldClick.subscribe(function ($event) {
                                         _this.onCustomizeFieldClick($event);
                                     });
@@ -654,7 +676,7 @@
          */
         GenericListComponent.prototype.loadTableInputs = function () {
             var _this = this;
-            this._tableInputs = {
+            this._listInputs = {
                 supportSorting: this.supportSorting,
                 selectionType: this.selectionType,
                 pager: this.pager,
@@ -664,8 +686,8 @@
             };
             if (this._dataSource.inputs) {
                 Object.entries(this._dataSource.inputs).forEach(function (item) {
-                    if (_this._genericListService.hasProperty(_this._tableInputs, item[0])) {
-                        _this._tableInputs[item[0]] = item[1];
+                    if (_this._genericListService.hasProperty(_this._listInputs, item[0])) {
+                        _this._listInputs[item[0]] = item[1];
                     }
                 });
             }
@@ -681,7 +703,7 @@
         };
         GenericListComponent.prototype.loadMenuItems = function () {
             var _this = this;
-            if (this._tableInputs.selectionType !== 'none') {
+            if (this._listInputs.selectionType !== 'none') {
                 this.getMenuActions().then(function (x) { return _this.menuActions = x; });
             }
         };
@@ -716,7 +738,7 @@
         GenericListComponent.prototype.getMenuObjects = function () {
             var menuObjects = {
                 success: false,
-                data: new i6.PepSelectionData()
+                data: new i5.PepSelectionData()
             };
             if (this.pepList) {
                 menuObjects.success = true;
@@ -736,18 +758,25 @@
                 var _this = this;
                 return __generator(this, function (_d) {
                     switch (_d.label) {
-                        case 0: return [4 /*yield*/, this._dataSource.init({
-                                searchString: this.searchString || undefined,
-                                filters: this._appliedFilters.length ? this._appliedFilters : undefined,
-                                sorting: this._sorting || undefined,
-                                fromIndex: fromIndex,
-                                toIndex: toIndex
-                            })];
+                        case 0:
+                            setTimeout(function () {
+                                _this._loaderService.show();
+                            }, 150);
+                            return [4 /*yield*/, this._dataSource.init({
+                                    searchString: this.searchString || undefined,
+                                    filters: this._appliedFilters.length ? this._appliedFilters : undefined,
+                                    sorting: this._sorting || undefined,
+                                    fromIndex: fromIndex,
+                                    toIndex: toIndex
+                                })];
                         case 1:
                             data = _d.sent();
+                            setTimeout(function () {
+                                _this._loaderService.hide();
+                            }, 150);
                             if (data) {
                                 this._dataView = data.dataView;
-                                if (((_a = data.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+                                if (((_a = data.items) === null || _a === void 0 ? void 0 : _a.length) > 0 && !data.isPepRowData) {
                                     data.items = data.items.map(function (item) { return _this._genericListService.convertToPepRowData(item, data.dataView, _this.uuidMapping); });
                                 }
                             }
@@ -765,6 +794,9 @@
                     switch (_d.label) {
                         case 0:
                             if (!this._dataSource.update) return [3 /*break*/, 2];
+                            setTimeout(function () {
+                                _this._loaderService.show();
+                            }, 150);
                             return [4 /*yield*/, this._dataSource.update({
                                     searchString: this.searchString || undefined,
                                     filters: this._appliedFilters.length ? this._appliedFilters : undefined,
@@ -775,6 +807,9 @@
                                 })];
                         case 1:
                             dataList = _d.sent();
+                            setTimeout(function () {
+                                _this._loaderService.hide();
+                            }, 150);
                             if ((dataList === null || dataList === void 0 ? void 0 : dataList.length) > 0) {
                                 return [2 /*return*/, dataList.map(function (item) { return _this._genericListService.convertToPepRowData(item, _this._dataView, _this.uuidMapping); })];
                             }
@@ -843,6 +878,9 @@
                 return null;
             }
         };
+        GenericListComponent.prototype.getPageIndex = function () {
+            return this.pepList.pageIndex;
+        };
         GenericListComponent.prototype.onActionItemClicked = function (action) {
             var result = this.getMenuObjects();
             if (result.success) {
@@ -881,11 +919,14 @@
             if (this._resize$) {
                 this._resize$.unsubscribe();
             }
+            if (this._loader$) {
+                this._loader$.unsubscribe();
+            }
         };
         return GenericListComponent;
     }());
-    GenericListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: GenericListComponent, deps: [{ token: i0__namespace.ComponentFactoryResolver }, { token: i1__namespace$1.PepDataConvertorService }, { token: i1__namespace$1.PepLayoutService }, { token: i1__namespace.TranslateService }, { token: PepGenericListService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    GenericListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: GenericListComponent, selector: "pep-generic-list", inputs: { dataSource: "dataSource", actions: "actions", uuidMapping: "uuidMapping", disabled: "disabled", addPadding: "addPadding", title: "title", inline: "inline", showSearch: "showSearch", noDataFoundMsg: "noDataFoundMsg", selectionType: "selectionType", supportSorting: "supportSorting", pager: "pager", tableViewType: "tableViewType", zebraStripes: "zebraStripes", smartFilter: "smartFilter", showTopBar: "showTopBar", breadCrumbsItems: "breadCrumbsItems" }, outputs: { fieldClick: "fieldClick", valueChange: "valueChange", breadCrumbItemClick: "breadCrumbItemClick" }, providers: [PepGenericListService], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true }, { propertyName: "pepListContainer", first: true, predicate: ["pepListContainer"], descendants: true, read: i0.ViewContainerRef }], ngImport: i0__namespace, template: "<div *ngIf=\"inline\" class=\"inline-container\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"header-area\">\n        <div *ngIf=\"showTopBar\" class=\"inline-top-bar-container\">\n            <ng-container *ngTemplateOutlet=\"topBarTemplate\"></ng-container>\n        </div>\n        <ng-container *ngIf=\"breadCrumbsItems.length\">\n            <ng-container *ngTemplateOutlet=\"breadCrumbsTemplate\"></ng-container>\n        </ng-container>\n    </div>\n    <ng-container *ngIf=\"showSmartFilter\">\n        <ng-container *ngTemplateOutlet=\"smartFilterTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n</div>\n\n<pep-page-layout *ngIf=\"!inline\" [addPadding]=\"addPadding\" [showShadow]=\"showSmartFilter\">\n    <ng-container *ngIf=\"showSmartFilter\" pep-side-area>\n        <ng-container *ngTemplateOutlet=\"smartFilterTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"showTopBar\" pep-top-area>\n        <ng-container *ngTemplateOutlet=\"topBarTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"breadCrumbsItems.length\" pep-top-area>\n        <ng-container *ngTemplateOutlet=\"breadCrumbsTemplate\"></ng-container>\n    </ng-container>\n    <div pep-main-area class=\"main-area-container\">\n        <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n    </div>\n</pep-page-layout>\n\n<ng-template #topBarTemplate>\n    <pep-top-bar [title]=\"title\" [inline]=\"inline\">\n        <div header-start-content>\n            <ng-content select=\"[left-top-area]\"></ng-content>\n        </div>\n        <div header-end-content>\n            <ng-content select=\"[right-top-area]\"></ng-content>\n        </div>\n        <!-- <div footer-start-content>\n            <ng-content select=\"[left-bottom-area]\"></ng-content>               \n        </div>\n        <div footer-end-content>\n            <ng-content select=\"[right-bottom-area]\"></ng-content>     \n        </div> -->\n        <pep-list-actions *ngIf=\"menuActions.length > 0\" [sizeType]=\"inline ? 'sm' : 'md'\" [actions]=\"menuActions\"\n            (actionClick)=\"onActionItemClicked($event)\"></pep-list-actions>\n        <pep-list-total [sizeType]=\"inline ? 'sm' : 'md'\" [totalRows]=\"totalRowCount\">\n        </pep-list-total>\n        <pep-search #search *ngIf=\"showSearch\" [value]=\"searchString\" [sizeType]=\"inline ? 'sm' : 'md'\"\n            (search)=\"onSearchChanged($event)\">\n        </pep-search>\n    </pep-top-bar>\n</ng-template>\n\n<ng-template #smartFilterTemplate>\n    <pep-side-bar #sideNav [ngClass]=\"{'smart-filter-area': inline}\">\n        <pep-smart-filters title=\"Test filters\" [fields]=\"internalSmartFilter.fields\"\n            [filters]=\"internalSmartFilter.data\" (filtersChange)=\"onFiltersChange($event)\">\n        </pep-smart-filters>\n    </pep-side-bar>\n</ng-template>\n\n<ng-template #breadCrumbsTemplate>\n    <pep-bread-crumbs class=\"bread-crumbs\" [items]=\"breadCrumbsItems\" [addSpacing]=\"true\" [displayType]=\"'items'\"\n        (itemClick)=\"onBreadCrumbItemClick($event)\"></pep-bread-crumbs>\n</ng-template>\n\n<ng-template #listTemplate>\n    <div class=\"list-container\">\n        <ng-container #pepListContainer></ng-container>\n    </div>\n</ng-template>", styles: [":host{height:inherit;display:block}.main-area-container{display:grid;height:inherit}.list-container{height:100%}.inline-container{height:inherit;display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr}.inline-container.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}.inline-container .header-area{grid-column:2/3;grid-row:1/2}.inline-container .smart-filter-area{grid-column:1/2;grid-row:1/3}.inline-container .list-container{grid-column:2/3;grid-row:2/3}::ng-deep .pep-top-bar-container:not(.inline){margin-inline:var(--pep-spacing-xs, .25rem)}.noDataFoundMsg{margin:1rem 0;height:calc(100% - 2rem);width:100%;background:rgba(26,26,26,.12);display:flex;justify-content:center;align-items:center}.bread-crumbs{padding:var(--pep-spacing-lg, 1rem) 0 var(--pep-spacing-sm, .5rem) 0}\n"], components: [{ type: i4__namespace.PepPageLayoutComponent, selector: "pep-page-layout", inputs: ["addPadding", "showShadow"] }, { type: i5__namespace.PepTopBarComponent, selector: "pep-top-bar", inputs: ["inline", "title"], outputs: ["footerStateChange"] }, { type: i6__namespace.PepListActionsComponent, selector: "pep-list-actions", inputs: ["actions", "sizeType", "xPosition", "hidden"], outputs: ["actionClick", "stateChange", "menuClick"] }, { type: i6__namespace.PepListTotalComponent, selector: "pep-list-total", inputs: ["totalRows", "totalAmount", "isMapView", "sizeType"] }, { type: i7__namespace.PepSearchComponent, selector: "pep-search", inputs: ["triggerOn", "autoCompleteTop", "sizeType", "autoCompleteValues", "shrink", "value", "searchControl", "useAsWebComponent"], outputs: ["search", "autocompleteChange", "stateChange"] }, { type: i8__namespace.PepSideBarComponent, selector: "pep-side-bar", inputs: ["ignoreResize", "showHeader", "showFooter", "useAsWebComponent"], outputs: ["stateChange"] }, { type: i9__namespace.PepSmartFiltersComponent, selector: "pep-smart-filters", inputs: ["title", "filters", "fields", "useAsWebComponent"], outputs: ["filtersChange", "fieldToggleChange"] }, { type: i10__namespace.PepBreadCrumbsComponent, selector: "pep-bread-crumbs", inputs: ["addSpacing", "items", "displayType"], outputs: ["itemClick"] }], directives: [{ type: i11__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i11__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    GenericListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: GenericListComponent, deps: [{ token: i0__namespace.ComponentFactoryResolver }, { token: i1__namespace$1.PepDataConvertorService }, { token: i1__namespace$1.PepLayoutService }, { token: i1__namespace$1.PepLoaderService }, { token: PepGenericListService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    GenericListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: GenericListComponent, selector: "pep-generic-list", inputs: { dataSource: "dataSource", actions: "actions", uuidMapping: "uuidMapping", disabled: "disabled", addPadding: "addPadding", title: "title", description: "description", inline: "inline", showSearch: "showSearch", noDataFoundMsg: "noDataFoundMsg", selectionType: "selectionType", supportSorting: "supportSorting", pager: "pager", tableViewType: "tableViewType", zebraStripes: "zebraStripes", smartFilter: "smartFilter", showTopBar: "showTopBar", breadCrumbsItems: "breadCrumbsItems" }, outputs: { fieldClick: "fieldClick", valueChange: "valueChange", breadCrumbItemClick: "breadCrumbItemClick" }, providers: [PepGenericListService], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true }, { propertyName: "pepListContainer", first: true, predicate: ["pepListContainer"], descendants: true, read: i0.ViewContainerRef }], ngImport: i0__namespace, template: "<div *ngIf=\"inline\" class=\"inline-container\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"header-area\" >\n        <div *ngIf=\"showTopBar\" class=\"inline-top-bar-container\">\n            <ng-container *ngTemplateOutlet=\"topBarTemplate\"></ng-container>\n        </div>\n        <ng-container *ngIf=\"description\">\n            <div class=\"list-description\">{{description}}</div>\n        </ng-container>\n        <ng-container *ngIf=\"breadCrumbsItems.length\">\n            <ng-container *ngTemplateOutlet=\"breadCrumbsTemplate\"></ng-container>\n        </ng-container>\n    </div>\n    <ng-container *ngIf=\"showSmartFilter\">\n        <ng-container *ngTemplateOutlet=\"smartFilterTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n</div>\n<pep-page-layout *ngIf=\"!inline\" class=\"none-inline\" [addPadding]=\"addPadding\" [showShadow]=\"showSmartFilter\">\n    <ng-container *ngIf=\"showSmartFilter\" pep-side-area>\n        <ng-container *ngTemplateOutlet=\"smartFilterTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"showTopBar\" pep-top-area>\n        <ng-container *ngTemplateOutlet=\"topBarTemplate\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"description\" pep-top-area>\n        <div class=\"list-description\">{{description}}</div>\n    </ng-container>\n    <ng-container *ngIf=\"breadCrumbsItems.length\" pep-top-area>\n        <ng-container *ngTemplateOutlet=\"breadCrumbsTemplate\"></ng-container>\n    </ng-container>\n    <div pep-main-area class=\"main-area-container\">\n        <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n    </div>\n</pep-page-layout>\n\n<ng-template #topBarTemplate>\n    <pep-top-bar [title]=\"title\" [inline]=\"inline\">\n        <div header-start-content>\n            <ng-content select=\"[left-buttons]\"></ng-content>\n        </div>\n        <div header-end-content>\n            <ng-content select=\"[right-buttons]\"></ng-content>\n        </div>\n        <!-- <div footer-start-content>\n            <ng-content select=\"[left-bottom-area]\"></ng-content>               \n        </div>\n        <div footer-end-content>\n            <ng-content select=\"[right-bottom-area]\"></ng-content>     \n        </div> -->\n        <pep-list-actions *ngIf=\"menuActions.length > 0\" [sizeType]=\"inline ? 'sm' : 'md'\" [actions]=\"menuActions\"\n            (actionClick)=\"onActionItemClicked($event)\"></pep-list-actions>\n        <pep-list-total [sizeType]=\"inline ? 'sm' : 'md'\" [totalRows]=\"totalRowCount\">\n        </pep-list-total>\n        <pep-search #search *ngIf=\"showSearch\" [value]=\"searchString\" [sizeType]=\"inline ? 'sm' : 'md'\"\n            (search)=\"onSearchChanged($event)\">\n        </pep-search>\n    </pep-top-bar>\n</ng-template>\n\n<ng-template #smartFilterTemplate>\n    <pep-side-bar #sideNav [ngClass]=\"{'smart-filter-area': inline}\">\n        <pep-smart-filters title=\"Test filters\" [fields]=\"internalSmartFilter.fields\"\n            [filters]=\"internalSmartFilter.data\" (filtersChange)=\"onFiltersChange($event)\">\n        </pep-smart-filters>\n    </pep-side-bar>\n</ng-template>\n\n<ng-template #breadCrumbsTemplate>\n    <pep-bread-crumbs class=\"bread-crumbs\" [items]=\"breadCrumbsItems\" [addSpacing]=\"true\" [displayType]=\"'items'\"\n        (itemClick)=\"onBreadCrumbItemClick($event)\"></pep-bread-crumbs>\n</ng-template>\n\n<ng-template #listTemplate>\n    <div class=\"list-container\">\n        <ng-container #pepListContainer></ng-container>\n    </div>\n</ng-template>", styles: [":host{height:inherit;display:block}.main-area-container{display:grid;height:inherit}.list-container{height:100%}.inline-container{height:inherit;display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr}.inline-container.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}.inline-container .header-area{grid-column:2/3;grid-row:1/2}.inline-container .smart-filter-area{grid-column:1/2;grid-row:1/3}.inline-container .list-container{grid-column:2/3;grid-row:2/3}.inline-container .list-description{font-size:var(--pep-font-size-xs, .75rem);max-width:640px;padding:var(--pep-spacing-sm, .5rem) 0}.inline-container .bread-crumbs{padding:var(--pep-spacing-md, .75rem) 0 var(--pep-spacing-sm, .5rem) 0}.none-inline .list-description{font-size:var(--pep-font-size-sm, .875rem);max-width:720px;padding:var(--pep-spacing-sm, .5rem) var(--pep-spacing-xs, .25rem)}.none-inline .bread-crumbs{padding:var(--pep-spacing-md, .75rem) var(--pep-spacing-xs, .25rem) var(--pep-spacing-sm, .5rem) var(--pep-spacing-xs, .25rem)}::ng-deep .pep-top-bar-container:not(.inline){margin-inline:var(--pep-spacing-xs, .25rem)}::ng-deep .pep-top-bar-container.inline{height:var(--pep-top-bar-field-height, 2.5rem)!important}.noDataFoundMsg{margin:1rem 0;height:calc(100% - 2rem);width:100%;background:hsla(0deg,0%,10%,.12);display:flex;justify-content:center;align-items:center}\n"], components: [{ type: i3__namespace.PepPageLayoutComponent, selector: "pep-page-layout", inputs: ["addPadding", "showShadow"] }, { type: i4__namespace.PepTopBarComponent, selector: "pep-top-bar", inputs: ["inline", "title"], outputs: ["footerStateChange"] }, { type: i5__namespace.PepListActionsComponent, selector: "pep-list-actions", inputs: ["actions", "sizeType", "xPosition", "hidden"], outputs: ["actionClick", "stateChange", "menuClick"] }, { type: i5__namespace.PepListTotalComponent, selector: "pep-list-total", inputs: ["totalRows", "totalAmount", "isMapView", "sizeType"] }, { type: i6__namespace.PepSearchComponent, selector: "pep-search", inputs: ["triggerOn", "autoCompleteTop", "sizeType", "autoCompleteValues", "shrink", "value", "searchControl", "useAsWebComponent"], outputs: ["search", "autocompleteChange", "stateChange"] }, { type: i7__namespace.PepSideBarComponent, selector: "pep-side-bar", inputs: ["ignoreResize", "showHeader", "showFooter", "useAsWebComponent"], outputs: ["stateChange"] }, { type: i8__namespace.PepSmartFiltersComponent, selector: "pep-smart-filters", inputs: ["title", "filters", "fields", "useAsWebComponent"], outputs: ["filtersChange", "fieldToggleChange"] }, { type: i9__namespace.PepBreadCrumbsComponent, selector: "pep-bread-crumbs", inputs: ["addSpacing", "items", "displayType"], outputs: ["itemClick"] }], directives: [{ type: i10__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: GenericListComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -894,7 +935,7 @@
                         styleUrls: ['./generic-list.component.scss'],
                         providers: [PepGenericListService]
                     }]
-            }], ctorParameters: function () { return [{ type: i0__namespace.ComponentFactoryResolver }, { type: i1__namespace$1.PepDataConvertorService }, { type: i1__namespace$1.PepLayoutService }, { type: i1__namespace.TranslateService }, { type: PepGenericListService }]; }, propDecorators: { search: [{
+            }], ctorParameters: function () { return [{ type: i0__namespace.ComponentFactoryResolver }, { type: i1__namespace$1.PepDataConvertorService }, { type: i1__namespace$1.PepLayoutService }, { type: i1__namespace$1.PepLoaderService }, { type: PepGenericListService }]; }, propDecorators: { search: [{
                     type: i0.ViewChild,
                     args: ['search']
                 }], pepListContainer: [{
@@ -912,6 +953,8 @@
                     type: i0.Input
                 }], title: [{
                     type: i0.Input
+                }], description: [{
+                    type: i0.Input
                 }], inline: [{
                     type: i0.Input
                 }], showSearch: [{
@@ -948,29 +991,31 @@
         return PepGenericListModule;
     }());
     PepGenericListModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    PepGenericListModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, declarations: [GenericListComponent], imports: [i11.CommonModule,
+    PepGenericListModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, declarations: [GenericListComponent], imports: [i10.CommonModule,
             i1.PepNgxLibModule,
-            i6.PepListModule,
+            i5.PepListModule,
             form.PepFormModule,
             menu.PepMenuModule,
-            i4.PepPageLayoutModule,
-            i5.PepTopBarModule,
-            i8.PepSideBarModule,
-            i7.PepSearchModule,
-            i10.PepBreadCrumbsModule,
-            i9.PepSmartFiltersModule], exports: [GenericListComponent] });
-    PepGenericListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, imports: [[
-                i11.CommonModule,
+            i3.PepPageLayoutModule,
+            i4.PepTopBarModule,
+            i7.PepSideBarModule,
+            i6.PepSearchModule,
+            i9.PepBreadCrumbsModule,
+            i8.PepSmartFiltersModule], exports: [GenericListComponent] });
+    PepGenericListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, providers: [
+            PepGenericListService
+        ], imports: [[
+                i10.CommonModule,
                 i1.PepNgxLibModule,
-                i6.PepListModule,
+                i5.PepListModule,
                 form.PepFormModule,
                 menu.PepMenuModule,
-                i4.PepPageLayoutModule,
-                i5.PepTopBarModule,
-                i8.PepSideBarModule,
-                i7.PepSearchModule,
-                i10.PepBreadCrumbsModule,
-                i9.PepSmartFiltersModule
+                i3.PepPageLayoutModule,
+                i4.PepTopBarModule,
+                i7.PepSideBarModule,
+                i6.PepSearchModule,
+                i9.PepBreadCrumbsModule,
+                i8.PepSmartFiltersModule
             ]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: PepGenericListModule, decorators: [{
                 type: i0.NgModule,
@@ -979,24 +1024,24 @@
                             GenericListComponent
                         ],
                         imports: [
-                            i11.CommonModule,
+                            i10.CommonModule,
                             i1.PepNgxLibModule,
-                            i6.PepListModule,
+                            i5.PepListModule,
                             form.PepFormModule,
                             menu.PepMenuModule,
-                            i4.PepPageLayoutModule,
-                            i5.PepTopBarModule,
-                            i8.PepSideBarModule,
-                            i7.PepSearchModule,
-                            i10.PepBreadCrumbsModule,
-                            i9.PepSmartFiltersModule
+                            i3.PepPageLayoutModule,
+                            i4.PepTopBarModule,
+                            i7.PepSideBarModule,
+                            i6.PepSearchModule,
+                            i9.PepBreadCrumbsModule,
+                            i8.PepSmartFiltersModule
                         ],
                         exports: [
                             GenericListComponent
-                        ] /*,
+                        ],
                         providers: [
                             PepGenericListService
-                        ] */
+                        ]
                     }]
             }] });