@acorex/components 18.4.3 → 18.4.4

package/fesm2022/acorex-components-action-sheet.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXClosbaleComponent, AXComponentCloseEvent, AXFocusableComponent, MXBaseComponent } from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ComponentRef,\n  HostListener,\n  Inject,\n  OnInit,\n  TemplateRef,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetData, AXActionSheetItem } from './action-sheet.class';\n\n@Component({\n  selector: 'ax-action-sheet',\n  templateUrl: './action-sheet.component.html',\n  styleUrls: ['./action-sheet.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: AXClosbaleComponent,\n      useExisting: AXActionSheetComponent,\n    },\n    {\n      provide: AXFocusableComponent,\n      useExisting: AXActionSheetComponent,\n    },\n  ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  protected _selectedPortal: Portal<any>;\n\n  private _componentRef: unknown;\n\n  /**\n   *  @ignore\n   */\n  constructor(\n    @Inject(DIALOG_DATA)\n    protected data: AXActionSheetData,\n    private dialogRef: DialogRef<AXComponentCloseEvent>,\n  ) {\n    super();\n  }\n\n  override ngOnInit(): void {\n    super.ngOnInit();\n    if (this.data.content) {\n      if (this.data.content instanceof TemplateRef) {\n        this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n          $implicit: this.data,\n          ref: this,\n        });\n        this.cdr.markForCheck();\n      } else if (typeof this.data.content === 'function') {\n        this._selectedPortal = new ComponentPortal(this.data.content);\n        this.cdr.markForCheck();\n      }\n    }\n  }\n\n  @HostListener('keydown.escape')\n  protected onKeydownHandler() {\n    const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n    if (this.data.closeButton && focusedOrHasFocused) {\n      this.close(null);\n    }\n  }\n\n  _handleAttched(ref: CdkPortalOutletAttachedRef) {\n    ref = ref as ComponentRef<any>;\n    if (ref.instance) {\n      this._componentRef = ref.instance;\n      Object.assign(this._componentRef, this.data);\n      Object.assign(this._componentRef, { _isPopup: true });\n      if (ref.instance.onClosed) {\n        ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n          this.close(e);\n        });\n      }\n    }\n  }\n\n  onItemClick(item: AXActionSheetItem) {\n    this.close(item);\n    if (item?.onClick) item.onClick();\n  }\n\n  close(e) {\n    this.dialogRef.close({\n      component: this._componentRef,\n      htmlElement: this.getHostElement(),\n      data: e,\n    });\n  }\n}\n","@if (data.header) {\n  <ax-header>\n    <ax-prefix>\n      <ax-title>{{ data.title | translate | async }}</ax-title>\n\n      @if (data.subTitle) {\n        <ax-sub-title>\n          {{ data.subTitle }}\n        </ax-sub-title>\n      }\n    </ax-prefix>\n    @if (data.closeButton) {\n      <ax-suffix>\n        <ax-close-button></ax-close-button>\n      </ax-suffix>\n    }\n  </ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  @for (item of data.items; let i = $index; track i) {\n    <div\n      class=\"ax-action-sheet-item ax-{{ item.color }}\"\n      [class.ax-state-disabled]=\"item.disabled\"\n      [tabindex]=\"i\"\n      (click)=\"onItemClick(item)\"\n    >\n      @if (item.icon) {\n        <span class=\"item-icon\" [class]=\"item.icon\"></span>\n      }\n      <span class=\"item-text\">{{ item.text | translate | async }}</span>\n    </div>\n  }\n</div>\n","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { BehaviorSubject, Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n  close: (e?) => void;\n  closed: Subject<any>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n  private dialog: Dialog = inject(Dialog);\n\n  open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n    const defaultConfig: AXActionSheetConfig = {\n      title: 'action-sheet.title',\n      closeButton: true,\n      closeOnBackdropClick: true,\n      header: true,\n    };\n    config = Object.assign(defaultConfig, config);\n\n    const dialogRef = this.dialog.open(AXActionSheetComponent, {\n      data: config,\n      autoFocus: 'first-tabbable',\n      restoreFocus: true,\n      role: 'dialog',\n      ariaModal: true,\n      closeOnNavigation: true,\n      closeOnDestroy: true,\n      hasBackdrop: true,\n      panelClass: ['ax-actionsheet-panel'],\n      disableClose: config.closeOnBackdropClick ? false : true,\n      positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n    });\n    const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n      const closed = new BehaviorSubject<any>(null);\n      const axDialogRef: AXActionSheetDialogRef = {\n        close: (e) => {\n          dialogRef.close(e);\n        },\n        closed,\n      };\n      dialogRef.closed.subscribe((d: any) => {\n        closed.next({ data: d.data.data });\n        if (resolve) {\n          resolve(axDialogRef);\n        }\n      });\n    });\n    return promise;\n  }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AsyncPipe } from '@angular/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\n\nconst MODULES = [\n  AXCommonModule,\n  DragDropModule,\n  A11yModule,\n  AXButtonModule,\n  PortalModule,\n  AXDecoratorModule,\n  AXTranslationModule,\n  DialogModule,\n  AsyncPipe,\n];\n\n@NgModule({\n  declarations: [AXActionSheetComponent],\n  imports: [...MODULES],\n  exports: [AXActionSheetComponent],\n  providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXClosbaleComponent, AXComponentCloseEvent, AXFocusableComponent, MXBaseComponent } from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ComponentRef,\n  HostListener,\n  Inject,\n  OnInit,\n  TemplateRef,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetConfig, AXActionSheetItem } from './action-sheet.class';\n\n@Component({\n  selector: 'ax-action-sheet',\n  templateUrl: './action-sheet.component.html',\n  styleUrls: ['./action-sheet.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: AXClosbaleComponent,\n      useExisting: AXActionSheetComponent,\n    },\n    {\n      provide: AXFocusableComponent,\n      useExisting: AXActionSheetComponent,\n    },\n  ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  protected _selectedPortal: Portal<any>;\n\n  private _componentRef: unknown;\n\n  /**\n   *  @ignore\n   */\n  constructor(\n    @Inject(DIALOG_DATA)\n    protected data: AXActionSheetConfig,\n    private dialogRef: DialogRef<AXComponentCloseEvent>,\n  ) {\n    super();\n  }\n\n  override ngOnInit(): void {\n    super.ngOnInit();\n    if (this.data.content) {\n      if (this.data.content instanceof TemplateRef) {\n        this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n          $implicit: this.data,\n          ref: this,\n        });\n        this.cdr.markForCheck();\n      } else if (typeof this.data.content === 'function') {\n        this._selectedPortal = new ComponentPortal(this.data.content);\n        this.cdr.markForCheck();\n      }\n    }\n  }\n\n  @HostListener('keydown.escape')\n  protected onKeydownHandler() {\n    const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n    if (this.data.closeButton && focusedOrHasFocused) {\n      this.close(null);\n    }\n  }\n\n  _handleAttched(ref: CdkPortalOutletAttachedRef) {\n    ref = ref as ComponentRef<any>;\n    if (ref.instance) {\n      this._componentRef = ref.instance;\n      Object.assign(this._componentRef, this.data);\n      Object.assign(this._componentRef, { _isPopup: true });\n      if (ref.instance.onClosed) {\n        ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n          this.close(e);\n        });\n      }\n    }\n  }\n\n  onItemClick(item: AXActionSheetItem) {\n    this.close(item);\n    if (item?.onClick) item.onClick();\n  }\n\n  close(e) {\n    this.dialogRef.close({\n      component: this._componentRef,\n      htmlElement: this.getHostElement(),\n      data: e,\n    });\n  }\n}\n","@if (data.header) {\n  <ax-header>\n    <ax-prefix>\n      <ax-title>{{ data.title | translate | async }}</ax-title>\n\n      @if (data.subTitle) {\n        <ax-sub-title>\n          {{ data.subTitle }}\n        </ax-sub-title>\n      }\n    </ax-prefix>\n    @if (data.closeButton) {\n      <ax-suffix>\n        <ax-close-button></ax-close-button>\n      </ax-suffix>\n    }\n  </ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n  @for (item of data.items; let i = $index; track i) {\n    <div\n      class=\"ax-action-sheet-item ax-{{ item.color }}\"\n      [class.ax-state-disabled]=\"item.disabled\"\n      [tabindex]=\"i\"\n      (click)=\"onItemClick(item)\"\n    >\n      @if (item.icon) {\n        <span class=\"item-icon\" [class]=\"item.icon\"></span>\n      }\n      <span class=\"item-text\">{{ item.text | translate | async }}</span>\n    </div>\n  }\n</div>\n","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { BehaviorSubject, Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n  close: (e?) => void;\n  closed: Subject<any>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n  private dialog: Dialog = inject(Dialog);\n\n  open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n    const defaultConfig: AXActionSheetConfig = {\n      title: 'action-sheet.title',\n      closeButton: true,\n      closeOnBackdropClick: true,\n      header: true,\n    };\n    config = Object.assign(defaultConfig, config);\n\n    const dialogRef = this.dialog.open(AXActionSheetComponent, {\n      data: config,\n      autoFocus: 'first-tabbable',\n      restoreFocus: true,\n      role: 'dialog',\n      ariaModal: true,\n      closeOnNavigation: true,\n      closeOnDestroy: true,\n      hasBackdrop: true,\n      panelClass: ['ax-actionsheet-panel'],\n      disableClose: config.closeOnBackdropClick ? false : true,\n      positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n    });\n    const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n      const closed = new BehaviorSubject<any>(null);\n      const axDialogRef: AXActionSheetDialogRef = {\n        close: (e) => {\n          dialogRef.close(e);\n        },\n        closed,\n      };\n      dialogRef.closed.subscribe((d: any) => {\n        closed.next({ data: d.data.data });\n        if (resolve) {\n          resolve(axDialogRef);\n        }\n      });\n    });\n    return promise;\n  }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AsyncPipe } from '@angular/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\n\nconst MODULES = [\n  AXCommonModule,\n  DragDropModule,\n  A11yModule,\n  AXButtonModule,\n  PortalModule,\n  AXDecoratorModule,\n  AXTranslationModule,\n  DialogModule,\n  AsyncPipe,\n];\n\n@NgModule({\n  declarations: [AXActionSheetComponent],\n  imports: [...MODULES],\n  exports: [AXActionSheetComponent],\n  providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-data-table.mjs

@@ -2,6 +2,7 @@ import * as i5$1 from '@acorex/components/common';
 import { MXBaseComponent, convertArrayToDataSource, AXListDataSource, AXPagedComponent, AXCommonModule, AXRippleDirective } from '@acorex/components/common';
 import * as i0 from '@angular/core';
 import { EventEmitter, signal, Injectable, Input, Output, Directive, HostListener, inject, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, ChangeDetectorRef, NgZone, computed, ContentChildren, NgModule } from '@angular/core';
+import _ from 'lodash';
 import { isBrowser } from '@acorex/core/platform';
 import { Subject, debounceTime, buffer, filter } from 'rxjs';
 import { __decorate, __metadata } from 'tslib';
@@ -46,7 +47,7 @@ class AXBaseDataTable extends MXBaseComponent {
         this.selectedRowsChange.emit(v);
     }
     selectRows(...rows) {
-        this.selectedRows = [...this.selectedRows, ...rows];
+        this.selectedRows = _.uniq(this.selectedRows.concat(rows));
     }
     unSelectRows(...rows) {
         this.selectedRows = this.selectedRows.filter((c) => !rows.includes(c));
@@ -836,15 +837,19 @@ class AXDataTableComponent extends AXBaseDataTable {
     }
     onPageChanged(event) {
         if (event.isUserInteraction) {
-            if (event.page - 1 != this.page()) {
-                this.page.set(event.page - 1);
-                this.displayedRows.set(new Array(this.dataSource.pageSize));
-                this.dataSource.setPage(event.page - 1);
-            }
-            else if (event.take != this.pageSize()) {
-                this.pageSize.set(event.take);
-                this.displayedRows.set(new Array(this.dataSource.pageSize));
-                this.dataSource.setPageSize(event.take);
+            const pageChanged = event.page - 1 != this.page();
+            const pageSizeChanged = event.take != this.pageSize();
+            if (pageChanged || pageSizeChanged) {
+                if (pageChanged) {
+                    this.page.set(event.page - 1);
+                }
+                if (pageSizeChanged) {
+                    this.pageSize.set(event.take);
+                }
+                // Update displayed rows and data source
+                this.displayedRows.set(new Array(this.pageSize()));
+                this.dataSource.setPage(this.page());
+                this.dataSource.setPageSize(this.pageSize());
             }
         }
     }
@@ -960,7 +965,7 @@ class AXDataTableComponent extends AXBaseDataTable {
                 useExisting: AXDataTableComponent,
             },
             AXUnsubscriber,
-        ], queries: [{ 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@if (!displayedRows().length) {\n  <div class=\"ax-data-table-empty-data\">\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    } @else {\n      <span>No Record Found!</span>\n    }\n  </div>\n}\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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      @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n        @if (rowTemplate) {\n          <ng-container *ngTemplateOutlet=\"rowTemplate; context: { $implicit: { data: row, rowIndex: rowIndex } }\"> </ng-container>\n        } @else {\n          <tr\n            [class.ax-state-focused]=\"focusedRow && row === focusedRow\"\n            [attr.data-index]=\"rowIndex\"\n            [class.ax-state-selected]=\"selectedRows.includes(row)\"\n            style.height=\"{{ itemHeight }}px\"\n            style.max-height=\"{{ itemHeight }}px\"\n            (click)=\"handleRowClick($event, 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.isLast]=\"c['isLastFixedColumn']\"\n                [style.--sticky-start]=\"c['stickyStart']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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></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.isFirst]=\"c['isFirstFixedColumn']\"\n                [style.--sticky-end]=\"c['stickyEnd']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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        }\n      }\n\n      <tr class=\"empty-row\"></tr>\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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    <ax-data-pager\n      #dataPager\n      [displayMode]=\"'custom'\"\n      (onChanged)=\"onPageChanged($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()\">\n          <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-data-pager>\n  </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: [".ax-dark ax-data-table thead th.ax-interactive:hover{background-color:rgba(var(--ax-color-neutral-500))!important}.ax-dark ax-data-table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}.ax-dark ax-data-table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:.875rem;line-height:1.25rem;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));position:relative;min-height:inherit}ax-data-table .ax-data-table-empty-data{position:absolute;top:calc(50% - 40px);width:100%;color:rgb(var(--ax-color-neutral-500));text-align:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-rounded-border-default)}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-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}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-color-primary-300))}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;background-color:rgba(var(--ax-color-on-surface));border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}@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-color-surface));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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}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-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:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-fore))}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-color-border-default));background-color:rgba(var(--ax-color-surface));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-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-color-on-surface));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 button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-rounded-border-default);border-style:none;border-color:rgba(var(--ax-color-border-default));background-color:transparent;padding:.25rem;line-height:1;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column 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}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:0;background-color:rgba(var(--ax-color-on-surface));border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default));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}}.ax-data-table-head-cell{border-bottom-width:1px;border-inline-end-width:1px;box-shadow:0 5px 5px -3px rgba(var(--ax-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i4$1.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i6.AXDataPagerComponent, selector: "ax-data-pager", inputs: ["value", "name", "disabled", "readonly", "isLoading", "size", "total", "displayMode"], outputs: ["valueChange", "onValueChanged", "disabledChange", "readonlyChange", "displayModeChange", "onChanged"] }, { kind: "component", type: i6.AXDataPagerNextButtonsComponent, selector: "ax-data-pager-next-buttons" }, { kind: "component", type: i6.AXDataPagerPrevButtonsComponent, selector: "ax-data-pager-prev-buttons" }, { kind: "component", type: i6.AXDataPagerPageSizesComponent, selector: "ax-data-pager-page-sizes", inputs: ["sizes"] }, { kind: "component", type: i6.AXDataPagerNumericSelectorComponent, selector: "ax-data-pager-numeric-selector" }, { kind: "component", type: i6.AXDataPagerInputSelectorComponent, selector: "ax-data-pager-input-selector" }, { kind: "component", type: i6.AXDataPagerInfoComponent, selector: "ax-data-pager-info", inputs: ["text"] }, { kind: "directive", type: i7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ 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@if (!displayedRows().length) {\n  <div class=\"ax-data-table-empty-data\">\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    } @else {\n      <span>No Record Found!</span>\n    }\n  </div>\n}\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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      @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n        @if (rowTemplate) {\n          <ng-container *ngTemplateOutlet=\"rowTemplate; context: { $implicit: { data: row, rowIndex: rowIndex } }\"> </ng-container>\n        } @else {\n          <tr\n            [class.ax-state-focused]=\"focusedRow && row === focusedRow\"\n            [attr.data-index]=\"rowIndex\"\n            [class.ax-state-selected]=\"selectedRows.includes(row)\"\n            style.height=\"{{ itemHeight }}px\"\n            style.max-height=\"{{ itemHeight }}px\"\n            (click)=\"handleRowClick($event, 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.isLast]=\"c['isLastFixedColumn']\"\n                [style.--sticky-start]=\"c['stickyStart']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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></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.isFirst]=\"c['isFirstFixedColumn']\"\n                [style.--sticky-end]=\"c['stickyEnd']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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        }\n      }\n\n      <tr class=\"empty-row\"></tr>\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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    <ax-data-pager\n      #dataPager\n      [displayMode]=\"'custom'\"\n      (onChanged)=\"onPageChanged($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()\">\n          <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-data-pager>\n  </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: [".ax-dark ax-data-table thead th.ax-interactive:hover{background-color:rgba(var(--ax-color-neutral-500))!important}.ax-dark ax-data-table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}.ax-dark ax-data-table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:.875rem;line-height:1.25rem;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));position:relative;min-height:inherit}ax-data-table .ax-data-table-empty-data{position:absolute;top:calc(50% - 40px);width:100%;color:rgb(var(--ax-color-neutral-500));text-align:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-rounded-border-default)}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-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}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-color-primary-300))}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:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}@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-color-surface));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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}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-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:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-fore))}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-color-border-default));background-color:rgba(var(--ax-color-surface));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-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-color-on-surface));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 button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-rounded-border-default);border-style:none;border-color:rgba(var(--ax-color-border-default));background-color:transparent;padding:.25rem;line-height:1;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column 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}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:0;border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default));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-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i4$1.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i6.AXDataPagerComponent, selector: "ax-data-pager", inputs: ["value", "name", "disabled", "readonly", "isLoading", "size", "total", "displayMode"], outputs: ["valueChange", "onValueChanged", "disabledChange", "readonlyChange", "displayModeChange", "onChanged"] }, { kind: "component", type: i6.AXDataPagerNextButtonsComponent, selector: "ax-data-pager-next-buttons" }, { kind: "component", type: i6.AXDataPagerPrevButtonsComponent, selector: "ax-data-pager-prev-buttons" }, { kind: "component", type: i6.AXDataPagerPageSizesComponent, selector: "ax-data-pager-page-sizes", inputs: ["sizes"] }, { kind: "component", type: i6.AXDataPagerNumericSelectorComponent, selector: "ax-data-pager-numeric-selector" }, { kind: "component", type: i6.AXDataPagerInputSelectorComponent, selector: "ax-data-pager-input-selector" }, { kind: "component", type: i6.AXDataPagerInfoComponent, selector: "ax-data-pager-info", inputs: ["text"] }, { kind: "directive", type: i7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXDataTableComponent, decorators: [{
             type: Component,
@@ -970,7 +975,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
                             useExisting: AXDataTableComponent,
                         },
                         AXUnsubscriber,
-                    ], template: "<ng-content select=\"ax-header\"> </ng-content>\n@if (!displayedRows().length) {\n  <div class=\"ax-data-table-empty-data\">\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    } @else {\n      <span>No Record Found!</span>\n    }\n  </div>\n}\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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      @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n        @if (rowTemplate) {\n          <ng-container *ngTemplateOutlet=\"rowTemplate; context: { $implicit: { data: row, rowIndex: rowIndex } }\"> </ng-container>\n        } @else {\n          <tr\n            [class.ax-state-focused]=\"focusedRow && row === focusedRow\"\n            [attr.data-index]=\"rowIndex\"\n            [class.ax-state-selected]=\"selectedRows.includes(row)\"\n            style.height=\"{{ itemHeight }}px\"\n            style.max-height=\"{{ itemHeight }}px\"\n            (click)=\"handleRowClick($event, 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.isLast]=\"c['isLastFixedColumn']\"\n                [style.--sticky-start]=\"c['stickyStart']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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></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.isFirst]=\"c['isFirstFixedColumn']\"\n                [style.--sticky-end]=\"c['stickyEnd']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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        }\n      }\n\n      <tr class=\"empty-row\"></tr>\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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    <ax-data-pager\n      #dataPager\n      [displayMode]=\"'custom'\"\n      (onChanged)=\"onPageChanged($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()\">\n          <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-data-pager>\n  </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: [".ax-dark ax-data-table thead th.ax-interactive:hover{background-color:rgba(var(--ax-color-neutral-500))!important}.ax-dark ax-data-table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}.ax-dark ax-data-table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:.875rem;line-height:1.25rem;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));position:relative;min-height:inherit}ax-data-table .ax-data-table-empty-data{position:absolute;top:calc(50% - 40px);width:100%;color:rgb(var(--ax-color-neutral-500));text-align:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-rounded-border-default)}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-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}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-color-primary-300))}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;background-color:rgba(var(--ax-color-on-surface));border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}@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-color-surface));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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}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-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:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-fore))}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-color-border-default));background-color:rgba(var(--ax-color-surface));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-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-color-on-surface));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 button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-rounded-border-default);border-style:none;border-color:rgba(var(--ax-color-border-default));background-color:transparent;padding:.25rem;line-height:1;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column 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}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:0;background-color:rgba(var(--ax-color-on-surface));border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default));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}}.ax-data-table-head-cell{border-bottom-width:1px;border-inline-end-width:1px;box-shadow:0 5px 5px -3px rgba(var(--ax-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}\n"] }]
+                    ], template: "<ng-content select=\"ax-header\"> </ng-content>\n@if (!displayedRows().length) {\n  <div class=\"ax-data-table-empty-data\">\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    } @else {\n      <span>No Record Found!</span>\n    }\n  </div>\n}\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderHeaderTemplate; context: { $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      @for (row of displayedRows(); let rowIndex = $index; track rowIndex) {\n        @if (rowTemplate) {\n          <ng-container *ngTemplateOutlet=\"rowTemplate; context: { $implicit: { data: row, rowIndex: rowIndex } }\"> </ng-container>\n        } @else {\n          <tr\n            [class.ax-state-focused]=\"focusedRow && row === focusedRow\"\n            [attr.data-index]=\"rowIndex\"\n            [class.ax-state-selected]=\"selectedRows.includes(row)\"\n            style.height=\"{{ itemHeight }}px\"\n            style.max-height=\"{{ itemHeight }}px\"\n            (click)=\"handleRowClick($event, 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.isLast]=\"c['isLastFixedColumn']\"\n                [style.--sticky-start]=\"c['stickyStart']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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></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.isFirst]=\"c['isFirstFixedColumn']\"\n                [style.--sticky-end]=\"c['stickyEnd']\"\n                [attr.data-label]=\"c.caption\"\n                tabindex=\"0\"\n                [class]=\"c.cssClass\"\n              >\n                @if (row && !isLoading()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"c.renderCellTemplate; context: { $implicit: { data: row, rowIndex: calculateRowIndex(rowIndex) } }\"\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        }\n      }\n\n      <tr class=\"empty-row\"></tr>\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.isLast]=\"c['isLastFixedColumn']\"\n              [style.--sticky-start]=\"c['stickyStart']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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; context: { $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 class=\"ax-resize-handle\" (mousedown)=\"onResizeColumnStart($event, this.startFixedColumnsList().length + $index)\"></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.isFirst]=\"c['isFirstFixedColumn']\"\n              [style.--sticky-end]=\"c['stickyEnd']\"\n            >\n              <div class=\"ax-caption\">\n                <ng-container\n                  *ngTemplateOutlet=\"c.renderFooterTemplate; context: { $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    <ax-data-pager\n      #dataPager\n      [displayMode]=\"'custom'\"\n      (onChanged)=\"onPageChanged($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()\">\n          <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n        </ax-button>\n      </ax-suffix>\n    </ax-data-pager>\n  </div>\n}\n<ng-content select=\"ax-footer\"> </ng-content>\n", styles: [".ax-dark ax-data-table thead th.ax-interactive:hover{background-color:rgba(var(--ax-color-neutral-500))!important}.ax-dark ax-data-table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}.ax-dark ax-data-table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-900))!important;color:rgba(var(--ax-color-primary-fore))!important}.ax-dark ax-data-table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-800))!important}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table thead th.ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}@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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}html[dir=rtl] ax-data-table .ax-data-table-wrapper table tbody td.ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}}ax-data-table{display:flex;flex-direction:column;height:100%;width:100%;font-size:.875rem;line-height:1.25rem;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));position:relative;min-height:inherit}ax-data-table .ax-data-table-empty-data{position:absolute;top:calc(50% - 40px);width:100%;color:rgb(var(--ax-color-neutral-500));text-align:center}ax-data-table .ax-data-table-wrapper{overflow:auto;width:100%;flex:1;border-radius:var(--ax-rounded-border-default)}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-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}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-color-primary-300))}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:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table thead .ax-data-table-sticky-header-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}@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-color-surface));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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tbody tr .ax-data-table-sticky-body-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}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-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:2.5rem;max-height:2.5rem}ax-data-table .ax-data-table-wrapper table tbody tr:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-focused:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-300));color:rgba(var(--ax-color-primary-fore-tint))}ax-data-table .ax-data-table-wrapper table tbody tr.ax-state-selected:hover td:not(.ax-index-column){background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-fore))}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-color-border-default));background-color:rgba(var(--ax-color-surface));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-index-column{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:rgba(var(--ax-color-on-surface));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 button{position:relative;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--ax-rounded-border-default);border-style:none;border-color:rgba(var(--ax-color-border-default));background-color:transparent;padding:.25rem;line-height:1;color:rgba(var(--ax-color-ghost-fore))}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover:not(ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-selected,ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column button:active{opacity:1}ax-data-table .ax-data-table-wrapper table tbody td.ax-command-column 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}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-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}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-color-neutral-200))}@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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-start.isLast{box-shadow:inset -2px 0 rgba(var(--ax-color-border-default))}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-color-border-default))}ax-data-table .ax-data-table-wrapper table tfoot tr .ax-data-table-sticky-footer-cell.sticky-end.isFirst{box-shadow:inset 2px 0 rgba(var(--ax-color-border-default))}}ax-data-table .ax-data-table-wrapper table tfoot.ax-data-table-sticky-footer{position:sticky;bottom:0;border-top:none;border-bottom:none;z-index:3;box-shadow:1px 0 rgba(var(--ax-color-border-default)),0 -1px rgba(var(--ax-color-border-default))}@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-color-border-default));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-color-primary-900),.2),0 8px 10px 1px rgba(var(--ax-color-primary-900),.14),0 3px 14px 2px rgba(var(--ax-color-primary-900),.12);border-style:solid;border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-on-surface));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}\n"] }]
         }], propDecorators: { dataPager: [{
                 type: ViewChild,
                 args: ['dataPager']