@wavemaker/app-ng-runtime 11.11.4-rc.6173 → 11.11.5-rc.6185

package/components/data/form/form.component.d.ts

@@ -84,6 +84,7 @@ export declare class FormComponent extends StylableComponent implements OnDestro
     filterOnDefault: Function;
     onMaxDefaultValueChange: Function;
     numberOfFields: number;
+    readonly: boolean;
     private _debouncedUpdateFieldSource;
     private operationType;
     private _isLayoutDialog;

package/components/data/list/bundles/index.umd.js

@@ -66,7 +66,9 @@
             ['statehandler', { value: 'none', ...i1.PROP_STRING }],
             ['subheading', i1.PROP_STRING],
             ['tabindex', { value: 0, ...i1.PROP_NUMBER }],
-            ['title', i1.PROP_STRING]
+            ['title', i1.PROP_STRING],
+            ['allowpagesizechange', { value: false, ...i1.PROP_BOOLEAN }],
+            ['pagesizeoptions', { value: '5,10,20,50,100', ...i1.PROP_STRING }]
         ]));
     };
 
@@ -428,7 +430,7 @@
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
         const ctx_r0 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("hidden", !ctx_r0.showNavigation || ctx_r0.onDemandLoad && ctx_r0.dataNavigator.isDisableNext || ctx_r0.dataNavigator.dataSize <= ctx_r0.pagesize || !ctx_r0.dataNavigator.dataSize && !(ctx_r0.dataNavigator.datasource == null ? null : ctx_r0.dataNavigator.datasource.pagination == null ? null : ctx_r0.dataNavigator.datasource.pagination.next));
+        i0__namespace.ɵɵproperty("hidden", !ctx_r0.showNavigation || ctx_r0.onDemandLoad && ctx_r0.dataNavigator.isDisableNext || (ctx_r0.dataNavigator == null ? null : ctx_r0.dataNavigator.dataSize) <= ctx_r0.pagesize && !ctx_r0.allowpagesizechange || !ctx_r0.dataNavigator.dataSize && !(ctx_r0.dataNavigator.datasource == null ? null : ctx_r0.dataNavigator.datasource.pagination == null ? null : ctx_r0.dataNavigator.datasource.pagination.next));
         i0__namespace.ɵɵadvance(2);
         i0__namespace.ɵɵconditional(ctx_r0.onDemandLoad ? 2 : -1);
     } }
@@ -440,6 +442,7 @@
             let resolveFn = i2.noop;
             const propsInitPromise = new Promise(res => resolveFn = res);
             super(inj, WIDGET_CONFIG, explicitContext, propsInitPromise);
+            this.allowpagesizechange = false;
             this.propsInitPromise = propsInitPromise;
             this.promiseResolverFn = resolveFn;
             i1.styler(this.nativeElement, this, i1.APPLY_STYLES_TYPE.SHELL);
@@ -547,6 +550,9 @@
                 return this.fieldDefs.findIndex((obj) => lodashEs.isEqual(obj, item));
             }
         }
+        getUpdatedPageSize() {
+            return this.updatedPageSize;
+        }
         create() {
             if (this._isDependent) {
                 this.triggerWMEvent('insert');
@@ -726,6 +732,9 @@
                 }
             }
         }
+        getActualPageSize() {
+            return this.actualPageSize || 20;
+        }
         onPropertyChange(key, nv, ov) {
             if (key === 'dataset') {
                 if (!nv && this.binddatasource && !this.datasource) {
@@ -734,6 +743,9 @@
                 this.onDataSetChange(nv);
             }
             else if (key === 'datasource') {
+                if (this.allowpagesizechange) {
+                    this.datasource.maxResults = this.pagesize || this.datasource.maxResults;
+                }
                 if (this.dataset) {
                     this.onDataSetChange(this.dataset);
                 }
@@ -767,11 +779,8 @@
                 }
             }
             else if (key === 'pagesize') {
-                this.dataNavigator.options = {
-                    maxResults: nv
-                };
-                this.dataNavigator.widget.maxResults = nv;
-                this.dataNavigator.maxResults = nv;
+                this.actualPageSize = nv; // maintain default page size to calculate pagesize options
+                this.setDefaultPageSize(nv);
             }
             else if (key === 'enablereorder') {
                 if (nv && this.$ulEle) {
@@ -784,10 +793,37 @@
                     this.$ulEle.sortable('disable');
                 }
             }
+            else if (key === 'allowpagesizechange') {
+                this.allowpagesizechange = nv;
+            }
+            else if (key === 'pagesizeoptions') {
+                this.pagesizeoptions = nv;
+                this.setDefaultPageSize(nv);
+            }
             else {
                 super.onPropertyChange(key, nv, ov);
             }
         }
+        setDefaultPageSize(nv) {
+            if (this.allowpagesizechange) {
+                const widgetState = this.statePersistence.getWidgetState(this);
+                if (lodashEs.get(widgetState, 'pagesize')) {
+                    nv = lodashEs.get(widgetState, 'pagesize');
+                    this.pagesize = nv; // updating the default pagesize to user selected pagesize
+                }
+                else if (this.pagesizeoptions) {
+                    nv = this.pagesizeoptions?.split(',').map(Number).sort((a, b) => a - b)[0];
+                    this.pagesize = nv;
+                }
+            }
+            this.updatedPageSize = nv;
+            this.dataNavigator.updatedPageSize = nv;
+            this.dataNavigator.options = {
+                maxResults: nv
+            };
+            this.dataNavigator.widget.maxResults = nv;
+            this.dataNavigator.maxResults = nv;
+        }
         onItemClick(evt, $listItem) {
             let selectCount;
             if (!$listItem.disableItem) {
@@ -1135,8 +1171,15 @@
             if (lodashEs.get(this.datasource, 'category') === 'wm.Variable' && this.getConfiguredState() !== 'none' && this._pageLoad) {
                 const widgetState = this.statePersistence.getWidgetState(this);
                 this._pageLoad = false;
-                if (lodashEs.get(widgetState, 'pagination')) {
-                    this.dataNavigator.pageChanged({ page: widgetState.pagination }, true);
+                if (this.allowpagesizechange) { // maintain updated page size in the statePersistence
+                    if (lodashEs.get(widgetState, 'pagination') || lodashEs.get(widgetState, 'pagesize')) {
+                        this.dataNavigator.pageChanged({ page: widgetState.pagination || 1, pagesize: widgetState.pagesize }, true);
+                    }
+                }
+                else {
+                    if (lodashEs.get(widgetState, 'pagination')) {
+                        this.dataNavigator.pageChanged({ page: widgetState.pagination }, true);
+                    }
                 }
                 if (lodashEs.get(widgetState, 'selectedItem')) {
                     this._selectedItemsExist = true;
@@ -1534,7 +1577,7 @@
             type: i0.Component,
             args: [{ standalone: true, imports: [i3.CommonModule, i1.WmComponentsModule, pagination.PaginationComponent, ListItemDirective], selector: 'div[wmList]', providers: [
                         i1.provideAsWidgetRef(ListComponent)
-                    ], template: "@if (title || subheading || iconclass) {\n  <div class=\"panel-heading\">\n    <h3 class=\"panel-title\">\n      <div class=\"pull-left\">\n        <i class=\"app-icon panel-icon {{iconclass}}\" aria-hidden=\"true\" [hidden]=\"!iconclass\"></i>\n      </div>\n      <div class=\"pull-left\">\n        <div class=\"heading\" [innerHTML]=\"title\"></div>\n        <div class=\"description\" [innerHTML]=\"subheading\"></div>\n      </div>\n    </h3>\n  </div>\n}\n\n@if (navigation === 'Inline' && !noDataFound) {\n  <div class=\"app-datanavigator\" [attr.aria-disabled]=\"dataNavigator.isDisablePrevious\" aria-label=\"Page navigation\">\n    <ul class=\"pager\">\n      <li class=\"previous\" [ngClass]=\"{'disabled': (dataNavigator ? dataNavigator.isDisablePrevious : true)}\">\n        <a href=\"javascript:void(0);\" (click)=\"dataNavigator.navigatePage('prev', $event)\"\n          [attr.aria-disabled]=\"dataNavigator.isDisablePrevious\">\n          <i class=\"wi wi-chevron-left\" aria-hidden=\"true\"></i>\n          <span class=\"sr-only\">Go to Previous page {{dataNavigator.isDisablePrevious ? ', Disabled' : ''}}</span>\n        </a>\n      </li>\n    </ul>\n  </div>\n}\n@if (navigation === 'Inline' && !noDataFound) {\n  <div aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\"> {{'Page ' + dataNavigator.dn.currentPage + ' of ' + dataNavigator.pageCount }}</div>\n}\n\n<div>\n  @if (enablereorder) {\n    <div id={{titleId}} class=\"sr-only\">\n      Press space bar to toggle drag drop mode, use arrow keys to move selected elements.\n    </div>\n  }\n\n  @if (listItems && enablereorder && currentIndex) {\n    <div aria-live=\"assertive\" class=\"sr-only\" >\n      {{ariaText + currentIndex + ' of ' +  listItems.length}}\n    </div>\n  }\n</div>\n\n<ul [attr.tabindex]=\"tabindex\"  class=\"app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n  (keydown.enter)=\"handleKeyDown($event, 'select')\"\n\n  (keydown.space)=\"handleKeyDown($event, 'space')\"\n\n  (keydown.arrowup)=\"handleKeyDown($event, 'focusPrev')\"\n  (keydown.arrowdown)=\"handleKeyDown($event, 'focusNext')\"\n  (keydown.arrowleft)=\"handleKeyDown($event, 'focusPrev')\"\n  (keydown.arrowright)=\"handleKeyDown($event, 'focusNext')\"\n\n  (keydown.shift.arrowup)=\"handleKeyDown($event, 'selectPrev')\"\n  (keydown.shift.arrowdown)=\"handleKeyDown($event, 'selectNext')\"\n  (keydown.shift.arrowleft)=\"handleKeyDown($event, 'selectPrev')\"\n  (keydown.shift.arrowright)=\"handleKeyDown($event, 'selectNext')\"\n  [hidden]=\"noDataFound && !variableInflight\"\n  >\n  @if (!groupby) {\n    @for (item of fieldDefs; track item) {\n      <li class=\"app-list-item {{direction === 'horizontal' ? '' : itemsPerRowClass}}\" [ngClass]=\"listItemRef.itemClass\"\n        [wmListItem]=\"item\"\n        #listItemRef=\"listItemRef\"\n        [attr.tabindex]=\"tabindex\"\n        role=\"listitem\">\n        <ng-container [ngTemplateOutlet]=\"listTemplate\"\n          [ngTemplateOutletInjector]=\"createCustomInjector('falt_' + listItemRef.trackId, {item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n        [ngTemplateOutletContext]=\"{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}\"></ng-container>\n      </li>\n    }\n  } @else {\n    @for (groupObj of groupedData; track groupObj; let groupIndex = $index) {\n      <li class=\"app-list-item-group clearfix\">\n        <ul [attr.tabindex]=\"tabindex\" class=\"list-group item-group\" [ngClass]=\"listclass\">\n          <li class=\"app-list-item-header list-item list-group-header\" (click)=\"handleHeaderClick($event)\" [ngClass]=\"{'collapsible-content': collapsible}\">\n            <h4>{{groupObj.key}}\n              <div class=\"header-action\">\n                @if (collapsible) {\n                  <i class=\"app-icon wi action wi-chevron-up\"></i>\n                }\n                @if (showcount) {\n                  <span class=\"label label-default\">{{groupObj.data.length}}</span>\n                }\n              </div>\n            </h4>\n          </li>\n          <li class=\"list-group-container\">\n            <ul class=\"list-group clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}}\">\n              @for (item of groupObj.data; track trackByFn($index, item)) {\n                <li [attr.tabindex]=\"tabindex\"\n                  class=\"app-list-item group-list-item {{itemsPerRowClass}}\"\n                  [ngClass]=\"listItemRef.itemClass\"\n                  [wmListItem]=\"item\" #listItemRef=\"listItemRef\">\n                  <ng-container [ngTemplateOutlet]=\"listTemplate\"\n                    [ngTemplateOutletInjector]=\"createCustomInjector('group_' + listItemRef.trackId, {item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n                  [ngTemplateOutletContext]=\"{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}\"></ng-container>\n                </li>\n              }\n            </ul>\n          </li>\n        </ul>\n      </li>\n    }\n  }\n  <ng-container [ngTemplateOutlet]=\"listLeftActionTemplate\"></ng-container>\n  <ng-container [ngTemplateOutlet]=\"listRightActionTemplate\"></ng-container>\n</ul>\n\n@if (noDataFound && !variableInflight) {\n  <div class=\"no-data-msg\" [textContent]=\"nodatamessage\"></div>\n}\n\n@if (variableInflight && !pulltorefresh) {\n  <div class=\"loading-data-msg\">\n    <span>\n      <i class=\"app-icon panel-icon fa-spin\" aria-hidden=\"true\" [ngClass]=\"loadingicon\"></i>\n      <span class=\"sr-only\">Loading</span>\n      <span class=\"loading-text\" [textContent]=\"loadingdatamsg\"></span>\n    </span>\n  </div>\n}\n\n@if (navigation === 'Inline' && !noDataFound) {\n  <div class=\"app-datanavigator\" [attr.aria-disabled]=\"dataNavigator.isDisableNext\">\n    <ul class=\"pager\">\n      <li class=\"next\" [ngClass]=\"{'disabled': (dataNavigator ? dataNavigator.isDisableNext  : true)}\">\n        <a href=\"javascript:void(0);\" (click)=\"dataNavigator.navigatePage('next', $event)\"\n          [attr.aria-disabled]=\"dataNavigator.isDisableNext\">\n          <i class=\"wi wi-chevron-right\" aria-hidden=\"true\"></i>\n          <span class=\"sr-only\">Go to Next page {{dataNavigator.isDisableNext ? ', Disabled' : ''}}</span>\n        </a>\n      </li>\n    </ul>\n  </div>\n}\n\n@if (navigation !== 'None') {\n  <div class=\"panel-footer\" [hidden]=\"!showNavigation || (onDemandLoad && dataNavigator.isDisableNext) || (dataNavigator.dataSize <= pagesize) || (!dataNavigator.dataSize && !dataNavigator.datasource?.pagination?.next)\">\n    <nav wmPagination\n      navigationalign.bind=\"navigationalign\"\n      navigation.bind=\"navControls\"\n      showrecordcount.bind=\"showrecordcount\"\n      maxsize.bind=\"maxsize\"\n      boundarylinks.bind=\"boundarylinks\"\n      forceellipses.bind=\"forceellipses\"\n      directionlinks.bind=\"directionlinks\"\n      show.bind=\"!onDemandLoad\"\n      paginationchange.event=\"beforePaginationChange($event, $index)\"\n    ></nav>\n    @if (onDemandLoad) {\n      <a href=\"javascript:void(0);\"\n        (click)=\"dataNavigator.navigatePage('next', $event)\"\n        class=\"app-button btn btn-block\"\n        [ngClass]=\"paginationclass\"\n        [textContent]=\"ondemandmessage\"\n      ></a>\n    }\n  </div>\n}\n\n<!--This template will be displayed when groupby is specified-->\n" }]
+                    ], template: "@if (title || subheading || iconclass) {\n  <div class=\"panel-heading\">\n    <h3 class=\"panel-title\">\n      <div class=\"pull-left\">\n        <i class=\"app-icon panel-icon {{iconclass}}\" aria-hidden=\"true\" [hidden]=\"!iconclass\"></i>\n      </div>\n      <div class=\"pull-left\">\n        <div class=\"heading\" [innerHTML]=\"title\"></div>\n        <div class=\"description\" [innerHTML]=\"subheading\"></div>\n      </div>\n    </h3>\n  </div>\n}\n\n@if (navigation === 'Inline' && !noDataFound) {\n  <div class=\"app-datanavigator\" [attr.aria-disabled]=\"dataNavigator.isDisablePrevious\" aria-label=\"Page navigation\">\n    <ul class=\"pager\">\n      <li class=\"previous\" [ngClass]=\"{'disabled': (dataNavigator ? dataNavigator.isDisablePrevious : true)}\">\n        <a href=\"javascript:void(0);\" (click)=\"dataNavigator.navigatePage('prev', $event)\"\n          [attr.aria-disabled]=\"dataNavigator.isDisablePrevious\">\n          <i class=\"wi wi-chevron-left\" aria-hidden=\"true\"></i>\n          <span class=\"sr-only\">Go to Previous page {{dataNavigator.isDisablePrevious ? ', Disabled' : ''}}</span>\n        </a>\n      </li>\n    </ul>\n  </div>\n}\n@if (navigation === 'Inline' && !noDataFound) {\n  <div aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\"> {{'Page ' + dataNavigator.dn.currentPage + ' of ' + dataNavigator.pageCount }}</div>\n}\n\n<div>\n  @if (enablereorder) {\n    <div id={{titleId}} class=\"sr-only\">\n      Press space bar to toggle drag drop mode, use arrow keys to move selected elements.\n    </div>\n  }\n\n  @if (listItems && enablereorder && currentIndex) {\n    <div aria-live=\"assertive\" class=\"sr-only\" >\n      {{ariaText + currentIndex + ' of ' +  listItems.length}}\n    </div>\n  }\n</div>\n\n<ul [attr.tabindex]=\"tabindex\"  class=\"app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n  (keydown.enter)=\"handleKeyDown($event, 'select')\"\n\n  (keydown.space)=\"handleKeyDown($event, 'space')\"\n\n  (keydown.arrowup)=\"handleKeyDown($event, 'focusPrev')\"\n  (keydown.arrowdown)=\"handleKeyDown($event, 'focusNext')\"\n  (keydown.arrowleft)=\"handleKeyDown($event, 'focusPrev')\"\n  (keydown.arrowright)=\"handleKeyDown($event, 'focusNext')\"\n\n  (keydown.shift.arrowup)=\"handleKeyDown($event, 'selectPrev')\"\n  (keydown.shift.arrowdown)=\"handleKeyDown($event, 'selectNext')\"\n  (keydown.shift.arrowleft)=\"handleKeyDown($event, 'selectPrev')\"\n  (keydown.shift.arrowright)=\"handleKeyDown($event, 'selectNext')\"\n  [hidden]=\"noDataFound && !variableInflight\"\n  >\n  @if (!groupby) {\n    @for (item of fieldDefs; track item) {\n      <li class=\"app-list-item {{direction === 'horizontal' ? '' : itemsPerRowClass}}\" [ngClass]=\"listItemRef.itemClass\"\n        [wmListItem]=\"item\"\n        #listItemRef=\"listItemRef\"\n        [attr.tabindex]=\"tabindex\"\n        role=\"listitem\">\n        <ng-container [ngTemplateOutlet]=\"listTemplate\"\n          [ngTemplateOutletInjector]=\"createCustomInjector('falt_' + listItemRef.trackId, {item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n        [ngTemplateOutletContext]=\"{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}\"></ng-container>\n      </li>\n    }\n  } @else {\n    @for (groupObj of groupedData; track groupObj; let groupIndex = $index) {\n      <li class=\"app-list-item-group clearfix\">\n        <ul [attr.tabindex]=\"tabindex\" class=\"list-group item-group\" [ngClass]=\"listclass\">\n          <li class=\"app-list-item-header list-item list-group-header\" (click)=\"handleHeaderClick($event)\" [ngClass]=\"{'collapsible-content': collapsible}\">\n            <h4>{{groupObj.key}}\n              <div class=\"header-action\">\n                @if (collapsible) {\n                  <i class=\"app-icon wi action wi-chevron-up\"></i>\n                }\n                @if (showcount) {\n                  <span class=\"label label-default\">{{groupObj.data.length}}</span>\n                }\n              </div>\n            </h4>\n          </li>\n          <li class=\"list-group-container\">\n            <ul class=\"list-group clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}}\">\n              @for (item of groupObj.data; track trackByFn($index, item)) {\n                <li [attr.tabindex]=\"tabindex\"\n                  class=\"app-list-item group-list-item {{itemsPerRowClass}}\"\n                  [ngClass]=\"listItemRef.itemClass\"\n                  [wmListItem]=\"item\" #listItemRef=\"listItemRef\">\n                  <ng-container [ngTemplateOutlet]=\"listTemplate\"\n                    [ngTemplateOutletInjector]=\"createCustomInjector('group_' + listItemRef.trackId, {item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n                  [ngTemplateOutletContext]=\"{item: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets}\"></ng-container>\n                </li>\n              }\n            </ul>\n          </li>\n        </ul>\n      </li>\n    }\n  }\n  <ng-container [ngTemplateOutlet]=\"listLeftActionTemplate\"></ng-container>\n  <ng-container [ngTemplateOutlet]=\"listRightActionTemplate\"></ng-container>\n</ul>\n\n@if (noDataFound && !variableInflight) {\n  <div class=\"no-data-msg\" [textContent]=\"nodatamessage\"></div>\n}\n\n@if (variableInflight && !pulltorefresh) {\n  <div class=\"loading-data-msg\">\n    <span>\n      <i class=\"app-icon panel-icon fa-spin\" aria-hidden=\"true\" [ngClass]=\"loadingicon\"></i>\n      <span class=\"sr-only\">Loading</span>\n      <span class=\"loading-text\" [textContent]=\"loadingdatamsg\"></span>\n    </span>\n  </div>\n}\n\n@if (navigation === 'Inline' && !noDataFound) {\n  <div class=\"app-datanavigator\" [attr.aria-disabled]=\"dataNavigator.isDisableNext\">\n    <ul class=\"pager\">\n      <li class=\"next\" [ngClass]=\"{'disabled': (dataNavigator ? dataNavigator.isDisableNext  : true)}\">\n        <a href=\"javascript:void(0);\" (click)=\"dataNavigator.navigatePage('next', $event)\"\n          [attr.aria-disabled]=\"dataNavigator.isDisableNext\">\n          <i class=\"wi wi-chevron-right\" aria-hidden=\"true\"></i>\n          <span class=\"sr-only\">Go to Next page {{dataNavigator.isDisableNext ? ', Disabled' : ''}}</span>\n        </a>\n      </li>\n    </ul>\n  </div>\n}\n\n@if (navigation !== 'None') {\n  <div class=\"panel-footer\" [hidden]=\"!showNavigation || (onDemandLoad && dataNavigator.isDisableNext) || (dataNavigator?.dataSize <= pagesize && !allowpagesizechange) || (!dataNavigator.dataSize && !dataNavigator.datasource?.pagination?.next)\">\n    <nav wmPagination\n      navigationalign.bind=\"navigationalign\"\n      navigation.bind=\"navControls\"\n      showrecordcount.bind=\"showrecordcount\"\n      maxsize.bind=\"maxsize\"\n      boundarylinks.bind=\"boundarylinks\"\n      forceellipses.bind=\"forceellipses\"\n      directionlinks.bind=\"directionlinks\"\n      show.bind=\"!onDemandLoad\"\n      paginationchange.event=\"beforePaginationChange($event, $index)\"\n    ></nav>\n    @if (onDemandLoad) {\n      <a href=\"javascript:void(0);\"\n        (click)=\"dataNavigator.navigatePage('next', $event)\"\n        class=\"app-button btn btn-block\"\n        [ngClass]=\"paginationclass\"\n        [textContent]=\"ondemandmessage\"\n      ></a>\n    }\n  </div>\n}\n\n<!--This template will be displayed when groupby is specified-->\n" }]
         }], () => [{ type: i0__namespace.Injector }, { type: i0__namespace.ChangeDetectorRef }, { type: i1__namespace.ToDatePipe }, { type: i2__namespace.App }, { type: i2__namespace.AppDefaults }, { type: i0__namespace.NgZone }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['itemclass.bind']