@acorex/components 21.0.0-next.46 → 21.0.0-next.48

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 (233) hide show
  1. package/accordion/index.d.ts +0 -1
  2. package/button-group/index.d.ts +6 -4
  3. package/chips/index.d.ts +3 -8
  4. package/data-table/index.d.ts +4 -253
  5. package/dialog/index.d.ts +1 -1
  6. package/fesm2022/acorex-components-accordion.mjs +16 -21
  7. package/fesm2022/acorex-components-accordion.mjs.map +1 -1
  8. package/fesm2022/acorex-components-action-sheet.mjs +12 -12
  9. package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
  10. package/fesm2022/acorex-components-alert.mjs +13 -13
  11. package/fesm2022/acorex-components-alert.mjs.map +1 -1
  12. package/fesm2022/acorex-components-aspect-ratio.mjs +3 -3
  13. package/fesm2022/acorex-components-aspect-ratio.mjs.map +1 -1
  14. package/fesm2022/acorex-components-audio-wave.mjs +11 -10
  15. package/fesm2022/acorex-components-audio-wave.mjs.map +1 -1
  16. package/fesm2022/acorex-components-autocomplete.mjs +7 -7
  17. package/fesm2022/acorex-components-autocomplete.mjs.map +1 -1
  18. package/fesm2022/acorex-components-avatar.mjs +12 -12
  19. package/fesm2022/acorex-components-avatar.mjs.map +1 -1
  20. package/fesm2022/acorex-components-badge.mjs +9 -9
  21. package/fesm2022/acorex-components-badge.mjs.map +1 -1
  22. package/fesm2022/acorex-components-bottom-navigation.mjs +11 -11
  23. package/fesm2022/acorex-components-bottom-navigation.mjs.map +1 -1
  24. package/fesm2022/acorex-components-breadcrumbs.mjs +11 -11
  25. package/fesm2022/acorex-components-breadcrumbs.mjs.map +1 -1
  26. package/fesm2022/acorex-components-button-group.mjs +23 -19
  27. package/fesm2022/acorex-components-button-group.mjs.map +1 -1
  28. package/fesm2022/acorex-components-button.mjs +18 -18
  29. package/fesm2022/acorex-components-button.mjs.map +1 -1
  30. package/fesm2022/acorex-components-calendar.mjs +23 -17
  31. package/fesm2022/acorex-components-calendar.mjs.map +1 -1
  32. package/fesm2022/acorex-components-check-box.mjs +10 -10
  33. package/fesm2022/acorex-components-check-box.mjs.map +1 -1
  34. package/fesm2022/acorex-components-chips.mjs +12 -14
  35. package/fesm2022/acorex-components-chips.mjs.map +1 -1
  36. package/fesm2022/acorex-components-circular-progress.mjs +12 -10
  37. package/fesm2022/acorex-components-circular-progress.mjs.map +1 -1
  38. package/fesm2022/acorex-components-code-editor.mjs +10 -10
  39. package/fesm2022/acorex-components-code-editor.mjs.map +1 -1
  40. package/fesm2022/acorex-components-collapse.mjs +13 -13
  41. package/fesm2022/acorex-components-collapse.mjs.map +1 -1
  42. package/fesm2022/acorex-components-color-box.mjs +9 -9
  43. package/fesm2022/acorex-components-color-box.mjs.map +1 -1
  44. package/fesm2022/acorex-components-color-palette.mjs +30 -30
  45. package/fesm2022/acorex-components-color-palette.mjs.map +1 -1
  46. package/fesm2022/acorex-components-command.mjs +9 -9
  47. package/fesm2022/acorex-components-command.mjs.map +1 -1
  48. package/fesm2022/acorex-components-comment.mjs +32 -32
  49. package/fesm2022/acorex-components-comment.mjs.map +1 -1
  50. package/fesm2022/acorex-components-conversation.mjs +51 -51
  51. package/fesm2022/acorex-components-conversation.mjs.map +1 -1
  52. package/fesm2022/acorex-components-conversation2.mjs +184 -184
  53. package/fesm2022/acorex-components-conversation2.mjs.map +1 -1
  54. package/fesm2022/acorex-components-cron-job.mjs +46 -46
  55. package/fesm2022/acorex-components-cron-job.mjs.map +1 -1
  56. package/fesm2022/acorex-components-data-list.mjs +3 -3
  57. package/fesm2022/acorex-components-data-list.mjs.map +1 -1
  58. package/fesm2022/acorex-components-data-pager.mjs +33 -33
  59. package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
  60. package/fesm2022/acorex-components-data-table.mjs +50 -486
  61. package/fesm2022/acorex-components-data-table.mjs.map +1 -1
  62. package/fesm2022/acorex-components-datetime-box.mjs +9 -9
  63. package/fesm2022/acorex-components-datetime-box.mjs.map +1 -1
  64. package/fesm2022/acorex-components-datetime-input.mjs +9 -9
  65. package/fesm2022/acorex-components-datetime-input.mjs.map +1 -1
  66. package/fesm2022/acorex-components-datetime-picker.mjs +9 -9
  67. package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
  68. package/fesm2022/acorex-components-decorators.mjs +43 -36
  69. package/fesm2022/acorex-components-decorators.mjs.map +1 -1
  70. package/fesm2022/acorex-components-dialog.mjs +15 -14
  71. package/fesm2022/acorex-components-dialog.mjs.map +1 -1
  72. package/fesm2022/acorex-components-drawer-legacy.mjs +13 -13
  73. package/fesm2022/acorex-components-drawer-legacy.mjs.map +1 -1
  74. package/fesm2022/acorex-components-drawer.mjs +15 -16
  75. package/fesm2022/acorex-components-drawer.mjs.map +1 -1
  76. package/fesm2022/acorex-components-dropdown-button.mjs +9 -9
  77. package/fesm2022/acorex-components-dropdown-button.mjs.map +1 -1
  78. package/fesm2022/acorex-components-dropdown.mjs +18 -16
  79. package/fesm2022/acorex-components-dropdown.mjs.map +1 -1
  80. package/fesm2022/acorex-components-editor.mjs +11 -11
  81. package/fesm2022/acorex-components-editor.mjs.map +1 -1
  82. package/fesm2022/acorex-components-file-explorer.mjs +25 -25
  83. package/fesm2022/acorex-components-file-explorer.mjs.map +1 -1
  84. package/fesm2022/acorex-components-flow-chart.mjs +16 -16
  85. package/fesm2022/acorex-components-flow-chart.mjs.map +1 -1
  86. package/fesm2022/acorex-components-form.mjs +32 -24
  87. package/fesm2022/acorex-components-form.mjs.map +1 -1
  88. package/fesm2022/acorex-components-grid-layout-builder.mjs +12 -13
  89. package/fesm2022/acorex-components-grid-layout-builder.mjs.map +1 -1
  90. package/fesm2022/acorex-components-image-editor.mjs +44 -44
  91. package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
  92. package/fesm2022/acorex-components-image.mjs +9 -9
  93. package/fesm2022/acorex-components-image.mjs.map +1 -1
  94. package/fesm2022/acorex-components-json-viewer.mjs +8 -8
  95. package/fesm2022/acorex-components-json-viewer.mjs.map +1 -1
  96. package/fesm2022/acorex-components-kanban.mjs +8 -6
  97. package/fesm2022/acorex-components-kanban.mjs.map +1 -1
  98. package/fesm2022/acorex-components-kbd.mjs +29 -11
  99. package/fesm2022/acorex-components-kbd.mjs.map +1 -1
  100. package/fesm2022/acorex-components-label.mjs +9 -9
  101. package/fesm2022/acorex-components-label.mjs.map +1 -1
  102. package/fesm2022/acorex-components-list.mjs +9 -9
  103. package/fesm2022/acorex-components-list.mjs.map +1 -1
  104. package/fesm2022/acorex-components-loading-dialog.mjs +12 -12
  105. package/fesm2022/acorex-components-loading-dialog.mjs.map +1 -1
  106. package/fesm2022/acorex-components-loading.mjs +23 -23
  107. package/fesm2022/acorex-components-loading.mjs.map +1 -1
  108. package/fesm2022/acorex-components-map.mjs +14 -14
  109. package/fesm2022/acorex-components-map.mjs.map +1 -1
  110. package/fesm2022/acorex-components-media-viewer.mjs +41 -41
  111. package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
  112. package/fesm2022/acorex-components-menu.mjs +21 -21
  113. package/fesm2022/acorex-components-menu.mjs.map +1 -1
  114. package/fesm2022/{acorex-components-modal-acorex-components-modal-iYSPzoLn.mjs → acorex-components-modal-acorex-components-modal-WaTo81yi.mjs} +22 -22
  115. package/fesm2022/acorex-components-modal-acorex-components-modal-WaTo81yi.mjs.map +1 -0
  116. package/fesm2022/acorex-components-modal-modal-content.component-D61_wSet.mjs +214 -0
  117. package/fesm2022/acorex-components-modal-modal-content.component-D61_wSet.mjs.map +1 -0
  118. package/fesm2022/acorex-components-modal.mjs +1 -1
  119. package/fesm2022/acorex-components-navbar.mjs +9 -9
  120. package/fesm2022/acorex-components-navbar.mjs.map +1 -1
  121. package/fesm2022/acorex-components-notification.mjs +16 -23
  122. package/fesm2022/acorex-components-notification.mjs.map +1 -1
  123. package/fesm2022/acorex-components-number-box-legacy.mjs +9 -9
  124. package/fesm2022/acorex-components-number-box-legacy.mjs.map +1 -1
  125. package/fesm2022/acorex-components-number-box.mjs +9 -9
  126. package/fesm2022/acorex-components-number-box.mjs.map +1 -1
  127. package/fesm2022/acorex-components-otp.mjs +9 -9
  128. package/fesm2022/acorex-components-otp.mjs.map +1 -1
  129. package/fesm2022/acorex-components-page.mjs +10 -10
  130. package/fesm2022/acorex-components-page.mjs.map +1 -1
  131. package/fesm2022/acorex-components-paint.mjs +34 -39
  132. package/fesm2022/acorex-components-paint.mjs.map +1 -1
  133. package/fesm2022/acorex-components-password-box.mjs +13 -13
  134. package/fesm2022/acorex-components-password-box.mjs.map +1 -1
  135. package/fesm2022/acorex-components-pdf-reader.mjs +8 -8
  136. package/fesm2022/acorex-components-pdf-reader.mjs.map +1 -1
  137. package/fesm2022/acorex-components-phone-box.mjs +9 -9
  138. package/fesm2022/acorex-components-phone-box.mjs.map +1 -1
  139. package/fesm2022/acorex-components-picker.mjs +15 -15
  140. package/fesm2022/acorex-components-picker.mjs.map +1 -1
  141. package/fesm2022/acorex-components-popover.mjs +11 -11
  142. package/fesm2022/acorex-components-popover.mjs.map +1 -1
  143. package/fesm2022/acorex-components-popup.mjs +13 -13
  144. package/fesm2022/acorex-components-popup.mjs.map +1 -1
  145. package/fesm2022/acorex-components-progress-bar.mjs +11 -9
  146. package/fesm2022/acorex-components-progress-bar.mjs.map +1 -1
  147. package/fesm2022/acorex-components-qrcode.mjs +7 -7
  148. package/fesm2022/acorex-components-qrcode.mjs.map +1 -1
  149. package/fesm2022/acorex-components-query-builder.mjs +8 -8
  150. package/fesm2022/acorex-components-query-builder.mjs.map +1 -1
  151. package/fesm2022/acorex-components-radio.mjs +7 -7
  152. package/fesm2022/acorex-components-radio.mjs.map +1 -1
  153. package/fesm2022/acorex-components-rail-navigation.mjs +38 -36
  154. package/fesm2022/acorex-components-rail-navigation.mjs.map +1 -1
  155. package/fesm2022/acorex-components-range-slider.mjs +10 -10
  156. package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
  157. package/fesm2022/acorex-components-rate-picker.mjs +20 -35
  158. package/fesm2022/acorex-components-rate-picker.mjs.map +1 -1
  159. package/fesm2022/acorex-components-rest-api-generator.mjs +22 -22
  160. package/fesm2022/acorex-components-rest-api-generator.mjs.map +1 -1
  161. package/fesm2022/acorex-components-result.mjs +8 -8
  162. package/fesm2022/acorex-components-result.mjs.map +1 -1
  163. package/fesm2022/acorex-components-routing-progress.mjs +8 -8
  164. package/fesm2022/acorex-components-routing-progress.mjs.map +1 -1
  165. package/fesm2022/acorex-components-rrule.mjs +9 -9
  166. package/fesm2022/acorex-components-rrule.mjs.map +1 -1
  167. package/fesm2022/acorex-components-scheduler-picker.mjs +56 -56
  168. package/fesm2022/acorex-components-scheduler-picker.mjs.map +1 -1
  169. package/fesm2022/acorex-components-scheduler.mjs +43 -43
  170. package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
  171. package/fesm2022/acorex-components-scss.mjs +4 -4
  172. package/fesm2022/acorex-components-scss.mjs.map +1 -1
  173. package/fesm2022/acorex-components-search-box.mjs +16 -10
  174. package/fesm2022/acorex-components-search-box.mjs.map +1 -1
  175. package/fesm2022/acorex-components-select-box.mjs +11 -9
  176. package/fesm2022/acorex-components-select-box.mjs.map +1 -1
  177. package/fesm2022/acorex-components-selection-list-2.mjs +11 -11
  178. package/fesm2022/acorex-components-selection-list-2.mjs.map +1 -1
  179. package/fesm2022/acorex-components-selection-list.mjs +9 -9
  180. package/fesm2022/acorex-components-selection-list.mjs.map +1 -1
  181. package/fesm2022/acorex-components-side-menu.mjs +14 -14
  182. package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
  183. package/fesm2022/acorex-components-skeleton.mjs +8 -8
  184. package/fesm2022/acorex-components-skeleton.mjs.map +1 -1
  185. package/fesm2022/acorex-components-slider.mjs +10 -10
  186. package/fesm2022/acorex-components-slider.mjs.map +1 -1
  187. package/fesm2022/acorex-components-sliding-item.mjs +14 -14
  188. package/fesm2022/acorex-components-sliding-item.mjs.map +1 -1
  189. package/fesm2022/acorex-components-step-wizard.mjs +14 -14
  190. package/fesm2022/acorex-components-step-wizard.mjs.map +1 -1
  191. package/fesm2022/acorex-components-switch.mjs +14 -14
  192. package/fesm2022/acorex-components-switch.mjs.map +1 -1
  193. package/fesm2022/acorex-components-tabs.mjs +15 -15
  194. package/fesm2022/acorex-components-tabs.mjs.map +1 -1
  195. package/fesm2022/acorex-components-tag-box.mjs +9 -9
  196. package/fesm2022/acorex-components-tag-box.mjs.map +1 -1
  197. package/fesm2022/acorex-components-tag.mjs +9 -9
  198. package/fesm2022/acorex-components-tag.mjs.map +1 -1
  199. package/fesm2022/acorex-components-text-area.mjs +9 -9
  200. package/fesm2022/acorex-components-text-area.mjs.map +1 -1
  201. package/fesm2022/acorex-components-text-box.mjs +12 -12
  202. package/fesm2022/acorex-components-text-box.mjs.map +1 -1
  203. package/fesm2022/acorex-components-time-duration.mjs +7 -7
  204. package/fesm2022/acorex-components-time-duration.mjs.map +1 -1
  205. package/fesm2022/acorex-components-time-line.mjs +12 -12
  206. package/fesm2022/acorex-components-time-line.mjs.map +1 -1
  207. package/fesm2022/acorex-components-toast.mjs +14 -14
  208. package/fesm2022/acorex-components-toast.mjs.map +1 -1
  209. package/fesm2022/acorex-components-toolbar.mjs +8 -8
  210. package/fesm2022/acorex-components-toolbar.mjs.map +1 -1
  211. package/fesm2022/acorex-components-tooltip.mjs +11 -11
  212. package/fesm2022/acorex-components-tooltip.mjs.map +1 -1
  213. package/fesm2022/acorex-components-tree-view-legacy.mjs +10 -10
  214. package/fesm2022/acorex-components-tree-view-legacy.mjs.map +1 -1
  215. package/fesm2022/acorex-components-tree-view.mjs +11 -11
  216. package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
  217. package/fesm2022/acorex-components-uploader.mjs +16 -16
  218. package/fesm2022/acorex-components-uploader.mjs.map +1 -1
  219. package/fesm2022/acorex-components-video-player.mjs +7 -7
  220. package/fesm2022/acorex-components-video-player.mjs.map +1 -1
  221. package/fesm2022/acorex-components-wysiwyg.mjs +42 -42
  222. package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
  223. package/fesm2022/acorex-components.mjs.map +1 -1
  224. package/grid-layout-builder/index.d.ts +1 -2
  225. package/kbd/index.d.ts +13 -7
  226. package/loading/index.d.ts +1 -1
  227. package/notification/index.d.ts +0 -2
  228. package/package.json +3 -3
  229. package/paint/index.d.ts +1 -6
  230. package/rate-picker/index.d.ts +5 -15
  231. package/fesm2022/acorex-components-modal-acorex-components-modal-iYSPzoLn.mjs.map +0 -1
  232. package/fesm2022/acorex-components-modal-modal-content.component-sZWKhYM-.mjs +0 -212
  233. package/fesm2022/acorex-components-modal-modal-content.component-sZWKhYM-.mjs.map +0 -1
@@ -1,4 +1,4 @@
1
- import { MXBaseComponent, convertArrayToDataSource, AXComponent, AXRippleDirective, AXListDataSource, AXPagedComponent, AXCommonModule } from '@acorex/cdk/common';
1
+ import { MXBaseComponent, convertArrayToDataSource, AXComponent, AXRippleDirective, AXCommonModule } from '@acorex/cdk/common';
2
2
  import * as i0 from '@angular/core';
3
3
  import { EventEmitter, signal, Input, Output, Injectable, inject, ElementRef, Renderer2, NgZone, ChangeDetectorRef, DOCUMENT, PLATFORM_ID, HostListener, Directive, ViewChild, ChangeDetectionStrategy, ViewEncapsulation, Component, effect, computed, untracked, ContentChildren, ContentChild, NgModule } from '@angular/core';
4
4
  import { isEqual, cloneDeep } from 'lodash-es';
@@ -23,8 +23,7 @@ import { AXDataPagerComponent, AXDataPagerNumericSelectorComponent, AXDataPagerP
23
23
  import { AXResultModule } from '@acorex/components/result';
24
24
  import { AXSkeletonComponent, AXSkeletonModule } from '@acorex/components/skeleton';
25
25
  import { moveItemInArray, CdkDropList, CdkDrag, CdkDragPlaceholder, CdkDragHandle } from '@angular/cdk/drag-drop';
26
- import { CdkScrollable, CdkVirtualScrollableElement, CdkVirtualScrollViewport, CdkFixedSizeVirtualScroll, CdkVirtualForOf, ScrollingModule } from '@angular/cdk/scrolling';
27
- import sum from 'lodash-es/sum';
26
+ import { CdkScrollable, ScrollingModule } from '@angular/cdk/scrolling';
28
27
 
29
28
  class AXBaseDataTable extends MXBaseComponent {
30
29
  constructor() {
@@ -130,10 +129,10 @@ class AXBaseDataTable extends MXBaseComponent {
130
129
  this.selectedRows = this.selectedRows.filter((c) => !removedRowIds.includes(typeof c === 'object' ? c[key] : c));
131
130
  //this.selectedRows = this.selectedRows.filter((c) => !rows.includes(c));
132
131
  }
133
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXBaseDataTable, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
134
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXBaseDataTable }); }
132
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXBaseDataTable, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
133
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXBaseDataTable }); }
135
134
  }
136
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXBaseDataTable, decorators: [{
135
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXBaseDataTable, decorators: [{
137
136
  type: Injectable
138
137
  }], propDecorators: { dataSource: [{
139
138
  type: Input
@@ -166,10 +165,10 @@ class AXDataTableColumnComponent {
166
165
  get cssClass() {
167
166
  return null;
168
167
  }
169
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
170
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableColumnComponent }); }
168
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
169
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableColumnComponent }); }
171
170
  }
172
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableColumnComponent, decorators: [{
171
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableColumnComponent, decorators: [{
173
172
  type: Injectable
174
173
  }], propDecorators: { caption: [{
175
174
  type: Input
@@ -251,10 +250,10 @@ class AXDataTableColumnResizableDirective {
251
250
  this.cdr.reattach(); // Reattach the change detector
252
251
  }
253
252
  }
254
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableColumnResizableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
255
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.9", type: AXDataTableColumnResizableDirective, isStandalone: true, selector: "[ax-table-column-resizble]", inputs: { column: ["ax-table-column-resizble", "column"] }, host: { listeners: { "mousedown": "onMouseDown($event)" } }, ngImport: i0 }); }
253
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableColumnResizableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
254
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: AXDataTableColumnResizableDirective, isStandalone: true, selector: "[ax-table-column-resizble]", inputs: { column: ["ax-table-column-resizble", "column"] }, host: { listeners: { "mousedown": "onMouseDown($event)" } }, ngImport: i0 }); }
256
255
  }
257
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableColumnResizableDirective, decorators: [{
256
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableColumnResizableDirective, decorators: [{
258
257
  type: Directive,
259
258
  args: [{ selector: '[ax-table-column-resizble]' }]
260
259
  }], ctorParameters: () => [], propDecorators: { column: [{
@@ -340,8 +339,8 @@ class AXDataTableTextColumnComponent extends AXDataTableColumnComponent {
340
339
  const value = rowData[dataField];
341
340
  return !this.format ? value : this.formatService.format(value, this.format, this.formatOptions);
342
341
  }
343
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableTextColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
344
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXDataTableTextColumnComponent, isStandalone: true, selector: "ax-text-column", inputs: { width: "width", caption: "caption", allowSorting: "allowSorting", allowResizing: "allowResizing", fixed: "fixed", customExpandIcon: "customExpandIcon", customCollapseIcon: "customCollapseIcon", dataField: "dataField", expandHandler: "expandHandler", wrapText: "wrapText", cellTemplate: "cellTemplate", footerTemplate: "footerTemplate", headerTemplate: "headerTemplate", format: "format", formatOptions: "formatOptions" }, providers: [
342
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableTextColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
343
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AXDataTableTextColumnComponent, isStandalone: true, selector: "ax-text-column", inputs: { width: "width", caption: "caption", allowSorting: "allowSorting", allowResizing: "allowResizing", fixed: "fixed", customExpandIcon: "customExpandIcon", customCollapseIcon: "customCollapseIcon", dataField: "dataField", expandHandler: "expandHandler", wrapText: "wrapText", cellTemplate: "cellTemplate", footerTemplate: "footerTemplate", headerTemplate: "headerTemplate", format: "format", formatOptions: "formatOptions" }, providers: [
345
344
  {
346
345
  provide: AXDataTableColumnComponent,
347
346
  useExisting: AXDataTableTextColumnComponent,
@@ -350,7 +349,7 @@ class AXDataTableTextColumnComponent extends AXDataTableColumnComponent {
350
349
  ], viewQueries: [{ propertyName: "_contentCellTemplate", first: true, predicate: ["cell"], descendants: true }, { propertyName: "_contentFooterTemplate", first: true, predicate: ["footer"], descendants: true }, { propertyName: "_contentHeaderTemplate", first: true, predicate: ["header"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
351
350
  <ng-template #header>{{ caption }}</ng-template>
352
351
  <ng-template #cell let-row>
353
- <div class="ax-flex ax-items-center ax-gap-2">
352
+ <div class="flex items-center gap-2">
354
353
  @if (expandHandler) {
355
354
  <div
356
355
  (click)="handleExpandRow(row)"
@@ -359,7 +358,7 @@ class AXDataTableTextColumnComponent extends AXDataTableColumnComponent {
359
358
  [style.padding-inline-start.rem]="row.data?.__meta__?.level * 2"
360
359
  >
361
360
  @if (loadingRow() === row) {
362
- <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
361
+ <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
363
362
  } @else {
364
363
  @if (row.data?.__meta__?.expanded) {
365
364
  <i [class]="customCollapseIcon || 'fas fa-chevron-down'"></i>
@@ -381,14 +380,14 @@ __decorate([
381
380
  __metadata("design:paramtypes", [Object, String]),
382
381
  __metadata("design:returntype", String)
383
382
  ], AXDataTableTextColumnComponent.prototype, "getDisplayText", null);
384
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableTextColumnComponent, decorators: [{
383
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableTextColumnComponent, decorators: [{
385
384
  type: Component,
386
385
  args: [{
387
386
  selector: 'ax-text-column',
388
387
  template: `
389
388
  <ng-template #header>{{ caption }}</ng-template>
390
389
  <ng-template #cell let-row>
391
- <div class="ax-flex ax-items-center ax-gap-2">
390
+ <div class="flex items-center gap-2">
392
391
  @if (expandHandler) {
393
392
  <div
394
393
  (click)="handleExpandRow(row)"
@@ -397,7 +396,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
397
396
  [style.padding-inline-start.rem]="row.data?.__meta__?.level * 2"
398
397
  >
399
398
  @if (loadingRow() === row) {
400
- <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
399
+ <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
401
400
  } @else {
402
401
  @if (row.data?.__meta__?.expanded) {
403
402
  <i [class]="customCollapseIcon || 'fas fa-chevron-down'"></i>
@@ -632,8 +631,8 @@ class AXRowDropdownCommandColumnComponent extends AXBaseRowCommandColumnComponen
632
631
  };
633
632
  this.onItemClick.emit(args);
634
633
  }
635
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowDropdownCommandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
636
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXRowDropdownCommandColumnComponent, isStandalone: true, selector: "ax-dropdown-command-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", emptyStateTemplate: "emptyStateTemplate", emptyStateText: "emptyStateText", items: "items" }, outputs: { onItemClick: "onItemClick" }, providers: [
634
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowDropdownCommandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
635
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AXRowDropdownCommandColumnComponent, isStandalone: true, selector: "ax-dropdown-command-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", emptyStateTemplate: "emptyStateTemplate", emptyStateText: "emptyStateText", items: "items" }, outputs: { onItemClick: "onItemClick" }, providers: [
637
636
  {
638
637
  provide: AXDataTableColumnComponent,
639
638
  useExisting: AXRowDropdownCommandColumnComponent,
@@ -684,7 +683,7 @@ class AXRowDropdownCommandColumnComponent extends AXBaseRowCommandColumnComponen
684
683
  <ng-template #footer></ng-template>
685
684
  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
686
685
  }
687
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowDropdownCommandColumnComponent, decorators: [{
686
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowDropdownCommandColumnComponent, decorators: [{
688
687
  type: Component,
689
688
  args: [{
690
689
  selector: 'ax-dropdown-command-column',
@@ -854,8 +853,8 @@ class AXRowCommandColumnComponent extends AXBaseRowCommandColumnComponent {
854
853
  };
855
854
  this.onItemClick.emit(args);
856
855
  }
857
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowCommandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
858
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXRowCommandColumnComponent, isStandalone: true, selector: "ax-command-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", items: "items" }, outputs: { onItemClick: "onItemClick" }, providers: [
856
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowCommandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
857
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AXRowCommandColumnComponent, isStandalone: true, selector: "ax-command-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", items: "items" }, outputs: { onItemClick: "onItemClick" }, providers: [
859
858
  {
860
859
  provide: AXDataTableColumnComponent,
861
860
  useExisting: AXRowCommandColumnComponent,
@@ -872,7 +871,7 @@ class AXRowCommandColumnComponent extends AXBaseRowCommandColumnComponent {
872
871
  [disabled]="command.item.disabled || commandLoading()"
873
872
  [class.ax-state-disabled]="command.item.disabled"
874
873
  [axRipple]="!command.item.disabled"
875
- [look]="command.item.look ?? 'solid'"
874
+ [look]="command.item.look ?? 'blank'"
876
875
  (onClick)="handleOnItemClick($event, command.item, row.data)"
877
876
  >
878
877
  <ax-icon [icon]="command.item.icon"></ax-icon>
@@ -885,7 +884,7 @@ class AXRowCommandColumnComponent extends AXBaseRowCommandColumnComponent {
885
884
  </ng-template>
886
885
  <ng-template #footer></ng-template> `, isInline: true, dependencies: [{ kind: "directive", type: AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
887
886
  }
888
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowCommandColumnComponent, decorators: [{
887
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowCommandColumnComponent, decorators: [{
889
888
  type: Component,
890
889
  args: [{
891
890
  selector: 'ax-command-column',
@@ -901,7 +900,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
901
900
  [disabled]="command.item.disabled || commandLoading()"
902
901
  [class.ax-state-disabled]="command.item.disabled"
903
902
  [axRipple]="!command.item.disabled"
904
- [look]="command.item.look ?? 'solid'"
903
+ [look]="command.item.look ?? 'blank'"
905
904
  (onClick)="handleOnItemClick($event, command.item, row.data)"
906
905
  >
907
906
  <ax-icon [icon]="command.item.icon"></ax-icon>
@@ -989,8 +988,8 @@ class AXRowExpandColumnComponent extends AXDataTableColumnComponent {
989
988
  get loadingEnabled() {
990
989
  return false;
991
990
  }
992
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowExpandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
993
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXRowExpandColumnComponent, isStandalone: true, selector: "ax-expand-column", inputs: { width: "width", caption: "caption", fixed: "fixed" }, providers: [
991
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowExpandColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
992
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AXRowExpandColumnComponent, isStandalone: true, selector: "ax-expand-column", inputs: { width: "width", caption: "caption", fixed: "fixed" }, providers: [
994
993
  {
995
994
  provide: AXDataTableColumnComponent,
996
995
  useExisting: AXRowExpandColumnComponent,
@@ -1005,7 +1004,7 @@ class AXRowExpandColumnComponent extends AXDataTableColumnComponent {
1005
1004
  [style.padding-inline-start.rem]="row.data?.__meta__?.level * 1.5"
1006
1005
  >
1007
1006
  @if (loadingRow() === row) {
1008
- <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
1007
+ <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
1009
1008
  } @else {
1010
1009
  @if (row.data?.__meta__?.expanded) {
1011
1010
  <i class="fas fa-chevron-down"></i>
@@ -1018,7 +1017,7 @@ class AXRowExpandColumnComponent extends AXDataTableColumnComponent {
1018
1017
  <ng-template #footer></ng-template>
1019
1018
  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1020
1019
  }
1021
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowExpandColumnComponent, decorators: [{
1020
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowExpandColumnComponent, decorators: [{
1022
1021
  type: Component,
1023
1022
  args: [{
1024
1023
  selector: 'ax-expand-column',
@@ -1031,7 +1030,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
1031
1030
  [style.padding-inline-start.rem]="row.data?.__meta__?.level * 1.5"
1032
1031
  >
1033
1032
  @if (loadingRow() === row) {
1034
- <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
1033
+ <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
1035
1034
  } @else {
1036
1035
  @if (row.data?.__meta__?.expanded) {
1037
1036
  <i class="fas fa-chevron-down"></i>
@@ -1138,8 +1137,8 @@ class AXRowIndexColumnComponent extends AXDataTableColumnComponent {
1138
1137
  get cssClass() {
1139
1138
  return 'ax-index-column';
1140
1139
  }
1141
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowIndexColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1142
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: AXRowIndexColumnComponent, isStandalone: true, selector: "ax-index-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", padZero: "padZero" }, providers: [
1140
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowIndexColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1141
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: AXRowIndexColumnComponent, isStandalone: true, selector: "ax-index-column", inputs: { width: "width", caption: "caption", fixed: "fixed", footerTemplate: "footerTemplate", padZero: "padZero" }, providers: [
1143
1142
  AXUnsubscriber,
1144
1143
  {
1145
1144
  provide: AXDataTableColumnComponent,
@@ -1152,7 +1151,7 @@ class AXRowIndexColumnComponent extends AXDataTableColumnComponent {
1152
1151
  </ng-template>
1153
1152
  <ng-template #footer></ng-template> `, isInline: true, dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1154
1153
  }
1155
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowIndexColumnComponent, decorators: [{
1154
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowIndexColumnComponent, decorators: [{
1156
1155
  type: Component,
1157
1156
  args: [{
1158
1157
  selector: 'ax-index-column',
@@ -1294,8 +1293,8 @@ class AXRowSelectColumnComponent extends AXDataTableColumnComponent {
1294
1293
  get cssClass() {
1295
1294
  return 'ax-select-column';
1296
1295
  }
1297
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowSelectColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1298
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: AXRowSelectColumnComponent, isStandalone: true, selector: "ax-select-column", inputs: { width: "width", caption: "caption", fixed: "fixed" }, providers: [
1296
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowSelectColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1297
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: AXRowSelectColumnComponent, isStandalone: true, selector: "ax-select-column", inputs: { width: "width", caption: "caption", fixed: "fixed" }, providers: [
1299
1298
  {
1300
1299
  provide: AXDataTableColumnComponent,
1301
1300
  useExisting: AXRowSelectColumnComponent,
@@ -1325,7 +1324,7 @@ class AXRowSelectColumnComponent extends AXDataTableColumnComponent {
1325
1324
  </ng-template>
1326
1325
  <ng-template #footer></ng-template> `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "component", type: i2$1.AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1327
1326
  }
1328
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXRowSelectColumnComponent, decorators: [{
1327
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXRowSelectColumnComponent, decorators: [{
1329
1328
  type: Component,
1330
1329
  args: [{
1331
1330
  selector: 'ax-select-column',
@@ -2140,14 +2139,14 @@ class AXDataTableComponent extends AXBaseDataTable {
2140
2139
  }
2141
2140
  }
2142
2141
  }
2143
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2144
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXDataTableComponent, isStandalone: true, selector: "ax-data-table", inputs: { dataSource: "dataSource", selectedRows: "selectedRows", parentField: "parentField", rowDetailsTemplate: "rowDetailsTemplate", rowTemplate: "rowTemplate", emptyTemplate: "emptyTemplate", noDataTemplate: "noDataTemplate", alternative: "alternative", showHeader: "showHeader", fixedHeader: "fixedHeader", showFooter: "showFooter", fixedFooter: "fixedFooter", itemHeight: "itemHeight", allowReordering: "allowReordering", paging: "paging", fetchDataMode: "fetchDataMode", loading: "loading", focusedRow: "focusedRow" }, outputs: { selectedRowsChange: "selectedRowsChange", focusedRowChange: "focusedRowChange", onRowClick: "onRowClick", onRowDbClick: "onRowDbClick", onColumnsOrderChanged: "onColumnsOrderChanged", onColumnSizeChanged: "onColumnSizeChanged", onPageChanged: "onPageChanged" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [
2142
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2143
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AXDataTableComponent, isStandalone: true, selector: "ax-data-table", inputs: { dataSource: "dataSource", selectedRows: "selectedRows", parentField: "parentField", rowDetailsTemplate: "rowDetailsTemplate", rowTemplate: "rowTemplate", emptyTemplate: "emptyTemplate", noDataTemplate: "noDataTemplate", alternative: "alternative", showHeader: "showHeader", fixedHeader: "fixedHeader", showFooter: "showFooter", fixedFooter: "fixedFooter", itemHeight: "itemHeight", allowReordering: "allowReordering", paging: "paging", fetchDataMode: "fetchDataMode", loading: "loading", focusedRow: "focusedRow" }, outputs: { selectedRowsChange: "selectedRowsChange", focusedRowChange: "focusedRowChange", onRowClick: "onRowClick", onRowDbClick: "onRowDbClick", onColumnsOrderChanged: "onColumnsOrderChanged", onColumnSizeChanged: "onColumnSizeChanged", onPageChanged: "onPageChanged" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [
2145
2144
  { provide: AXBaseDataTable, useExisting: AXDataTableComponent },
2146
2145
  AXUnsubscriber,
2147
2146
  { provide: AXComponent, useExisting: AXDataTableComponent },
2148
- ], queries: [{ propertyName: "customDataPager", first: true, predicate: AXDataPagerComponent, descendants: true, static: true }, { propertyName: "columns", predicate: AXDataTableColumnComponent }], viewQueries: [{ propertyName: "dataPager", first: true, predicate: ["dataPager"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"> </ng-content>\n<div class=\"ax-data-table-wrapper\">\n <table>\n @if (showHeader) {\n <thead [ngClass]=\"{ 'ax-data-table-sticky-header': fixedHeader }\">\n <tr\n [cdkDropListDisabled]=\"!allowReordering\"\n cdkDropList\n cdkScrollable\n cdkDropListOrientation=\"horizontal\"\n (cdkDropListDropped)=\"drop($event)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-start\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n @for (c of normalColumnsList(); track $index) {\n <th\n cdkDrag\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </th>\n }\n <th></th>\n @for (c of endFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n }\n <tbody [ngClass]=\"{ 'ax-data-table-row-alternative': alternative }\">\n @if (showNoDataLoadedYet) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (noDataTemplate) {\n <ng-container [ngTemplateOutlet]=\"noDataTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-data-yet' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else if (!displayedRows().length) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (emptyTemplate) {\n <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-record' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else {\n @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row, rowIndex } }\"\n ></ng-container>\n }\n\n <ng-template #rowTemp let-data=\"data\">\n @if (rowTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n >\n </ng-container>\n } @else {\n <tr\n [class.ax-state-focused]=\"focusedRow && data.row === focusedRow\"\n [attr.data-index]=\"data.rowIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(data.row)\"\n style.height=\"{{ itemHeight }}px\"\n style.max-height=\"{{ itemHeight }}px\"\n (click)=\"handleRowClick($event, data.row)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n <td><div class=\"ax-bg\"></div></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n </tr>\n @if (data.row?.__meta__?.expanded) {\n @if (rowDetailsTemplate) {\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n <td class=\"ax-data-table-row-details\" [attr.colspan]=\"normalColumnsList().length + 1\">\n <ng-container\n [ngTemplateOutlet]=\"rowDetailsTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n ></ng-container>\n </td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n </tr>\n }\n @for (childRow of data.row.children; let childRowIndex = $index; track childRowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row: childRow, rowIndex: childRowIndex } }\"\n ></ng-container>\n }\n }\n }\n </ng-template>\n\n <tr class=\"empty-row\"></tr>\n }\n </tbody>\n @if (showFooter) {\n <tfoot [ngClass]=\"{ 'ax-data-table-sticky-footer': fixedFooter }\">\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-start\"\n [class.ax-data-table-sticky-footer-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </td>\n }\n <td></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n </tr>\n </tfoot>\n }\n </table>\n</div>\n\n@if (paging) {\n <div class=\"ax-table-footer\" #footerContainer>\n <ng-template #customPager>\n <ng-content select=\"ax-data-pager\"></ng-content>\n </ng-template>\n\n @if (customDataPager) {\n <ng-container [ngTemplateOutlet]=\"customPager\"></ng-container>\n } @else {\n <ax-data-pager\n #dataPager\n [displayMode]=\"'custom'\"\n (onChanged)=\"handleChangePage($event)\"\n [total]=\"dataSource.totalCount\"\n [size]=\"dataSource.pageSize\"\n [isLoading]=\"isLoading()\"\n >\n <ax-prefix class=\"ax-data-table-numeric-paging\">\n <ax-data-pager-numeric-selector> </ax-data-pager-numeric-selector>\n <ax-data-pager-page-sizes> </ax-data-pager-page-sizes>\n </ax-prefix>\n <ax-prefix class=\"ax-data-table-input-paging\">\n <ax-data-pager-prev-buttons> </ax-data-pager-prev-buttons>\n <ax-data-pager-input-selector> </ax-data-pager-input-selector>\n <ax-data-pager-next-buttons> </ax-data-pager-next-buttons>\n </ax-prefix>\n <ax-suffix class=\"ax-data-table-info\">\n <ax-data-pager-info> </ax-data-pager-info>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh({ reset: false })\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </ax-suffix>\n </ax-data-pager>\n }\n </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: ["ax-data-table{--ax-comp-data-table-font-size: .875rem;--ax-comp-data-table-line-height: 1rem;--ax-comp-data-table-border-color: var(--ax-sys-color-border-surface);--ax-comp-data-table-border-radius: var(--ax-sys-border-radius);--ax-comp-data-table-column-bg-color: var(--ax-sys-color-lightest-surface);--ax-comp-data-table-header-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-header-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-data-table-footer-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-footer-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-data-table-hover-bg-color: var(--ax-sys-color-primary-lightest-surface);--ax-comp-data-table-hover-text-color: var(--ax-sys-color-on-primary-lightest-surface);--ax-comp-data-table-focus-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-data-table-selected-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-selected-hover-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-index-bg-color: var(--ax-sys-color-light-surface);--ax-comp-data-table-index-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-alternative-bg-color: var(--ax-sys-color-light-surface);--ax-comp-data-table-alternative-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-skeleton-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-data-table-handler-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-interactive-bg-color: var(--ax-sys-color-light-surface)}.ax-dark ax-data-table{--ax-comp-data-table-column-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-data-table-header-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-data-table-header-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-data-table-footer-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-data-table-footer-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-data-table-hover-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-hover-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-focus-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-selected-bg-color: var(--ax-sys-color-primary-dark-surface);--ax-comp-data-table-selected-hover-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-index-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-data-table-index-text-color: var(--ax-sys-color-on-dark-surface);--ax-comp-data-table-skeleton-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-alternative-bg-color: var(--ax-sys-color-surface);--ax-comp-data-table-alternative-text-color: var(--ax-sys-color-on-surface);--ax-comp-data-table-handler-bg-color: var(--ax-sys-color-primary-dark-surface)}@media screen and (min-width: 768px){html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.ax-state-is-last{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.ax-state-is-first{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}}@media screen and (min-width: 768px){html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.ax-state-is-last{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.ax-state-is-first{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:var(--ax-comp-data-table-font-size);line-height:var(--ax-comp-data-table-line-height);border-radius:var(--ax-comp-data-table-border-radius);border-width:1px;border-color:rgba(var(--ax-comp-data-table-border-color));position:relative;min-height:inherit;overflow:hidden}ax-data-table td.ax-data-table-empty-data{background:transparent!important;position:absolute!important;padding:2rem 1rem;text-align:center;vertical-align:middle;height:8rem;border-bottom:none;top:50%;transform:translateY(-50%);width:100%}ax-data-table td.ax-data-table-empty-data span{color:rgb(var(--ax-sys-color-ghost-500));font-size:var(--ax-comp-data-table-font-size);display:flex;height:100%;align-items:center;justify-content:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-comp-data-table-border-radius)}ax-data-table .ax-data-table-wrapper table{display:table;height:100%;width:100%;table-layout:fixed;overflow-x:auto}ax-data-table .ax-data-table-wrapper table thead{overflow:hidden;border-start-end-radius:var(--ax-comp-data-table-border-radius);border-start-start-radius:var(--ax-comp-data-table-border-radius)}ax-data-table .ax-data-table-wrapper table thead th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-header-bg-color));color:rgba(var(--ax-comp-data-table-header-text-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:2.5rem}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive:hover{background-color:rgba(var(--ax-comp-data-table-interactive-bg-color))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle{position:absolute;inset-inline-end:0px;top:0;bottom:0;width:.25rem;height:100%;cursor:col-resize;background:transparent}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover{background-color:rgba(var(--ax-comp-data-table-handler-bg-color))}ax-data-table .ax-data-table-wrapper table thead th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-data-table-wrapper table thead th:last-child{border-inline-end-width:0px}ax-data-table .ax-data-table-wrapper table thead.ax-data-table-sticky-header{position:sticky;top:0;border-top:none;border-bottom:none;z-index:3;box-shadow:inset 1px 1px 0 2px rgba(var(--ax-comp-data-table-border-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell{position:sticky;z-index:2;border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell{position:sticky;z-index:2;background-color:rgba(var(--ax-comp-data-table-column-bg-color));border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table .ax-data-table-wrapper table tbody tr td{z-index:0}ax-data-table .ax-data-table-wrapper table tbody tr td .ax-bg{top:0;left:0;z-index:-1;width:100%;height:100%;position:absolute;border-inline-end:1px solid rgba(var(--ax-comp-data-table-border-color));background-color:transparent;opacity:.3}ax-data-table .ax-data-table-wrapper table tbody .empty-row{height:auto!important}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td{background-color:rgba(var(--ax-comp-data-table-alternative-bg-color));color:rgba(var(--ax-comp-data-table-alternative-text-color))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) ax-skeleton{width:25%}ax-data-table .ax-data-table-wrapper table tbody tr{height:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-hover-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-hover-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-focus-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-focus-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-selected-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-selected-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-selected-hover-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-selected-hover-text-color))}ax-data-table .ax-data-table-wrapper table tbody td{position:relative;min-width:2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-column-bg-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.5rem;padding-bottom:.5rem;vertical-align:middle}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler{padding-inline-start:.25rem;padding-inline-end:.25rem;cursor:pointer}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler.has-parent{padding-inline-start:1.5rem!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-comp-data-table-index-bg-color));color:rgba(var(--ax-comp-data-table-index-text-color));text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column{text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button.ax-state-disabled{position:relative!important;cursor:not-allowed!important;opacity:.5!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;transform:translateY(-50%);align-items:center;justify-content:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button{--ax-comp-button-font-size: .75rem;--ax-comp-button-padding-x: .25rem;--ax-comp-button-decorator-padding-x: .25rem;--ax-comp-button-icon-only-font-size: .875rem;--ax-sys-size-base: 1.5rem;margin-left:.25rem;margin-right:.25rem}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button ax-loading .ax-loader{width:.75rem!important;height:.75rem!important;border-width:2px!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-comp-data-table-border-radius);border-style:none;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:transparent;padding:.25rem;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-data-table-wrapper table tbody td:last-child{border-inline-end-width:0px}ax-data-table .ax-data-table-wrapper table tbody td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem;background-color:rgba(var(--ax-comp-data-table-skeleton-bg-color))}ax-data-table .ax-data-table-wrapper table tfoot tr td{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-footer-bg-color));color:rgba(var(--ax-comp-data-table-footer-text-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:2.5rem}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive:hover{background-color:rgba(var(--ax-comp-data-table-interactive-bg-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell{position:sticky;z-index:2;border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:-1px;border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-comp-data-table-border-color)),0 -1px rgba(var(--ax-comp-data-table-border-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table .sticky-end{inset-inline-end:var(--sticky-end)}ax-data-table .ax-data-table-wrapper table .sticky-start{inset-inline-start:var(--sticky-start)}}ax-data-table ax-data-pager{justify-content:center}ax-data-table .ax-table-footer{border-top-width:1px;border-collapse:collapse;overflow:hidden;border-color:rgba(var(--ax-comp-data-table-border-color));padding-inline-start:.875rem;padding-inline-end:.875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}ax-data-table .ax-data-table-numeric-paging{display:none}ax-data-table .ax-data-table-input-paging{display:flex}ax-data-table .ax-data-table-info{display:none}@media (min-width: 1024px){ax-data-table .ax-data-table-numeric-paging{display:flex}ax-data-table .ax-data-table-input-paging{display:none}}@media (min-width: 768px){ax-data-table .ax-data-table-info{display:block}ax-data-table ax-data-pager{justify-content:space-between}}.cdk-drag-preview{border-bottom-width:1px;border-inline-end-width:1px;box-shadow:0 5px 5px -3px rgba(var(--ax-sys-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-sys-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-sys-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-surface-fore));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative}.ax-dropdown-command-empty-state-text{color:rgba(var(--ax-sys-color-on-surface-variant-500));font-size:.75rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: AXDataPagerComponent, selector: "ax-data-pager", inputs: ["value", "name", "disabled", "readonly", "isLoading", "size", "total", "displayMode"], outputs: ["valueChange", "onValueChanged", "disabledChange", "readonlyChange", "displayModeChange", "onChanged"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDataPagerNumericSelectorComponent, selector: "ax-data-pager-numeric-selector" }, { kind: "component", type: AXDataPagerPageSizesComponent, selector: "ax-data-pager-page-sizes", inputs: ["sizes"] }, { kind: "component", type: AXDataPagerPrevButtonsComponent, selector: "ax-data-pager-prev-buttons" }, { kind: "component", type: AXDataPagerInputSelectorComponent, selector: "ax-data-pager-input-selector" }, { kind: "component", type: AXDataPagerNextButtonsComponent, selector: "ax-data-pager-next-buttons" }, { kind: "component", type: AXDataPagerInfoComponent, selector: "ax-data-pager-info", inputs: ["text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2147
+ ], queries: [{ propertyName: "customDataPager", first: true, predicate: AXDataPagerComponent, descendants: true, static: true }, { propertyName: "columns", predicate: AXDataTableColumnComponent }], viewQueries: [{ propertyName: "dataPager", first: true, predicate: ["dataPager"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"> </ng-content>\n<div class=\"ax-data-table-wrapper\">\n <table>\n @if (showHeader) {\n <thead [ngClass]=\"{ 'ax-data-table-sticky-header': fixedHeader }\">\n <tr\n [cdkDropListDisabled]=\"!allowReordering\"\n cdkDropList\n cdkScrollable\n cdkDropListOrientation=\"horizontal\"\n (cdkDropListDropped)=\"drop($event)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-start\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n @for (c of normalColumnsList(); track $index) {\n <th\n cdkDrag\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </th>\n }\n <th></th>\n @for (c of endFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n }\n <tbody [ngClass]=\"{ 'ax-data-table-row-alternative': alternative }\">\n @if (showNoDataLoadedYet) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (noDataTemplate) {\n <ng-container [ngTemplateOutlet]=\"noDataTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-data-yet' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else if (!displayedRows().length) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (emptyTemplate) {\n <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-record' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else {\n @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row, rowIndex } }\"\n ></ng-container>\n }\n\n <ng-template #rowTemp let-data=\"data\">\n @if (rowTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n >\n </ng-container>\n } @else {\n <tr\n [class.ax-state-focused]=\"focusedRow && data.row === focusedRow\"\n [attr.data-index]=\"data.rowIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(data.row)\"\n style.height=\"{{ itemHeight }}px\"\n style.max-height=\"{{ itemHeight }}px\"\n (click)=\"handleRowClick($event, data.row)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n <td><div class=\"ax-bg\"></div></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n </tr>\n @if (data.row?.__meta__?.expanded) {\n @if (rowDetailsTemplate) {\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n <td class=\"ax-data-table-row-details\" [attr.colspan]=\"normalColumnsList().length + 1\">\n <ng-container\n [ngTemplateOutlet]=\"rowDetailsTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n ></ng-container>\n </td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n </tr>\n }\n @for (childRow of data.row.children; let childRowIndex = $index; track childRowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row: childRow, rowIndex: childRowIndex } }\"\n ></ng-container>\n }\n }\n }\n </ng-template>\n\n <tr class=\"empty-row\"></tr>\n }\n </tbody>\n @if (showFooter) {\n <tfoot [ngClass]=\"{ 'ax-data-table-sticky-footer': fixedFooter }\">\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-start\"\n [class.ax-data-table-sticky-footer-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </td>\n }\n <td></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n </tr>\n </tfoot>\n }\n </table>\n</div>\n\n@if (paging) {\n <div class=\"ax-table-footer\" #footerContainer>\n <ng-template #customPager>\n <ng-content select=\"ax-data-pager\"></ng-content>\n </ng-template>\n\n @if (customDataPager) {\n <ng-container [ngTemplateOutlet]=\"customPager\"></ng-container>\n } @else {\n <ax-data-pager\n #dataPager\n [displayMode]=\"'custom'\"\n (onChanged)=\"handleChangePage($event)\"\n [total]=\"dataSource.totalCount\"\n [size]=\"dataSource.pageSize\"\n [isLoading]=\"isLoading()\"\n >\n <ax-prefix class=\"ax-data-table-numeric-paging\">\n <ax-data-pager-numeric-selector> </ax-data-pager-numeric-selector>\n <ax-data-pager-page-sizes> </ax-data-pager-page-sizes>\n </ax-prefix>\n <ax-prefix class=\"ax-data-table-input-paging\">\n <ax-data-pager-prev-buttons> </ax-data-pager-prev-buttons>\n <ax-data-pager-input-selector> </ax-data-pager-input-selector>\n <ax-data-pager-next-buttons> </ax-data-pager-next-buttons>\n </ax-prefix>\n <ax-suffix class=\"ax-data-table-info\">\n <ax-data-pager-info> </ax-data-pager-info>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh({ reset: false })\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </ax-suffix>\n </ax-data-pager>\n }\n </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer components{ax-data-table{height:100%;min-height:inherit;border-radius:var(--radius-default,var(--ax-sys-border-radius));border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));width:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));--tw-leading:calc(var(--spacing,.25rem)*4);line-height:calc(var(--spacing,.25rem)*4);flex-direction:column;display:flex;position:relative;overflow:hidden}ax-data-table td.ax-data-table-empty-data{height:calc(var(--spacing,.25rem)*32);border-bottom-style:var(--tw-border-style);width:100%;padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*8);text-align:center;vertical-align:middle;border-bottom-width:0;top:50%;transform:translateY(-50%);background-color:#0000!important;position:absolute!important}ax-data-table td.ax-data-table-empty-data span{height:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));color:var(--color-surface,rgba(var(--ax-sys-color-surface)));justify-content:center;align-items:center;display:flex}ax-data-table .ax-data-table-wrapper{border-radius:var(--radius-default,var(--ax-sys-border-radius));flex:1;width:100%;overflow:auto}ax-data-table .ax-data-table-wrapper table{table-layout:fixed;width:100%;height:100%;display:table;overflow-x:auto}ax-data-table .ax-data-table-wrapper table thead{border-start-start-radius:var(--radius-default,var(--ax-sys-border-radius));border-start-end-radius:var(--radius-default,var(--ax-sys-border-radius));overflow:hidden}ax-data-table .ax-data-table-wrapper table thead th{height:calc(var(--spacing,.25rem)*10);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);background-color:var(--color-lighter);color:var(--color-on-lighter);border-bottom-width:1px;border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;position:relative;overflow:hidden;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)))!important}ax-data-table .ax-data-table-wrapper table thead th:where(.dark,.dark *){background-color:var(--color-darker);color:var(--color-on-darker);border-color:var(--color-border-darker)}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive:hover{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle{top:calc(var(--spacing,.25rem)*0);right:calc(var(--spacing,.25rem)*0);bottom:calc(var(--spacing,.25rem)*0);height:100%;width:calc(var(--spacing,.25rem)*1);cursor:col-resize;background-color:#0000;position:absolute}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover{background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover:where(.dark,.dark *){background-color:var(--color-primary-dark,rgba(var(--ax-sys-color-primary-dark-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-caption{align-items:center;gap:calc(var(--spacing,.25rem)*2);display:flex}ax-data-table .ax-data-table-wrapper table thead th:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0}ax-data-table .ax-data-table-wrapper table thead.ax-data-table-sticky-header{top:calc(var(--spacing,.25rem)*0);z-index:3;border-block-style:var(--tw-border-style);--tw-shadow:inset 1px 1px 0px 2px var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-block-width:0;position:sticky}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell{z-index:2;border-inline-style:var(--tw-border-style);border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell{z-index:2;border-inline-style:var(--tw-border-style);background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell:where(.dark,.dark *){background-color:var(--color-dark,rgba(var(--ax-sys-color-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}ax-data-table .ax-data-table-wrapper table tbody tr td{z-index:0}ax-data-table .ax-data-table-wrapper table tbody tr td .ax-bg{top:calc(var(--spacing,.25rem)*0);left:calc(var(--spacing,.25rem)*0);z-index:-1;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));opacity:.3;background-color:#0000;width:100%;height:100%;position:absolute}ax-data-table .ax-data-table-wrapper table tbody .empty-row{height:auto!important}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td:where(.dark,.dark *){background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) ax-skeleton{width:25%}ax-data-table .ax-data-table-wrapper table tbody tr{height:calc(var(--spacing,.25rem)*10);max-height:calc(var(--spacing,.25rem)*10)}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary-lightest,rgba(var(--ax-sys-color-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){color:var(--color-on-primary-lightest,rgba(var(--ax-sys-color-on-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column):where(.dark,.dark *){color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg{background-color:var(--color-on-primary-lightest,rgba(var(--ax-sys-color-on-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-primary-dark,rgba(var(--ax-sys-color-primary-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))}ax-data-table .ax-data-table-wrapper table tbody td{min-width:calc(var(--spacing,.25rem)*8);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-lightest,rgba(var(--ax-sys-color-lightest-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2);vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td:where(.dark,.dark *){background-color:var(--color-darkest,rgba(var(--ax-sys-color-darkest-surface)))}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler{cursor:pointer;padding-inline:calc(var(--spacing,.25rem)*1)}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler.has-parent{padding-inline-start:calc(var(--spacing,.25rem)*6)!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));text-align:center;text-overflow:ellipsis;white-space:nowrap;color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)));overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column:where(.dark,.dark *){background-color:var(--color-dark,rgba(var(--ax-sys-color-dark-surface)));color:var(--color-on-dark,rgba(var(--ax-sys-color-on-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column{text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button.ax-state-disabled{cursor:not-allowed!important;opacity:.5!important;position:relative!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column>div{inset-inline-start:calc(var(--spacing,.25rem)*0);justify-content:center;align-items:center;width:100%;display:flex;position:absolute;top:50%;transform:translateY(-50%)}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button{--spacing:.2;justify-content:center;align-items:center;display:flex}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button ax-icon{font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button{cursor:pointer;border-style:var(--tw-border-style);text-overflow:ellipsis;white-space:nowrap;border-width:0;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0}ax-data-table .ax-data-table-wrapper table tbody td ax-skeleton{height:calc(var(--spacing,.25rem)*3.5);border-radius:var(--radius-md,.375rem);width:33.3333%}ax-data-table .ax-data-table-wrapper table tfoot tr td{height:calc(var(--spacing,.25rem)*10);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-lighter,rgba(var(--ax-sys-color-lighter-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-overflow:ellipsis;white-space:nowrap;color:var(--color-on-lighter,rgba(var(--ax-sys-color-on-lighter-surface)));text-transform:uppercase;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tfoot tr td:where(.dark,.dark *){background-color:var(--color-darker,rgba(var(--ax-sys-color-darker-surface)));color:var(--color-on-darker,rgba(var(--ax-sys-color-on-darker-surface)))}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive:hover{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)))}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell{z-index:2;border-inline-style:var(--tw-border-style);border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{z-index:3;border-block-style:var(--tw-border-style);--tw-shadow:1px 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface))),0 -1px 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-block-width:0;position:sticky;bottom:-1px}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table .sticky-end{inset-inline-end:var(--sticky-end)}ax-data-table .ax-data-table-wrapper table .sticky-start{inset-inline-start:var(--sticky-start)}}ax-data-table ax-data-pager{justify-content:center}@media (min-width:48rem){ax-data-table ax-data-pager{justify-content:space-between}}ax-data-table .ax-table-footer{border-collapse:collapse;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));padding-inline:calc(var(--spacing,.25rem)*3.5);overflow:hidden}ax-data-table .ax-table-footer .ax-table-info{flex:1;justify-content:space-between;align-items:center;display:flex}ax-data-table .ax-data-table-numeric-paging{display:none}@media (min-width:64rem){ax-data-table .ax-data-table-numeric-paging{display:flex}}ax-data-table .ax-data-table-input-paging{display:flex}@media (min-width:64rem){ax-data-table .ax-data-table-input-paging{display:none}}ax-data-table .ax-data-table-info{justify-content:center;align-items:center;display:none}@media (min-width:48rem){ax-data-table .ax-data-table-info{display:flex}}ax-data-table .ax-data-table-info ax-text{color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}.cdk-drag-preview{border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)));text-transform:uppercase;--tw-shadow:0 5px 5px -3px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.2)),0 8px 10px 1px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.14)),0 3px 14px 2px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.12));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);position:relative}.ax-dropdown-command-empty-state-text{font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)))}}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}\n/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: AXDataPagerComponent, selector: "ax-data-pager", inputs: ["value", "name", "disabled", "readonly", "isLoading", "size", "total", "displayMode"], outputs: ["valueChange", "onValueChanged", "disabledChange", "readonlyChange", "displayModeChange", "onChanged"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDataPagerNumericSelectorComponent, selector: "ax-data-pager-numeric-selector" }, { kind: "component", type: AXDataPagerPageSizesComponent, selector: "ax-data-pager-page-sizes", inputs: ["sizes"] }, { kind: "component", type: AXDataPagerPrevButtonsComponent, selector: "ax-data-pager-prev-buttons" }, { kind: "component", type: AXDataPagerInputSelectorComponent, selector: "ax-data-pager-input-selector" }, { kind: "component", type: AXDataPagerNextButtonsComponent, selector: "ax-data-pager-next-buttons" }, { kind: "component", type: AXDataPagerInfoComponent, selector: "ax-data-pager-info", inputs: ["text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2149
2148
  }
2150
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableComponent, decorators: [{
2149
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableComponent, decorators: [{
2151
2150
  type: Component,
2152
2151
  args: [{ selector: 'ax-data-table', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { ngSkipHydration: 'true' }, inputs: ['dataSource', 'selectedRows', 'parentField', 'rowDetailsTemplate'], outputs: ['selectedRowsChange'], providers: [
2153
2152
  { provide: AXBaseDataTable, useExisting: AXDataTableComponent },
@@ -2172,7 +2171,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
2172
2171
  AXButtonComponent,
2173
2172
  AsyncPipe,
2174
2173
  AXTranslatorPipe,
2175
- ], template: "<ng-content select=\"ax-header\"> </ng-content>\n<div class=\"ax-data-table-wrapper\">\n <table>\n @if (showHeader) {\n <thead [ngClass]=\"{ 'ax-data-table-sticky-header': fixedHeader }\">\n <tr\n [cdkDropListDisabled]=\"!allowReordering\"\n cdkDropList\n cdkScrollable\n cdkDropListOrientation=\"horizontal\"\n (cdkDropListDropped)=\"drop($event)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-start\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n @for (c of normalColumnsList(); track $index) {\n <th\n cdkDrag\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </th>\n }\n <th></th>\n @for (c of endFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n }\n <tbody [ngClass]=\"{ 'ax-data-table-row-alternative': alternative }\">\n @if (showNoDataLoadedYet) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (noDataTemplate) {\n <ng-container [ngTemplateOutlet]=\"noDataTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-data-yet' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else if (!displayedRows().length) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (emptyTemplate) {\n <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-record' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else {\n @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row, rowIndex } }\"\n ></ng-container>\n }\n\n <ng-template #rowTemp let-data=\"data\">\n @if (rowTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n >\n </ng-container>\n } @else {\n <tr\n [class.ax-state-focused]=\"focusedRow && data.row === focusedRow\"\n [attr.data-index]=\"data.rowIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(data.row)\"\n style.height=\"{{ itemHeight }}px\"\n style.max-height=\"{{ itemHeight }}px\"\n (click)=\"handleRowClick($event, data.row)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n <td><div class=\"ax-bg\"></div></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n </tr>\n @if (data.row?.__meta__?.expanded) {\n @if (rowDetailsTemplate) {\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n <td class=\"ax-data-table-row-details\" [attr.colspan]=\"normalColumnsList().length + 1\">\n <ng-container\n [ngTemplateOutlet]=\"rowDetailsTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n ></ng-container>\n </td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n </tr>\n }\n @for (childRow of data.row.children; let childRowIndex = $index; track childRowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row: childRow, rowIndex: childRowIndex } }\"\n ></ng-container>\n }\n }\n }\n </ng-template>\n\n <tr class=\"empty-row\"></tr>\n }\n </tbody>\n @if (showFooter) {\n <tfoot [ngClass]=\"{ 'ax-data-table-sticky-footer': fixedFooter }\">\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-start\"\n [class.ax-data-table-sticky-footer-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </td>\n }\n <td></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n </tr>\n </tfoot>\n }\n </table>\n</div>\n\n@if (paging) {\n <div class=\"ax-table-footer\" #footerContainer>\n <ng-template #customPager>\n <ng-content select=\"ax-data-pager\"></ng-content>\n </ng-template>\n\n @if (customDataPager) {\n <ng-container [ngTemplateOutlet]=\"customPager\"></ng-container>\n } @else {\n <ax-data-pager\n #dataPager\n [displayMode]=\"'custom'\"\n (onChanged)=\"handleChangePage($event)\"\n [total]=\"dataSource.totalCount\"\n [size]=\"dataSource.pageSize\"\n [isLoading]=\"isLoading()\"\n >\n <ax-prefix class=\"ax-data-table-numeric-paging\">\n <ax-data-pager-numeric-selector> </ax-data-pager-numeric-selector>\n <ax-data-pager-page-sizes> </ax-data-pager-page-sizes>\n </ax-prefix>\n <ax-prefix class=\"ax-data-table-input-paging\">\n <ax-data-pager-prev-buttons> </ax-data-pager-prev-buttons>\n <ax-data-pager-input-selector> </ax-data-pager-input-selector>\n <ax-data-pager-next-buttons> </ax-data-pager-next-buttons>\n </ax-prefix>\n <ax-suffix class=\"ax-data-table-info\">\n <ax-data-pager-info> </ax-data-pager-info>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh({ reset: false })\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </ax-suffix>\n </ax-data-pager>\n }\n </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: ["ax-data-table{--ax-comp-data-table-font-size: .875rem;--ax-comp-data-table-line-height: 1rem;--ax-comp-data-table-border-color: var(--ax-sys-color-border-surface);--ax-comp-data-table-border-radius: var(--ax-sys-border-radius);--ax-comp-data-table-column-bg-color: var(--ax-sys-color-lightest-surface);--ax-comp-data-table-header-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-header-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-data-table-footer-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-footer-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-data-table-hover-bg-color: var(--ax-sys-color-primary-lightest-surface);--ax-comp-data-table-hover-text-color: var(--ax-sys-color-on-primary-lightest-surface);--ax-comp-data-table-focus-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-data-table-selected-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-selected-hover-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-index-bg-color: var(--ax-sys-color-light-surface);--ax-comp-data-table-index-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-alternative-bg-color: var(--ax-sys-color-light-surface);--ax-comp-data-table-alternative-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-skeleton-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-data-table-handler-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-interactive-bg-color: var(--ax-sys-color-light-surface)}.ax-dark ax-data-table{--ax-comp-data-table-column-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-data-table-header-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-data-table-header-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-data-table-footer-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-data-table-footer-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-data-table-hover-bg-color: var(--ax-sys-color-primary-light-surface);--ax-comp-data-table-hover-text-color: var(--ax-sys-color-on-light-surface);--ax-comp-data-table-focus-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-selected-bg-color: var(--ax-sys-color-primary-dark-surface);--ax-comp-data-table-selected-hover-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-data-table-index-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-data-table-index-text-color: var(--ax-sys-color-on-dark-surface);--ax-comp-data-table-skeleton-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-data-table-alternative-bg-color: var(--ax-sys-color-surface);--ax-comp-data-table-alternative-text-color: var(--ax-sys-color-on-surface);--ax-comp-data-table-handler-bg-color: var(--ax-sys-color-primary-dark-surface)}@media screen and (min-width: 768px){html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.ax-state-is-last{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.ax-state-is-first{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}}@media screen and (min-width: 768px){html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.ax-state-is-last{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.ax-state-is-first{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:var(--ax-comp-data-table-font-size);line-height:var(--ax-comp-data-table-line-height);border-radius:var(--ax-comp-data-table-border-radius);border-width:1px;border-color:rgba(var(--ax-comp-data-table-border-color));position:relative;min-height:inherit;overflow:hidden}ax-data-table td.ax-data-table-empty-data{background:transparent!important;position:absolute!important;padding:2rem 1rem;text-align:center;vertical-align:middle;height:8rem;border-bottom:none;top:50%;transform:translateY(-50%);width:100%}ax-data-table td.ax-data-table-empty-data span{color:rgb(var(--ax-sys-color-ghost-500));font-size:var(--ax-comp-data-table-font-size);display:flex;height:100%;align-items:center;justify-content:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-comp-data-table-border-radius)}ax-data-table .ax-data-table-wrapper table{display:table;height:100%;width:100%;table-layout:fixed;overflow-x:auto}ax-data-table .ax-data-table-wrapper table thead{overflow:hidden;border-start-end-radius:var(--ax-comp-data-table-border-radius);border-start-start-radius:var(--ax-comp-data-table-border-radius)}ax-data-table .ax-data-table-wrapper table thead th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-header-bg-color));color:rgba(var(--ax-comp-data-table-header-text-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:2.5rem}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive:hover{background-color:rgba(var(--ax-comp-data-table-interactive-bg-color))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle{position:absolute;inset-inline-end:0px;top:0;bottom:0;width:.25rem;height:100%;cursor:col-resize;background:transparent}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover{background-color:rgba(var(--ax-comp-data-table-handler-bg-color))}ax-data-table .ax-data-table-wrapper table thead th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-data-table-wrapper table thead th:last-child{border-inline-end-width:0px}ax-data-table .ax-data-table-wrapper table thead.ax-data-table-sticky-header{position:sticky;top:0;border-top:none;border-bottom:none;z-index:3;box-shadow:inset 1px 1px 0 2px rgba(var(--ax-comp-data-table-border-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell{position:sticky;z-index:2;border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell{position:sticky;z-index:2;background-color:rgba(var(--ax-comp-data-table-column-bg-color));border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table .ax-data-table-wrapper table tbody tr td{z-index:0}ax-data-table .ax-data-table-wrapper table tbody tr td .ax-bg{top:0;left:0;z-index:-1;width:100%;height:100%;position:absolute;border-inline-end:1px solid rgba(var(--ax-comp-data-table-border-color));background-color:transparent;opacity:.3}ax-data-table .ax-data-table-wrapper table tbody .empty-row{height:auto!important}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td{background-color:rgba(var(--ax-comp-data-table-alternative-bg-color));color:rgba(var(--ax-comp-data-table-alternative-text-color))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) ax-skeleton{width:25%}ax-data-table .ax-data-table-wrapper table tbody tr{height:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-hover-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-hover-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-focus-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-focus-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-selected-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-selected-text-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column) .ax-bg{background-color:rgba(var(--ax-comp-data-table-selected-hover-bg-color))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){color:rgba(var(--ax-comp-data-table-selected-hover-text-color))}ax-data-table .ax-data-table-wrapper table tbody td{position:relative;min-width:2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-column-bg-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.5rem;padding-bottom:.5rem;vertical-align:middle}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler{padding-inline-start:.25rem;padding-inline-end:.25rem;cursor:pointer}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler.has-parent{padding-inline-start:1.5rem!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-comp-data-table-index-bg-color));color:rgba(var(--ax-comp-data-table-index-text-color));text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column{text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button.ax-state-disabled{position:relative!important;cursor:not-allowed!important;opacity:.5!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;transform:translateY(-50%);align-items:center;justify-content:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button{--ax-comp-button-font-size: .75rem;--ax-comp-button-padding-x: .25rem;--ax-comp-button-decorator-padding-x: .25rem;--ax-comp-button-icon-only-font-size: .875rem;--ax-sys-size-base: 1.5rem;margin-left:.25rem;margin-right:.25rem}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button ax-loading .ax-loader{width:.75rem!important;height:.75rem!important;border-width:2px!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-comp-data-table-border-radius);border-style:none;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:transparent;padding:.25rem;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-data-table-wrapper table tbody td:last-child{border-inline-end-width:0px}ax-data-table .ax-data-table-wrapper table tbody td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem;background-color:rgba(var(--ax-comp-data-table-skeleton-bg-color))}ax-data-table .ax-data-table-wrapper table tfoot tr td{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-comp-data-table-footer-bg-color));color:rgba(var(--ax-comp-data-table-footer-text-color));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:2.5rem}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive:hover{background-color:rgba(var(--ax-comp-data-table-interactive-bg-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell{position:sticky;z-index:2;border-inline-start:none;border-inline-end:none}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start{box-shadow:inset -1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.ax-state-is-last{box-shadow:inset -2px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end{box-shadow:inset 1px 0 rgba(var(--ax-comp-data-table-border-color))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.ax-state-is-first{box-shadow:inset 2px 0 rgba(var(--ax-comp-data-table-border-color))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:-1px;border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-comp-data-table-border-color)),0 -1px rgba(var(--ax-comp-data-table-border-color))}@media screen and (min-width: 768px){ax-data-table .ax-data-table-wrapper table .sticky-end{inset-inline-end:var(--sticky-end)}ax-data-table .ax-data-table-wrapper table .sticky-start{inset-inline-start:var(--sticky-start)}}ax-data-table ax-data-pager{justify-content:center}ax-data-table .ax-table-footer{border-top-width:1px;border-collapse:collapse;overflow:hidden;border-color:rgba(var(--ax-comp-data-table-border-color));padding-inline-start:.875rem;padding-inline-end:.875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}ax-data-table .ax-data-table-numeric-paging{display:none}ax-data-table .ax-data-table-input-paging{display:flex}ax-data-table .ax-data-table-info{display:none}@media (min-width: 1024px){ax-data-table .ax-data-table-numeric-paging{display:flex}ax-data-table .ax-data-table-input-paging{display:none}}@media (min-width: 768px){ax-data-table .ax-data-table-info{display:block}ax-data-table ax-data-pager{justify-content:space-between}}.cdk-drag-preview{border-bottom-width:1px;border-inline-end-width:1px;box-shadow:0 5px 5px -3px rgba(var(--ax-sys-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-sys-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-sys-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-comp-data-table-border-color));background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-surface-fore));padding-inline-start:1rem;padding-inline-end:1rem;padding-top:.75rem;padding-bottom:.75rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative}.ax-dropdown-command-empty-state-text{color:rgba(var(--ax-sys-color-on-surface-variant-500));font-size:.75rem}\n"] }]
2174
+ ], template: "<ng-content select=\"ax-header\"> </ng-content>\n<div class=\"ax-data-table-wrapper\">\n <table>\n @if (showHeader) {\n <thead [ngClass]=\"{ 'ax-data-table-sticky-header': fixedHeader }\">\n <tr\n [cdkDropListDisabled]=\"!allowReordering\"\n cdkDropList\n cdkScrollable\n cdkDropListOrientation=\"horizontal\"\n (cdkDropListDropped)=\"drop($event)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-start\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n @for (c of normalColumnsList(); track $index) {\n <th\n cdkDrag\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </th>\n }\n <th></th>\n @for (c of endFixedColumnsList(); track $index) {\n <th\n cdkDrag\n [cdkDragDisabled]=\"true\"\n cdkDragLockAxis=\"x\"\n class=\"ax-data-table-head-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderHeaderTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n }\n <tbody [ngClass]=\"{ 'ax-data-table-row-alternative': alternative }\">\n @if (showNoDataLoadedYet) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (noDataTemplate) {\n <ng-container [ngTemplateOutlet]=\"noDataTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-data-yet' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else if (!displayedRows().length) {\n <tr style=\"display: inherit\">\n <td class=\"ax-data-table-empty-data\" [attr.colspan]=\"columnsList().length + 1\">\n @if (emptyTemplate) {\n <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n } @else {\n <span>{{ '@acorex:common.general.no-record' | translate | async }}</span>\n }\n </td>\n </tr>\n } @else {\n @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row, rowIndex } }\"\n ></ng-container>\n }\n\n <ng-template #rowTemp let-data=\"data\">\n @if (rowTemplate) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n >\n </ng-container>\n } @else {\n <tr\n [class.ax-state-focused]=\"focusedRow && data.row === focusedRow\"\n [attr.data-index]=\"data.rowIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(data.row)\"\n style.height=\"{{ itemHeight }}px\"\n style.max-height=\"{{ itemHeight }}px\"\n (click)=\"handleRowClick($event, data.row)\"\n >\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n <td><div class=\"ax-bg\"></div></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n [attr.data-label]=\"c.caption\"\n tabindex=\"0\"\n [class]=\"c.cssClass\"\n >\n <div class=\"ax-bg\"></div>\n @if (data.row && !isLoading()) {\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: { data: data.row, rowIndex: calculateRowIndex(data.rowIndex) },\n }\"\n ></ng-container>\n } @else {\n @if (c.loadingEnabled && loading.enabled) {\n @if (loading.loadingTemplate) {\n <ng-container [ngTemplateOutlet]=\"loading.loadingTemplate\"></ng-container>\n } @else {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n }\n </td>\n }\n </tr>\n @if (data.row?.__meta__?.expanded) {\n @if (rowDetailsTemplate) {\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-start]=\"true\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n <td class=\"ax-data-table-row-details\" [attr.colspan]=\"normalColumnsList().length + 1\">\n <ng-container\n [ngTemplateOutlet]=\"rowDetailsTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: data.row, rowIndex: data.rowIndex } }\"\n ></ng-container>\n </td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n [style.width]=\"c.width\"\n [class.ax-data-table-sticky-body-cell]=\"c.fixed && c.width\"\n [class.sticky-end]=\"true\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-bg\"></div>\n </td>\n }\n </tr>\n }\n @for (childRow of data.row.children; let childRowIndex = $index; track childRowIndex) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemp\"\n [ngTemplateOutletContext]=\"{ data: { row: childRow, rowIndex: childRowIndex } }\"\n ></ng-container>\n }\n }\n }\n </ng-template>\n\n <tr class=\"empty-row\"></tr>\n }\n </tbody>\n @if (showFooter) {\n <tfoot [ngClass]=\"{ 'ax-data-table-sticky-footer': fixedFooter }\">\n <tr>\n @for (c of startFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-start\"\n [class.ax-data-table-sticky-footer-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-last]=\"c['isLastFixedColumn']\"\n [style.--sticky-start]=\"c['stickyStart']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n @for (c of normalColumnsList(); track $index) {\n <td\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n @if (c.allowResizing && !c.fixed) {\n <div\n class=\"ax-resize-handle\"\n (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"\n (dblclick)=\"onResizeHandlerDoubleClick($event, this.startFixedColumnsList().length + $index)\"\n title=\"Double-click to auto-fit column width\"\n ></div>\n }\n </td>\n }\n <td></td>\n @for (c of endFixedColumnsList(); track $index) {\n <td\n class=\"ax-data-table-sticky-footer-cell sticky-end\"\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [class.ax-data-table-sticky-header-cell]=\"c.fixed && c.width\"\n [style.width]=\"c.width\"\n [class.ax-state-is-first]=\"c['isFirstFixedColumn']\"\n [style.--sticky-end]=\"c['stickyEnd']\"\n >\n <div class=\"ax-caption\">\n <ng-container\n [ngTemplateOutlet]=\"c.renderFooterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: c, rows: displayedRows(), rowIndex: $index } }\"\n ></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n </td>\n }\n </tr>\n </tfoot>\n }\n </table>\n</div>\n\n@if (paging) {\n <div class=\"ax-table-footer\" #footerContainer>\n <ng-template #customPager>\n <ng-content select=\"ax-data-pager\"></ng-content>\n </ng-template>\n\n @if (customDataPager) {\n <ng-container [ngTemplateOutlet]=\"customPager\"></ng-container>\n } @else {\n <ax-data-pager\n #dataPager\n [displayMode]=\"'custom'\"\n (onChanged)=\"handleChangePage($event)\"\n [total]=\"dataSource.totalCount\"\n [size]=\"dataSource.pageSize\"\n [isLoading]=\"isLoading()\"\n >\n <ax-prefix class=\"ax-data-table-numeric-paging\">\n <ax-data-pager-numeric-selector> </ax-data-pager-numeric-selector>\n <ax-data-pager-page-sizes> </ax-data-pager-page-sizes>\n </ax-prefix>\n <ax-prefix class=\"ax-data-table-input-paging\">\n <ax-data-pager-prev-buttons> </ax-data-pager-prev-buttons>\n <ax-data-pager-input-selector> </ax-data-pager-input-selector>\n <ax-data-pager-next-buttons> </ax-data-pager-next-buttons>\n </ax-prefix>\n <ax-suffix class=\"ax-data-table-info\">\n <ax-data-pager-info> </ax-data-pager-info>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh({ reset: false })\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </ax-suffix>\n </ax-data-pager>\n }\n </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer components{ax-data-table{height:100%;min-height:inherit;border-radius:var(--radius-default,var(--ax-sys-border-radius));border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));width:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));--tw-leading:calc(var(--spacing,.25rem)*4);line-height:calc(var(--spacing,.25rem)*4);flex-direction:column;display:flex;position:relative;overflow:hidden}ax-data-table td.ax-data-table-empty-data{height:calc(var(--spacing,.25rem)*32);border-bottom-style:var(--tw-border-style);width:100%;padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*8);text-align:center;vertical-align:middle;border-bottom-width:0;top:50%;transform:translateY(-50%);background-color:#0000!important;position:absolute!important}ax-data-table td.ax-data-table-empty-data span{height:100%;font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25/.875)));color:var(--color-surface,rgba(var(--ax-sys-color-surface)));justify-content:center;align-items:center;display:flex}ax-data-table .ax-data-table-wrapper{border-radius:var(--radius-default,var(--ax-sys-border-radius));flex:1;width:100%;overflow:auto}ax-data-table .ax-data-table-wrapper table{table-layout:fixed;width:100%;height:100%;display:table;overflow-x:auto}ax-data-table .ax-data-table-wrapper table thead{border-start-start-radius:var(--radius-default,var(--ax-sys-border-radius));border-start-end-radius:var(--radius-default,var(--ax-sys-border-radius));overflow:hidden}ax-data-table .ax-data-table-wrapper table thead th{height:calc(var(--spacing,.25rem)*10);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);background-color:var(--color-lighter);color:var(--color-on-lighter);border-bottom-width:1px;border-color:var(--color-border-lighter);padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;position:relative;overflow:hidden;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)))!important}ax-data-table .ax-data-table-wrapper table thead th:where(.dark,.dark *){background-color:var(--color-darker);color:var(--color-on-darker);border-color:var(--color-border-darker)}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table thead th.ax-interactive:hover{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle{top:calc(var(--spacing,.25rem)*0);right:calc(var(--spacing,.25rem)*0);bottom:calc(var(--spacing,.25rem)*0);height:100%;width:calc(var(--spacing,.25rem)*1);cursor:col-resize;background-color:#0000;position:absolute}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover{background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-resize-handle:hover:where(.dark,.dark *){background-color:var(--color-primary-dark,rgba(var(--ax-sys-color-primary-dark-surface)))}ax-data-table .ax-data-table-wrapper table thead th .ax-caption{align-items:center;gap:calc(var(--spacing,.25rem)*2);display:flex}ax-data-table .ax-data-table-wrapper table thead th:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0}ax-data-table .ax-data-table-wrapper table thead.ax-data-table-sticky-header{top:calc(var(--spacing,.25rem)*0);z-index:3;border-block-style:var(--tw-border-style);--tw-shadow:inset 1px 1px 0px 2px var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-block-width:0;position:sticky}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell{z-index:2;border-inline-style:var(--tw-border-style);border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell{z-index:2;border-inline-style:var(--tw-border-style);background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell:where(.dark,.dark *){background-color:var(--color-dark,rgba(var(--ax-sys-color-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst:where(:dir(rtl),[dir=rtl],[dir=rtl] *){--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}ax-data-table .ax-data-table-wrapper table tbody tr td{z-index:0}ax-data-table .ax-data-table-wrapper table tbody tr td .ax-bg{top:calc(var(--spacing,.25rem)*0);left:calc(var(--spacing,.25rem)*0);z-index:-1;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));opacity:.3;background-color:#0000;width:100%;height:100%;position:absolute}ax-data-table .ax-data-table-wrapper table tbody .empty-row{height:auto!important}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) td:where(.dark,.dark *){background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}ax-data-table .ax-data-table-wrapper table tbody.ax-data-table-row-alternative tr:nth-child(2n) ax-skeleton{width:25%}ax-data-table .ax-data-table-wrapper table tbody tr{height:calc(var(--spacing,.25rem)*10);max-height:calc(var(--spacing,.25rem)*10)}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary-lightest,rgba(var(--ax-sys-color-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){color:var(--color-on-primary-lightest,rgba(var(--ax-sys-color-on-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column):where(.dark,.dark *){color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg{background-color:var(--color-on-primary-lightest,rgba(var(--ax-sys-color-on-primary-lightest-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary-light,rgba(var(--ax-sys-color-primary-light-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column) .ax-bg:where(.dark,.dark *){background-color:var(--color-primary-dark,rgba(var(--ax-sys-color-primary-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column) .ax-bg{background-color:var(--color-primary,rgba(var(--ax-sys-color-primary-surface)))}ax-data-table .ax-data-table-wrapper table tbody td{min-width:calc(var(--spacing,.25rem)*8);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-lightest,rgba(var(--ax-sys-color-lightest-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*2);vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td:where(.dark,.dark *){background-color:var(--color-darkest,rgba(var(--ax-sys-color-darkest-surface)))}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler{cursor:pointer;padding-inline:calc(var(--spacing,.25rem)*1)}ax-data-table .ax-data-table-wrapper table tbody td .ax-expand-handler.has-parent{padding-inline-start:calc(var(--spacing,.25rem)*6)!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)));text-align:center;text-overflow:ellipsis;white-space:nowrap;color:var(--color-on-light,rgba(var(--ax-sys-color-on-light-surface)));overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td.ax-index-column:where(.dark,.dark *){background-color:var(--color-dark,rgba(var(--ax-sys-color-dark-surface)));color:var(--color-on-dark,rgba(var(--ax-sys-color-on-dark-surface)))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column{text-align:center}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button.ax-state-disabled{cursor:not-allowed!important;opacity:.5!important;position:relative!important}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column>div{inset-inline-start:calc(var(--spacing,.25rem)*0);justify-content:center;align-items:center;width:100%;display:flex;position:absolute;top:50%;transform:translateY(-50%)}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button{--spacing:.2;justify-content:center;align-items:center;display:flex}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button ax-icon{font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button{cursor:pointer;border-style:var(--tw-border-style);text-overflow:ellipsis;white-space:nowrap;border-width:0;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column ax-button button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0}ax-data-table .ax-data-table-wrapper table tbody td ax-skeleton{height:calc(var(--spacing,.25rem)*3.5);border-radius:var(--radius-md,.375rem);width:33.3333%}ax-data-table .ax-data-table-wrapper table tfoot tr td{height:calc(var(--spacing,.25rem)*10);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-lighter,rgba(var(--ax-sys-color-lighter-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);text-overflow:ellipsis;white-space:nowrap;color:var(--color-on-lighter,rgba(var(--ax-sys-color-on-lighter-surface)));text-transform:uppercase;position:relative;overflow:hidden}ax-data-table .ax-data-table-wrapper table tfoot tr td:where(.dark,.dark *){background-color:var(--color-darker,rgba(var(--ax-sys-color-darker-surface)));color:var(--color-on-darker,rgba(var(--ax-sys-color-on-darker-surface)))}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive{cursor:pointer}ax-data-table .ax-data-table-wrapper table tfoot tr td.ax-interactive:hover{background-color:var(--color-light,rgba(var(--ax-sys-color-light-surface)))}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell{z-index:2;border-inline-style:var(--tw-border-style);border-inline-width:0;position:sticky}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start{--tw-shadow:inset -1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{--tw-shadow:inset -2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end{--tw-shadow:inset 1px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{--tw-shadow:inset 2px 0 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{z-index:3;border-block-style:var(--tw-border-style);--tw-shadow:1px 0 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface))),0 -1px 0 var(--tw-shadow-color,rgba(var(--ax-sys-color-border-surface)));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-block-width:0;position:sticky;bottom:-1px}@media screen and (min-width:768px){ax-data-table .ax-data-table-wrapper table .sticky-end{inset-inline-end:var(--sticky-end)}ax-data-table .ax-data-table-wrapper table .sticky-start{inset-inline-start:var(--sticky-start)}}ax-data-table ax-data-pager{justify-content:center}@media (min-width:48rem){ax-data-table ax-data-pager{justify-content:space-between}}ax-data-table .ax-table-footer{border-collapse:collapse;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));padding-inline:calc(var(--spacing,.25rem)*3.5);overflow:hidden}ax-data-table .ax-table-footer .ax-table-info{flex:1;justify-content:space-between;align-items:center;display:flex}ax-data-table .ax-data-table-numeric-paging{display:none}@media (min-width:64rem){ax-data-table .ax-data-table-numeric-paging{display:flex}}ax-data-table .ax-data-table-input-paging{display:flex}@media (min-width:64rem){ax-data-table .ax-data-table-input-paging{display:none}}ax-data-table .ax-data-table-info{justify-content:center;align-items:center;display:none}@media (min-width:48rem){ax-data-table .ax-data-table-info{display:flex}}ax-data-table .ax-data-table-info ax-text{color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)))}.cdk-drag-preview{border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-border-surface,rgba(var(--ax-sys-color-border-surface)));background-color:var(--color-surface,rgba(var(--ax-sys-color-surface)));padding-inline:calc(var(--spacing,.25rem)*4);padding-block:calc(var(--spacing,.25rem)*3);text-align:start;--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);color:var(--color-on-surface,rgba(var(--ax-sys-color-on-surface)));text-transform:uppercase;--tw-shadow:0 5px 5px -3px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.2)),0 8px 10px 1px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.14)),0 3px 14px 2px var(--tw-shadow-color,rgba(var(--ax-sys-color-primary-900),.12));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);position:relative}.ax-dropdown-command-empty-state-text{font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1/.75)))}}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}\n/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n"] }]
2176
2175
  }], propDecorators: { dataPager: [{
2177
2176
  type: ViewChild,
2178
2177
  args: ['dataPager']
@@ -2226,439 +2225,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
2226
2225
  args: [AXDataTableColumnComponent]
2227
2226
  }] } });
2228
2227
 
2229
- /**
2230
- * Component for a data table with infinite scrolling capabilities.
2231
- *
2232
- * @category Components
2233
- */
2234
- class AXInfiniteScrollDataTableComponent extends AXBaseDataTable {
2235
- constructor() {
2236
- super(...arguments);
2237
- this.document = inject(DOCUMENT);
2238
- this.platformID = inject(PLATFORM_ID);
2239
- this.ngZone = inject(NgZone);
2240
- /**
2241
- * Emits an event when the page changes.
2242
- *
2243
- * @event
2244
- */
2245
- this.onPageChanged = new EventEmitter();
2246
- /**
2247
- * @ignore
2248
- */
2249
- this.clickSubject = new Subject();
2250
- /**
2251
- * Emits an event when a row is clicked.
2252
- *
2253
- * @event
2254
- */
2255
- this.onRowClick = new EventEmitter();
2256
- /**
2257
- * Emits an event when a row is double-clicked.
2258
- *
2259
- * @event
2260
- */
2261
- this.onRowDbClick = new EventEmitter();
2262
- /**
2263
- * Controls the visibility of the table header.
2264
- *
2265
- * @defaultValue true
2266
- */
2267
- this.showHeader = true;
2268
- /**
2269
- * Defines the mode for fetching data.
2270
- *
2271
- * @defaultValue 'auto'
2272
- */
2273
- this.fetchDataMode = 'auto';
2274
- /**
2275
- * Configuration for the loading state of the data table.
2276
- *
2277
- * @defaultValue { enabled: true, animation: true }
2278
- */
2279
- this.loading = {
2280
- enabled: true,
2281
- animation: true,
2282
- };
2283
- /**
2284
- * @ignore
2285
- */
2286
- this.isLoading = signal(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
2287
- /**
2288
- * @ignore
2289
- */
2290
- this.hasItems = false;
2291
- /**
2292
- * @ignore
2293
- */
2294
- this.totalRows = 0;
2295
- /**
2296
- * @ignore
2297
- */
2298
- this.currentPage = 0;
2299
- /**
2300
- * @ignore
2301
- */
2302
- this.totalPages = 0;
2303
- /**
2304
- * @ignore
2305
- */
2306
- this.startRowIndex = 0;
2307
- /**
2308
- * @ignore
2309
- */
2310
- this.lastIndex = 0;
2311
- /**
2312
- * Event emitted when the focused row changes.
2313
- *
2314
- * @event
2315
- */
2316
- this.focusedRowChange = new EventEmitter();
2317
- /**
2318
- * Defines the height of each item in the table.
2319
- *
2320
- * @default 40
2321
- */
2322
- this.itemHeight = 40;
2323
- /**
2324
- * @ignore
2325
- */
2326
- this.width = '100%';
2327
- /**
2328
- * @ignore
2329
- */
2330
- this.height = '100%';
2331
- /**
2332
- * Emitted when the scroll index changes in the table.
2333
- *
2334
- * @event
2335
- */
2336
- this.onScrolledIndexChanged = new EventEmitter();
2337
- }
2338
- /**
2339
- * @ignore
2340
- */
2341
- startFixedColumn() {
2342
- return this.columns?.toArray().filter((c) => c.fixed == 'start') ?? [];
2343
- }
2344
- /**
2345
- * @ignore
2346
- */
2347
- endFixedColumn() {
2348
- return this.columns?.toArray().filter((c) => c.fixed == 'end') ?? [];
2349
- }
2350
- /**
2351
- * @ignore
2352
- */
2353
- notFixedColumn() {
2354
- return this.columns?.toArray().filter((c) => !c.fixed) ?? [];
2355
- }
2356
- /**
2357
- * @ignore
2358
- */
2359
- notFixedColumnCount() {
2360
- return this.columns?.toArray().filter((c) => !c.fixed).length ?? 0;
2361
- }
2362
- /**
2363
- * @ignore
2364
- */
2365
- fixedColumnCount() {
2366
- return this.columns?.toArray().filter((c) => c.fixed).length ?? 0;
2367
- }
2368
- /**
2369
- * Retrieves the currently focused row.
2370
- */
2371
- get focusedRow() {
2372
- return this._focusedRow;
2373
- }
2374
- /**
2375
- * Sets the currently focused row and emits a change event.
2376
- *
2377
- * @param v - The row data to be set as focused.
2378
- */
2379
- set focusedRow(v) {
2380
- this._focusedRow = v;
2381
- this.focusedRowChange.emit(v);
2382
- }
2383
- trackByIdx(i) {
2384
- return i;
2385
- }
2386
- /**
2387
- * @ignore
2388
- */
2389
- ngOnInit() {
2390
- super.ngOnInit();
2391
- this.listDataSource = new AXListDataSource({
2392
- source: this.dataSource,
2393
- });
2394
- this.listDataSource.source.onLoadingChanged.subscribe((data) => {
2395
- this.isLoading.set(data);
2396
- });
2397
- this.listDataSource.source.onChanged.subscribe((data) => {
2398
- this.totalRows = data.totalCount;
2399
- this.hasItems = data.totalCount > 0;
2400
- setTimeout(() => {
2401
- this.render();
2402
- }, 100);
2403
- });
2404
- //
2405
- this.clickSubject
2406
- .pipe(buffer(this.clickSubject.pipe(debounceTime(250))), filter((clickArray) => clickArray.length === 2))
2407
- .subscribe((clickArray) => {
2408
- this.handleRowDoubleClick(clickArray[0].event, clickArray[0].item);
2409
- });
2410
- }
2411
- /**
2412
- * @ignore
2413
- */
2414
- _handleOnscrolledIndexChange(e) {
2415
- this.lastIndex = e;
2416
- this.onScrolledIndexChanged.emit({
2417
- component: this,
2418
- index: this.lastIndex,
2419
- isUserInteraction: true,
2420
- });
2421
- }
2422
- /**
2423
- * @ignore
2424
- */
2425
- ngDoCheck() {
2426
- //this.copyFixedColumns();
2427
- this.updateHScroll();
2428
- //
2429
- this.updateWidth();
2430
- this.updateHeight();
2431
- //
2432
- this.updateTotalCount();
2433
- }
2434
- /**
2435
- * @ignore
2436
- */
2437
- updateTotalCount() {
2438
- this.startRowIndex = this.lastIndex;
2439
- if (this.startRowIndex < 1)
2440
- this.startRowIndex = 1;
2441
- if (this.startRowIndex > this.totalRows)
2442
- this.startRowIndex = this.totalRows;
2443
- }
2444
- /**
2445
- * @ignore
2446
- */
2447
- updateHeight() {
2448
- this.height = `calc(100% - ${(this.headerContainer?.nativeElement.clientHeight ?? 0) + (this.footerContainer?.nativeElement.clientHeight ?? 0)}px)`;
2449
- }
2450
- /**
2451
- * @ignore
2452
- */
2453
- updateWidth() {
2454
- if (this.columns && this.columns.length) {
2455
- const sumPx = sum(this.columns.toArray().map((c) => (typeof c.width == 'number' ? c.width : Number(c.width.replace('px', '')))));
2456
- this.width = `${Math.max(sumPx, this.getHostElement().clientWidth - 5)}px`;
2457
- }
2458
- }
2459
- /**
2460
- * @ignore
2461
- */
2462
- updateHScroll() {
2463
- this.ngZone.runOutsideAngular(() => {
2464
- if (this.headerContainer) {
2465
- const headerContainer = this.headerContainer.nativeElement;
2466
- const left = this.scrollableContainer.nativeElement.scrollLeft;
2467
- headerContainer.style.transform = `translateX(${-left}px)`;
2468
- }
2469
- });
2470
- }
2471
- /**
2472
- * @ignore
2473
- */
2474
- // Function to copy fixed columns
2475
- copyFixedColumns() {
2476
- const originalRows = Array.from(this.viewport._contentWrapper.nativeElement.querySelectorAll('tr'));
2477
- const fixedColumnTable = this.getHostElement().querySelector('.ax-body-fixed-columns > table > tbody');
2478
- fixedColumnTable.querySelectorAll('tr').forEach((n) => n.remove());
2479
- if (isPlatformBrowser(this.platformID)) {
2480
- for (const row of originalRows) {
2481
- const fixedCells = Array.from(row.querySelectorAll('[data-fixed="start"]'));
2482
- const fixedRow = this.document.createElement('tr');
2483
- for (const cell of fixedCells) {
2484
- const clonedCell = cell.cloneNode(true);
2485
- fixedRow.appendChild(clonedCell);
2486
- }
2487
- fixedColumnTable.appendChild(fixedRow);
2488
- }
2489
- }
2490
- const scrollTop = this.getHostElement().querySelector('.cdk-virtual-scrollable').scrollTop;
2491
- fixedColumnTable.style.transform = `translateY(${-scrollTop}px)`;
2492
- }
2493
- /**
2494
- * Updates the viewport by checking its size and scrolling to the last index.
2495
- * Marks the component for change detection.
2496
- * @ignore
2497
- */
2498
- render() {
2499
- this.viewport.checkViewportSize();
2500
- this.viewport.scrollToIndex(this.lastIndex);
2501
- this.cdr.markForCheck();
2502
- }
2503
- /**
2504
- * Resets the index to zero and refreshes the data source.
2505
- * @ignore
2506
- */
2507
- refresh() {
2508
- this.lastIndex = 0;
2509
- this.listDataSource.refresh();
2510
- }
2511
- /**
2512
- * @ignore
2513
- */
2514
- handleRowClick(event, item) {
2515
- this.handleRowSingleClick(event, item);
2516
- this.clickSubject.next({ event, item });
2517
- }
2518
- /**
2519
- * @ignore
2520
- */
2521
- handleRowSingleClick(event, item) {
2522
- if (this.focusedRow == item) {
2523
- this.focusedRow = null;
2524
- }
2525
- else {
2526
- this.focusedRow = item;
2527
- }
2528
- //
2529
- this.onRowClick.emit({
2530
- component: this,
2531
- data: item,
2532
- isUserInteraction: true,
2533
- });
2534
- }
2535
- /**
2536
- * @ignore
2537
- */
2538
- handleRowDoubleClick(e, item) {
2539
- this.focusedRow = item;
2540
- //
2541
- this.onRowDbClick.emit({
2542
- component: this,
2543
- data: item,
2544
- isUserInteraction: true,
2545
- });
2546
- }
2547
- /**
2548
- * Handles column header clicks to toggle sorting on the column.
2549
- *
2550
- * @param e - The mouse event triggered by the click.
2551
- * @param column - The column that was clicked.
2552
- * @ignore
2553
- */
2554
- handleColumnClick(e, column) {
2555
- if (column instanceof AXDataTableTextColumnComponent) {
2556
- const sort = this.dataSource.query.sort.find((c) => c.field == column.dataField);
2557
- if (!sort) {
2558
- this.dataSource.query.sort.push({
2559
- field: column.dataField,
2560
- dir: 'asc',
2561
- });
2562
- }
2563
- else {
2564
- if (sort.dir == 'asc') {
2565
- sort.dir = 'desc';
2566
- }
2567
- else {
2568
- this.dataSource.query.sort = this.dataSource.query.sort.filter((c) => c != sort);
2569
- }
2570
- }
2571
- this.refresh();
2572
- }
2573
- }
2574
- /**
2575
- * @ignore
2576
- */
2577
- getSort(column) {
2578
- if (column instanceof AXDataTableTextColumnComponent) {
2579
- const sort = this.dataSource.query.sort.find((c) => c.field == column.dataField);
2580
- return sort ? (sort.dir == 'asc' ? 'ax-icon-arrow-long-down' : 'ax-icon-arrow-long-up') : undefined;
2581
- }
2582
- return undefined;
2583
- }
2584
- /**
2585
- * @ignore
2586
- */
2587
- _handleOnScroll() {
2588
- this.updateHScroll();
2589
- }
2590
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXInfiniteScrollDataTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2591
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: AXInfiniteScrollDataTableComponent, isStandalone: true, selector: "ax-infinite-scroll-data-table", inputs: { dataSource: "dataSource", rowTemplate: "rowTemplate", emptyTemplate: "emptyTemplate", showHeader: "showHeader", fetchDataMode: "fetchDataMode", loading: "loading", focusedRow: "focusedRow", itemHeight: "itemHeight" }, outputs: { selectedRowsChange: "selectedRowsChange", onPageChanged: "onPageChanged", onRowClick: "onRowClick", onRowDbClick: "onRowDbClick", focusedRowChange: "focusedRowChange", onScrolledIndexChanged: "onScrolledIndexChanged" }, providers: [
2592
- { provide: AXPagedComponent, useExisting: AXInfiniteScrollDataTableComponent },
2593
- {
2594
- provide: AXBaseDataTable,
2595
- useExisting: AXInfiniteScrollDataTableComponent,
2596
- },
2597
- { provide: AXComponent, useExisting: AXInfiniteScrollDataTableComponent },
2598
- ], queries: [{ propertyName: "columns", predicate: AXDataTableColumnComponent }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, static: true }, { propertyName: "headerContainer", first: true, predicate: ["headerContainer"], descendants: true }, { propertyName: "footerContainer", first: true, predicate: ["footerContainer"], descendants: true }, { propertyName: "scrollableContainer", first: true, predicate: ["scrolling"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"> </ng-content>\n<!------------------- Header contents ------------------->\n@if (showHeader) {\n <div class=\"ax-header-content\">\n <div class=\"ax-header-columns\">\n <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n <thead>\n <tr>\n @for (c of notFixedColumn(); track c.name) {\n <th\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container [ngTemplateOutlet]=\"c.renderHeaderTemplate\"></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n <!-- @if(c.allowResizing)\n {\n <div class=\"ax-resize-handle\" [ax-table-column-resizble]=\"c\"></div>\n } -->\n </th>\n }\n <th></th>\n </tr>\n </thead>\n </table>\n </div>\n </div>\n}\n\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n <div class=\"ax-body-columns\">\n <div cdkVirtualScrollingElement #scrolling [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll()\">\n <cdk-virtual-scroll-viewport\n [itemSize]=\"itemHeight\"\n [style.--item-height]=\"itemHeight + 'px'\"\n (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n >\n <table tabindex=\"0\" class=\"ax-table-body ax-relative\" [style.width]=\"width\">\n <colgroup>\n @for (c of notFixedColumn(); track c.name) {\n <col [style.width]=\"c.width\" />\n }\n <col />\n </colgroup>\n <tbody>\n <ng-container\n *cdkVirtualFor=\"\n let item of listDataSource;\n templateCacheSize: 100;\n let i = index;\n trackBy: trackByIdx;\n let rIndex = index\n \"\n >\n <!------------------- custom row template------------------->\n @if (rowTemplate !== null) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: item, rowIndex: rIndex } }\"\n >\n </ng-container>\n } @else {\n <!------------------- normal row template------------------->\n <tr\n [class.ax-state-focused]=\"focusedRow && item === focusedRow\"\n [attr.data-index]=\"rIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(item)\"\n (click)=\"handleRowClick($event, item)\"\n >\n <!------------------- start fixed column ------------------->\n\n <!------------------- Not fixed column ------------------->\n @for (c of notFixedColumn(); track c.name) {\n <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n @if (item && !isLoading()) {\n <!------------------- render cell ------------------->\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: item, rowIndex: rIndex } }\"\n ></ng-container>\n } @else {\n <!------------------- render loading ------------------->\n @if (c.loadingEnabled && loading) {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n </td>\n }\n <td></td>\n </tr>\n }\n </ng-container>\n </tbody>\n </table>\n </cdk-virtual-scroll-viewport>\n </div>\n </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n <div class=\"ax-table-info\">\n <div>Showing {{ startRowIndex }} of {{ totalRows }} items</div>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </div>\n <ng-content select=\"ax-footer\"> </ng-content>\n</div>\n", styles: ["ax-infinite-scroll-data-table{display:block;height:100%;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));font-size:.875rem;line-height:1.25rem}ax-infinite-scroll-data-table table{table-layout:fixed}ax-infinite-scroll-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns{height:100%}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-sys-border-radius);border-start-start-radius:var(--ax-sys-border-radius)}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-surface));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{background-color:rgba(var(--ax-sys-color-secondary-200))}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-resize-handle{position:absolute;right:0;top:0;bottom:0;width:4px;cursor:col-resize;background:transparent}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-resize-handle:hover{background-color:rgba(var(--ax-sys-color-secondary-300))}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-infinite-scroll-data-table .ax-body-content{position:relative}ax-infinite-scroll-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns{height:100%}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:nth-child(2n) td{background-color:rgba(var(--ax-sys-color-surface))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:nth-child(2n) ax-skeleton{width:25%}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-200))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-200));color:rgba(var(--ax-sys-color-on-primary-tint))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-300))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-300));color:rgba(var(--ax-sys-color-on-primary-tint))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-400));color:rgba(var(--ax-sys-color-on-primary))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-surface));padding:.5rem 1rem;vertical-align:middle}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-sys-color-surface));text-align:center}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button.ax-state-disabled{position:relative!important;cursor:not-allowed!important;opacity:.5!important}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;transform:translateY(-50%);align-items:center;justify-content:center}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-sys-border-radius);border-style:none;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:transparent;padding:.25rem;color:rgba(var(--ax-color-ghost-fore))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover:not(ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover.ax-state-selected,ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:active{opacity:1}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-infinite-scroll-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:.5rem .875rem}ax-infinite-scroll-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2599
- }
2600
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXInfiniteScrollDataTableComponent, decorators: [{
2601
- type: Component,
2602
- args: [{ selector: 'ax-infinite-scroll-data-table', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
2603
- { provide: AXPagedComponent, useExisting: AXInfiniteScrollDataTableComponent },
2604
- {
2605
- provide: AXBaseDataTable,
2606
- useExisting: AXInfiniteScrollDataTableComponent,
2607
- },
2608
- { provide: AXComponent, useExisting: AXInfiniteScrollDataTableComponent },
2609
- ], outputs: ['selectedRowsChange'], inputs: ['dataSource'], imports: [
2610
- NgTemplateOutlet,
2611
- AXDecoratorIconComponent,
2612
- CdkVirtualScrollableElement,
2613
- CdkVirtualScrollViewport,
2614
- CdkFixedSizeVirtualScroll,
2615
- CdkVirtualForOf,
2616
- AXSkeletonComponent,
2617
- AXButtonComponent,
2618
- ], template: "<ng-content select=\"ax-header\"> </ng-content>\n<!------------------- Header contents ------------------->\n@if (showHeader) {\n <div class=\"ax-header-content\">\n <div class=\"ax-header-columns\">\n <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n <thead>\n <tr>\n @for (c of notFixedColumn(); track c.name) {\n <th\n [class.ax-interactive]=\"c.allowSorting\"\n (click)=\"c.allowSorting ? handleColumnClick($event, c) : null\"\n [style.width]=\"c.width\"\n >\n <div class=\"ax-caption\">\n <ng-container [ngTemplateOutlet]=\"c.renderHeaderTemplate\"></ng-container>\n @if (getSort(c)) {\n <ax-icon icon=\"ax-icon {{ getSort(c) }}\"></ax-icon>\n }\n </div>\n <!-- @if(c.allowResizing)\n {\n <div class=\"ax-resize-handle\" [ax-table-column-resizble]=\"c\"></div>\n } -->\n </th>\n }\n <th></th>\n </tr>\n </thead>\n </table>\n </div>\n </div>\n}\n\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n <div class=\"ax-body-columns\">\n <div cdkVirtualScrollingElement #scrolling [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll()\">\n <cdk-virtual-scroll-viewport\n [itemSize]=\"itemHeight\"\n [style.--item-height]=\"itemHeight + 'px'\"\n (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n >\n <table tabindex=\"0\" class=\"ax-table-body ax-relative\" [style.width]=\"width\">\n <colgroup>\n @for (c of notFixedColumn(); track c.name) {\n <col [style.width]=\"c.width\" />\n }\n <col />\n </colgroup>\n <tbody>\n <ng-container\n *cdkVirtualFor=\"\n let item of listDataSource;\n templateCacheSize: 100;\n let i = index;\n trackBy: trackByIdx;\n let rIndex = index\n \"\n >\n <!------------------- custom row template------------------->\n @if (rowTemplate !== null) {\n <ng-container\n [ngTemplateOutlet]=\"rowTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: item, rowIndex: rIndex } }\"\n >\n </ng-container>\n } @else {\n <!------------------- normal row template------------------->\n <tr\n [class.ax-state-focused]=\"focusedRow && item === focusedRow\"\n [attr.data-index]=\"rIndex\"\n [class.ax-state-selected]=\"selectedRows.includes(item)\"\n (click)=\"handleRowClick($event, item)\"\n >\n <!------------------- start fixed column ------------------->\n\n <!------------------- Not fixed column ------------------->\n @for (c of notFixedColumn(); track c.name) {\n <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n @if (item && !isLoading()) {\n <!------------------- render cell ------------------->\n <ng-container\n [ngTemplateOutlet]=\"c.renderCellTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: { data: item, rowIndex: rIndex } }\"\n ></ng-container>\n } @else {\n <!------------------- render loading ------------------->\n @if (c.loadingEnabled && loading) {\n <ax-skeleton [animated]=\"loading.animation\"></ax-skeleton>\n }\n }\n </td>\n }\n <td></td>\n </tr>\n }\n </ng-container>\n </tbody>\n </table>\n </cdk-virtual-scroll-viewport>\n </div>\n </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n <div class=\"ax-table-info\">\n <div>Showing {{ startRowIndex }} of {{ totalRows }} items</div>\n <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n </ax-button>\n </div>\n <ng-content select=\"ax-footer\"> </ng-content>\n</div>\n", styles: ["ax-infinite-scroll-data-table{display:block;height:100%;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));font-size:.875rem;line-height:1.25rem}ax-infinite-scroll-data-table table{table-layout:fixed}ax-infinite-scroll-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-infinite-scroll-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns{height:100%}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-sys-border-radius);border-start-start-radius:var(--ax-sys-border-radius)}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-surface));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase;position:relative}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{background-color:rgba(var(--ax-sys-color-secondary-200))}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-resize-handle{position:absolute;right:0;top:0;bottom:0;width:4px;cursor:col-resize;background:transparent}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-resize-handle:hover{background-color:rgba(var(--ax-sys-color-secondary-300))}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-infinite-scroll-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-infinite-scroll-data-table .ax-body-content{position:relative}ax-infinite-scroll-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns{height:100%}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:nth-child(2n) td{background-color:rgba(var(--ax-sys-color-surface))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:nth-child(2n) ax-skeleton{width:25%}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-200))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-200));color:rgba(var(--ax-sys-color-on-primary-tint))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-300))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-300));color:rgba(var(--ax-sys-color-on-primary-tint))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-sys-color-primary-400));color:rgba(var(--ax-sys-color-on-primary))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-surface));padding:.5rem 1rem;vertical-align:middle}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-sys-color-surface));text-align:center}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button.ax-state-disabled{position:relative!important;cursor:not-allowed!important;opacity:.5!important}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;transform:translateY(-50%);align-items:center;justify-content:center}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-sys-border-radius);border-style:none;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:transparent;padding:.25rem;color:rgba(var(--ax-color-ghost-fore))}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover:not(ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover.ax-state-selected,ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button:active{opacity:1}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td.ax-command-column button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-infinite-scroll-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-infinite-scroll-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:.5rem .875rem}ax-infinite-scroll-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"] }]
2619
- }], propDecorators: { columns: [{
2620
- type: ContentChildren,
2621
- args: [AXDataTableColumnComponent]
2622
- }], onPageChanged: [{
2623
- type: Output
2624
- }], onRowClick: [{
2625
- type: Output
2626
- }], onRowDbClick: [{
2627
- type: Output
2628
- }], rowTemplate: [{
2629
- type: Input
2630
- }], emptyTemplate: [{
2631
- type: Input
2632
- }], showHeader: [{
2633
- type: Input
2634
- }], fetchDataMode: [{
2635
- type: Input
2636
- }], loading: [{
2637
- type: Input
2638
- }], focusedRowChange: [{
2639
- type: Output
2640
- }], focusedRow: [{
2641
- type: Input
2642
- }], itemHeight: [{
2643
- type: Input
2644
- }], viewport: [{
2645
- type: ViewChild,
2646
- args: [CdkVirtualScrollViewport, { static: true }]
2647
- }], onScrolledIndexChanged: [{
2648
- type: Output
2649
- }], headerContainer: [{
2650
- type: ViewChild,
2651
- args: ['headerContainer']
2652
- }], footerContainer: [{
2653
- type: ViewChild,
2654
- args: ['footerContainer']
2655
- }], scrollableContainer: [{
2656
- type: ViewChild,
2657
- args: ['scrolling', { static: true }]
2658
- }] } });
2659
-
2660
2228
  const COMPONENT = [
2661
- AXInfiniteScrollDataTableComponent,
2662
2229
  AXDataTableComponent,
2663
2230
  AXDataTableTextColumnComponent,
2664
2231
  AXRowIndexColumnComponent,
@@ -2688,8 +2255,8 @@ const MODULES = [
2688
2255
  CdkDragHandle,
2689
2256
  ];
2690
2257
  class AXDataTableModule {
2691
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
2692
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableModule, imports: [CommonModule,
2258
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
2259
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableModule, imports: [CommonModule,
2693
2260
  AXCommonModule,
2694
2261
  ScrollingModule,
2695
2262
  AXTranslationModule,
@@ -2705,16 +2272,14 @@ class AXDataTableModule {
2705
2272
  CdkDropList,
2706
2273
  CdkDrag,
2707
2274
  CdkDragPlaceholder,
2708
- CdkDragHandle, AXInfiniteScrollDataTableComponent,
2709
- AXDataTableComponent,
2275
+ CdkDragHandle, AXDataTableComponent,
2710
2276
  AXDataTableTextColumnComponent,
2711
2277
  AXRowIndexColumnComponent,
2712
2278
  AXRowSelectColumnComponent,
2713
2279
  AXRowExpandColumnComponent,
2714
2280
  AXRowCommandColumnComponent,
2715
2281
  AXRowDropdownCommandColumnComponent,
2716
- AXDataTableColumnResizableDirective], exports: [AXInfiniteScrollDataTableComponent,
2717
- AXDataTableComponent,
2282
+ AXDataTableColumnResizableDirective], exports: [AXDataTableComponent,
2718
2283
  AXDataTableTextColumnComponent,
2719
2284
  AXRowIndexColumnComponent,
2720
2285
  AXRowSelectColumnComponent,
@@ -2722,7 +2287,7 @@ class AXDataTableModule {
2722
2287
  AXRowCommandColumnComponent,
2723
2288
  AXRowDropdownCommandColumnComponent,
2724
2289
  AXDataTableColumnResizableDirective] }); }
2725
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableModule, imports: [CommonModule,
2290
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableModule, imports: [CommonModule,
2726
2291
  AXCommonModule,
2727
2292
  ScrollingModule,
2728
2293
  AXTranslationModule,
@@ -2733,13 +2298,12 @@ class AXDataTableModule {
2733
2298
  AXDecoratorModule,
2734
2299
  AXDropdownModule,
2735
2300
  AXFormatModule,
2736
- AXDataPagerModule, AXInfiniteScrollDataTableComponent,
2737
- AXDataTableComponent,
2301
+ AXDataPagerModule, AXDataTableComponent,
2738
2302
  AXRowSelectColumnComponent,
2739
2303
  AXRowCommandColumnComponent,
2740
2304
  AXRowDropdownCommandColumnComponent] }); }
2741
2305
  }
2742
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: AXDataTableModule, decorators: [{
2306
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AXDataTableModule, decorators: [{
2743
2307
  type: NgModule,
2744
2308
  args: [{
2745
2309
  imports: [...MODULES, ...COMPONENT],
@@ -2752,5 +2316,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
2752
2316
  * Generated bundle index. Do not edit.
2753
2317
  */
2754
2318
 
2755
- export { AXBaseDataTable, AXBaseRowCommandColumnComponent, AXDataTableColumnComponent, AXDataTableColumnResizableDirective, AXDataTableComponent, AXDataTableModule, AXDataTableTextColumnComponent, AXInfiniteScrollDataTableComponent, AXRowCommandColumnComponent, AXRowDropdownCommandColumnComponent, AXRowExpandColumnComponent, AXRowIndexColumnComponent, AXRowSelectColumnComponent };
2319
+ export { AXBaseDataTable, AXBaseRowCommandColumnComponent, AXDataTableColumnComponent, AXDataTableColumnResizableDirective, AXDataTableComponent, AXDataTableModule, AXDataTableTextColumnComponent, AXRowCommandColumnComponent, AXRowDropdownCommandColumnComponent, AXRowExpandColumnComponent, AXRowIndexColumnComponent, AXRowSelectColumnComponent };
2756
2320
  //# sourceMappingURL=acorex-components-data-table.mjs.map