@wavemaker-ai/app-ng-runtime 1.0.0-rc.314 → 1.0.0-rc.319

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (106) hide show
  1. package/build-task/bundles/index.umd.js +16 -7
  2. package/build-task/fesm2022/index.mjs +16 -7
  3. package/build-task/fesm2022/index.mjs.map +1 -1
  4. package/components/base/bundles/index.umd.js +301 -4
  5. package/components/base/fesm2022/index.mjs +300 -4
  6. package/components/base/fesm2022/index.mjs.map +1 -1
  7. package/components/base/index.d.ts +106 -2
  8. package/components/basic/anchor/bundles/index.umd.js +4 -5
  9. package/components/basic/anchor/fesm2022/index.mjs +4 -5
  10. package/components/basic/anchor/fesm2022/index.mjs.map +1 -1
  11. package/components/basic/anchor/index.d.ts +1 -0
  12. package/components/basic/icon/bundles/index.umd.js +3 -3
  13. package/components/basic/icon/fesm2022/index.mjs +4 -4
  14. package/components/basic/icon/fesm2022/index.mjs.map +1 -1
  15. package/components/basic/icon/index.d.ts +1 -0
  16. package/components/basic/search/bundles/index.umd.js +6 -3
  17. package/components/basic/search/fesm2022/index.mjs +7 -4
  18. package/components/basic/search/fesm2022/index.mjs.map +1 -1
  19. package/components/basic/search/index.d.ts +3 -0
  20. package/components/basic/spinner/bundles/index.umd.js +5 -3
  21. package/components/basic/spinner/fesm2022/index.mjs +6 -4
  22. package/components/basic/spinner/fesm2022/index.mjs.map +1 -1
  23. package/components/basic/spinner/index.d.ts +1 -0
  24. package/components/chart/bundles/index.umd.js +4 -3
  25. package/components/chart/fesm2022/index.mjs +5 -4
  26. package/components/chart/fesm2022/index.mjs.map +1 -1
  27. package/components/chart/index.d.ts +1 -0
  28. package/components/containers/accordion/bundles/index.umd.js +4 -3
  29. package/components/containers/accordion/fesm2022/index.mjs +5 -4
  30. package/components/containers/accordion/fesm2022/index.mjs.map +1 -1
  31. package/components/containers/accordion/index.d.ts +1 -0
  32. package/components/containers/panel/bundles/index.umd.js +3 -3
  33. package/components/containers/panel/fesm2022/index.mjs +4 -4
  34. package/components/containers/panel/fesm2022/index.mjs.map +1 -1
  35. package/components/containers/panel/index.d.ts +3 -0
  36. package/components/containers/tabs/bundles/index.umd.js +5 -4
  37. package/components/containers/tabs/fesm2022/index.mjs +6 -5
  38. package/components/containers/tabs/fesm2022/index.mjs.map +1 -1
  39. package/components/containers/wizard/bundles/index.umd.js +8 -6
  40. package/components/containers/wizard/fesm2022/index.mjs +9 -7
  41. package/components/containers/wizard/fesm2022/index.mjs.map +1 -1
  42. package/components/containers/wizard/index.d.ts +2 -0
  43. package/components/data/card/bundles/index.umd.js +3 -3
  44. package/components/data/card/fesm2022/index.mjs +4 -4
  45. package/components/data/card/fesm2022/index.mjs.map +1 -1
  46. package/components/data/form/bundles/index.umd.js +6 -3
  47. package/components/data/form/fesm2022/index.mjs +7 -4
  48. package/components/data/form/fesm2022/index.mjs.map +1 -1
  49. package/components/data/form/index.d.ts +2 -0
  50. package/components/data/list/bundles/index.umd.js +5 -3
  51. package/components/data/list/fesm2022/index.mjs +6 -4
  52. package/components/data/list/fesm2022/index.mjs.map +1 -1
  53. package/components/data/list/index.d.ts +2 -0
  54. package/components/data/table/bundles/index.umd.js +4 -3
  55. package/components/data/table/fesm2022/index.mjs +5 -4
  56. package/components/data/table/fesm2022/index.mjs.map +1 -1
  57. package/components/data/table/index.d.ts +1 -0
  58. package/components/dialogs/default/bundles/index.umd.js +2 -2
  59. package/components/dialogs/default/fesm2022/index.mjs +3 -3
  60. package/components/dialogs/default/fesm2022/index.mjs.map +1 -1
  61. package/components/input/button/bundles/index.umd.js +4 -5
  62. package/components/input/button/fesm2022/index.mjs +4 -5
  63. package/components/input/button/fesm2022/index.mjs.map +1 -1
  64. package/components/input/button/index.d.ts +3 -0
  65. package/components/input/checkbox/bundles/index.umd.js +6 -4
  66. package/components/input/checkbox/fesm2022/index.mjs +7 -5
  67. package/components/input/checkbox/fesm2022/index.mjs.map +1 -1
  68. package/components/input/checkbox/index.d.ts +2 -0
  69. package/components/input/file-upload/bundles/index.umd.js +5 -3
  70. package/components/input/file-upload/fesm2022/index.mjs +6 -4
  71. package/components/input/file-upload/fesm2022/index.mjs.map +1 -1
  72. package/components/input/file-upload/index.d.ts +3 -0
  73. package/components/input/rating/bundles/index.umd.js +9 -3
  74. package/components/input/rating/fesm2022/index.mjs +10 -4
  75. package/components/input/rating/fesm2022/index.mjs.map +1 -1
  76. package/components/input/rating/index.d.ts +6 -0
  77. package/components/input/slider/bundles/index.umd.js +5 -3
  78. package/components/input/slider/fesm2022/index.mjs +6 -4
  79. package/components/input/slider/fesm2022/index.mjs.map +1 -1
  80. package/components/input/slider/index.d.ts +2 -0
  81. package/components/input/switch/bundles/index.umd.js +6 -3
  82. package/components/input/switch/fesm2022/index.mjs +7 -4
  83. package/components/input/switch/fesm2022/index.mjs.map +1 -1
  84. package/components/input/switch/index.d.ts +2 -0
  85. package/components/input/text/bundles/index.umd.js +7 -5
  86. package/components/input/text/fesm2022/index.mjs +8 -6
  87. package/components/input/text/fesm2022/index.mjs.map +1 -1
  88. package/components/input/text/index.d.ts +2 -0
  89. package/components/navigation/menu/bundles/index.umd.js +4 -3
  90. package/components/navigation/menu/fesm2022/index.mjs +5 -4
  91. package/components/navigation/menu/fesm2022/index.mjs.map +1 -1
  92. package/components/navigation/menu/index.d.ts +1 -0
  93. package/components/navigation/navbar/bundles/index.umd.js +5 -5
  94. package/components/navigation/navbar/fesm2022/index.mjs +5 -5
  95. package/components/navigation/navbar/fesm2022/index.mjs.map +1 -1
  96. package/components/navigation/navbar/index.d.ts +1 -0
  97. package/npm-shrinkwrap.json +2 -2
  98. package/package-lock.json +2 -2
  99. package/package.json +1 -1
  100. package/runtime/base/bundles/index.umd.js +23 -1
  101. package/runtime/base/fesm2022/index.mjs +23 -1
  102. package/runtime/base/fesm2022/index.mjs.map +1 -1
  103. package/runtime/base/index.d.ts +5 -0
  104. package/transpiler/bundles/index.umd.js +2 -0
  105. package/transpiler/fesm2022/index.mjs +2 -0
  106. package/transpiler/fesm2022/index.mjs.map +1 -1
@@ -32,6 +32,8 @@ declare class FormComponent extends StylableComponent implements OnDestroy, Afte
32
32
  autoupdate: any;
33
33
  formlayout: any;
34
34
  isDataSourceUpdated: boolean;
35
+ iconclass: string;
36
+ iconurl: string;
35
37
  captionAlignClass: string;
36
38
  validationtype: string;
37
39
  captionalign: string;
@@ -41,12 +41,14 @@
41
41
  ['forceellipses', { value: true, ...i1.PROP_BOOLEAN }],
42
42
  ['groupby', i1.PROP_STRING],
43
43
  ['iconclass', i1.PROP_STRING],
44
+ ['iconurl', i1.PROP_STRING],
44
45
  ['itemclass', { value: '', ...i1.PROP_STRING }],
45
46
  ['itemsperrow', i1.PROP_STRING],
46
47
  ['listclass', { value: 'list-group', ...i1.PROP_STRING }],
47
48
  ['multiselect', i1.PROP_BOOLEAN],
48
49
  ['loadingdatamsg', { value: 'Loading...', ...i1.PROP_STRING }],
49
50
  ['loadingicon', { value: 'fa fa-circle-o-notch', ...i1.PROP_STRING }],
51
+ ['loadingiconurl', i1.PROP_STRING],
50
52
  ['match', i1.PROP_STRING],
51
53
  ['maxsize', { value: 5, ...i1.PROP_NUMBER }],
52
54
  ['name', i1.PROP_STRING],
@@ -1547,7 +1549,7 @@
1547
1549
  static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: ListComponent, deps: [{ token: i0__namespace.Injector }, { token: i0__namespace.ChangeDetectorRef }, { token: i1__namespace.ToDatePipe }, { token: i2__namespace.App }, { token: i2__namespace.AppDefaults }, { token: i0__namespace.NgZone }, { token: 'itemclass.bind', attribute: true }, { token: 'disableitem.bind', attribute: true }, { token: 'dataset.bind', attribute: true }, { token: 'datasource.bind', attribute: true }, { token: 'mouseenter.event', attribute: true }, { token: 'mouseleave.event', attribute: true }, { token: i2__namespace.StatePersistence }, { token: i2__namespace.PaginationService }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
1548
1550
  static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ListComponent, isStandalone: true, selector: "div[wmList]", providers: [
1549
1551
  i1.provideAsWidgetRef(ListComponent)
1550
- ], queries: [{ propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "listLeftActionTemplate", first: true, predicate: ["listLeftActionTemplate"], descendants: true }, { propertyName: "listRightActionTemplate", first: true, predicate: ["listRightActionTemplate"], descendants: true }, { propertyName: "btnComponents", predicate: button.ButtonComponent }], viewQueries: [{ propertyName: "dataNavigator", first: true, predicate: pagination.PaginationComponent, descendants: true }, { propertyName: "listItems", predicate: exports.ListItemDirective, descendants: true }], usesInheritance: true, ngImport: i0__namespace, 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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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", dependencies: [{ kind: "ngmodule", type: i3.CommonModule }, { kind: "directive", type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: pagination.PaginationComponent, selector: "[wmPagination]", outputs: ["resultEmitter", "maxResultsEmitter"] }, { kind: "directive", type: exports.ListItemDirective, selector: "[wmListItem]", inputs: ["wmListItem"], exportAs: ["listItemRef"] }] }); }
1552
+ ], queries: [{ propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "listLeftActionTemplate", first: true, predicate: ["listLeftActionTemplate"], descendants: true }, { propertyName: "listRightActionTemplate", first: true, predicate: ["listRightActionTemplate"], descendants: true }, { propertyName: "btnComponents", predicate: button.ButtonComponent }], viewQueries: [{ propertyName: "dataNavigator", first: true, predicate: pagination.PaginationComponent, descendants: true }, { propertyName: "listItems", predicate: exports.ListItemDirective, descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "@if (title || subheading || iconclass || iconurl) {\n <div class=\"panel-heading\">\n <h3 class=\"panel-title\">\n <div class=\"pull-left\">\n <wm-app-icon [iconclass]=\"iconclass\" [iconurl]=\"iconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"List icon\"></wm-app-icon>\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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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 <wm-app-icon [iconclass]=\"loadingicon\" [iconurl]=\"loadingiconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"loading icon\"></wm-app-icon>\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", dependencies: [{ kind: "ngmodule", type: i3.CommonModule }, { kind: "directive", type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: pagination.PaginationComponent, selector: "[wmPagination]", outputs: ["resultEmitter", "maxResultsEmitter"] }, { kind: "directive", type: exports.ListItemDirective, selector: "[wmListItem]", inputs: ["wmListItem"], exportAs: ["listItemRef"] }, { kind: "component", type: i1.WmAppIconComponent, selector: "wm-app-icon", inputs: ["iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
1551
1553
  };
1552
1554
  exports.ListComponent = tslib.__decorate([
1553
1555
  i1.AutoLayout({ targetSelector: 'ul' }),
@@ -1561,9 +1563,9 @@
1561
1563
  ], exports.ListComponent);
1562
1564
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: exports.ListComponent, decorators: [{
1563
1565
  type: i0.Component,
1564
- args: [{ standalone: true, imports: [i3.CommonModule, i1.TextContentDirective, pagination.PaginationComponent, exports.ListItemDirective], selector: 'div[wmList]', providers: [
1566
+ args: [{ standalone: true, imports: [i3.CommonModule, i1.TextContentDirective, pagination.PaginationComponent, exports.ListItemDirective, i1.WmAppIconComponent], selector: 'div[wmList]', providers: [
1565
1567
  i1.provideAsWidgetRef(exports.ListComponent)
1566
- ], 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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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" }]
1568
+ ], template: "@if (title || subheading || iconclass || iconurl) {\n <div class=\"panel-heading\">\n <h3 class=\"panel-title\">\n <div class=\"pull-left\">\n <wm-app-icon [iconclass]=\"iconclass\" [iconurl]=\"iconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"List icon\"></wm-app-icon>\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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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 <wm-app-icon [iconclass]=\"loadingicon\" [iconurl]=\"loadingiconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"loading icon\"></wm-app-icon>\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" }]
1567
1569
  }], ctorParameters: () => [{ 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: [{
1568
1570
  type: i0.Attribute,
1569
1571
  args: ['itemclass.bind']
@@ -2,7 +2,7 @@ import { __decorate, __metadata } from 'tslib';
2
2
  import * as i3 from '@angular/common';
3
3
  import { CommonModule } from '@angular/common';
4
4
  import * as i1 from '@wm/components/base';
5
- import { register, PROP_BOOLEAN, PROP_STRING, PROP_ANY, PROP_NUMBER, AUTO_LAYOUT_PROPS, StylableComponent, widgetIdGenerator, styler, APPLY_STYLES_TYPE, AutoLayout, extractDataSourceName, DEBOUNCE_TIMES, handleHeaderClick, toggleAllHeaders, NAVIGATION_TYPE, getOrderedDataset, groupData, unsupportedStatePersistenceTypes, configureDnD, TextContentDirective, provideAsWidgetRef, ToDatePipe } from '@wm/components/base';
5
+ import { register, PROP_BOOLEAN, PROP_STRING, PROP_ANY, PROP_NUMBER, AUTO_LAYOUT_PROPS, StylableComponent, widgetIdGenerator, styler, APPLY_STYLES_TYPE, AutoLayout, extractDataSourceName, DEBOUNCE_TIMES, handleHeaderClick, toggleAllHeaders, NAVIGATION_TYPE, getOrderedDataset, groupData, unsupportedStatePersistenceTypes, configureDnD, TextContentDirective, WmAppIconComponent, provideAsWidgetRef, ToDatePipe } from '@wm/components/base';
6
6
  import * as i0 from '@angular/core';
7
7
  import { inject, ViewContainerRef, Injector, ElementRef, Renderer2, Input, HostListener, HostBinding, Inject, Optional, Directive, ChangeDetectorRef, NgZone, ViewChildren, ViewChild, ContentChildren, ContentChild, Attribute, Component } from '@angular/core';
8
8
  import * as i2 from '@wm/core';
@@ -28,12 +28,14 @@ const registerProps$1 = () => {
28
28
  ['forceellipses', { value: true, ...PROP_BOOLEAN }],
29
29
  ['groupby', PROP_STRING],
30
30
  ['iconclass', PROP_STRING],
31
+ ['iconurl', PROP_STRING],
31
32
  ['itemclass', { value: '', ...PROP_STRING }],
32
33
  ['itemsperrow', PROP_STRING],
33
34
  ['listclass', { value: 'list-group', ...PROP_STRING }],
34
35
  ['multiselect', PROP_BOOLEAN],
35
36
  ['loadingdatamsg', { value: 'Loading...', ...PROP_STRING }],
36
37
  ['loadingicon', { value: 'fa fa-circle-o-notch', ...PROP_STRING }],
38
+ ['loadingiconurl', PROP_STRING],
37
39
  ['match', PROP_STRING],
38
40
  ['maxsize', { value: 5, ...PROP_NUMBER }],
39
41
  ['name', PROP_STRING],
@@ -1534,7 +1536,7 @@ let ListComponent = class ListComponent extends StylableComponent {
1534
1536
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ListComponent, deps: [{ token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1.ToDatePipe }, { token: i2.App }, { token: i2.AppDefaults }, { token: i0.NgZone }, { token: 'itemclass.bind', attribute: true }, { token: 'disableitem.bind', attribute: true }, { token: 'dataset.bind', attribute: true }, { token: 'datasource.bind', attribute: true }, { token: 'mouseenter.event', attribute: true }, { token: 'mouseleave.event', attribute: true }, { token: i2.StatePersistence }, { token: i2.PaginationService }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
1535
1537
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ListComponent, isStandalone: true, selector: "div[wmList]", providers: [
1536
1538
  provideAsWidgetRef(ListComponent)
1537
- ], queries: [{ propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "listLeftActionTemplate", first: true, predicate: ["listLeftActionTemplate"], descendants: true }, { propertyName: "listRightActionTemplate", first: true, predicate: ["listRightActionTemplate"], descendants: true }, { propertyName: "btnComponents", predicate: ButtonComponent }], viewQueries: [{ propertyName: "dataNavigator", first: true, predicate: PaginationComponent, descendants: true }, { propertyName: "listItems", predicate: ListItemDirective, descendants: true }], usesInheritance: true, ngImport: i0, 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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: PaginationComponent, selector: "[wmPagination]", outputs: ["resultEmitter", "maxResultsEmitter"] }, { kind: "directive", type: ListItemDirective, selector: "[wmListItem]", inputs: ["wmListItem"], exportAs: ["listItemRef"] }] }); }
1539
+ ], queries: [{ propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "listLeftActionTemplate", first: true, predicate: ["listLeftActionTemplate"], descendants: true }, { propertyName: "listRightActionTemplate", first: true, predicate: ["listRightActionTemplate"], descendants: true }, { propertyName: "btnComponents", predicate: ButtonComponent }], viewQueries: [{ propertyName: "dataNavigator", first: true, predicate: PaginationComponent, descendants: true }, { propertyName: "listItems", predicate: ListItemDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (title || subheading || iconclass || iconurl) {\n <div class=\"panel-heading\">\n <h3 class=\"panel-title\">\n <div class=\"pull-left\">\n <wm-app-icon [iconclass]=\"iconclass\" [iconurl]=\"iconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"List icon\"></wm-app-icon>\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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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 <wm-app-icon [iconclass]=\"loadingicon\" [iconurl]=\"loadingiconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"loading icon\"></wm-app-icon>\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", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: PaginationComponent, selector: "[wmPagination]", outputs: ["resultEmitter", "maxResultsEmitter"] }, { kind: "directive", type: ListItemDirective, selector: "[wmListItem]", inputs: ["wmListItem"], exportAs: ["listItemRef"] }, { kind: "component", type: WmAppIconComponent, selector: "wm-app-icon", inputs: ["iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
1538
1540
  };
1539
1541
  ListComponent = __decorate([
1540
1542
  AutoLayout({ targetSelector: 'ul' }),
@@ -1548,9 +1550,9 @@ ListComponent = __decorate([
1548
1550
  ], ListComponent);
1549
1551
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ListComponent, decorators: [{
1550
1552
  type: Component,
1551
- args: [{ standalone: true, imports: [CommonModule, TextContentDirective, PaginationComponent, ListItemDirective], selector: 'div[wmList]', providers: [
1553
+ args: [{ standalone: true, imports: [CommonModule, TextContentDirective, PaginationComponent, ListItemDirective, WmAppIconComponent], selector: 'div[wmList]', providers: [
1552
1554
  provideAsWidgetRef(ListComponent)
1553
- ], 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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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" }]
1555
+ ], template: "@if (title || subheading || iconclass || iconurl) {\n <div class=\"panel-heading\">\n <h3 class=\"panel-title\">\n <div class=\"pull-left\">\n <wm-app-icon [iconclass]=\"iconclass\" [iconurl]=\"iconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"List icon\"></wm-app-icon>\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=\"list-group app-livelist-container clearfix {{direction === 'horizontal' ? 'app-horizontal-list': ''}} {{listclass}}\" role=\"list\"\n [class.list-group-autolayout]=\"hasAutolayout\"\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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\" [class.list-group-autolayout]=\"hasAutolayout\">\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': ''}}\" [class.list-group-autolayout]=\"hasAutolayout\">\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, row: item, $index: $index, itemRef: listItemRef, $first: $first, $last: $last, currentItemWidgets: listItemRef.currentItemWidgets})\"\n [ngTemplateOutletContext]=\"{item: item, row: 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 <wm-app-icon [iconclass]=\"loadingicon\" [iconurl]=\"loadingiconurl\" [defaultClasses]=\"'panel-icon'\" alt=\"loading icon\"></wm-app-icon>\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" }]
1554
1556
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i1.ToDatePipe }, { type: i2.App }, { type: i2.AppDefaults }, { type: i0.NgZone }, { type: undefined, decorators: [{
1555
1557
  type: Attribute,
1556
1558
  args: ['itemclass.bind']