@acorex/components 7.12.3 → 7.12.6

package/esm2022/data-table/lib/data-table.component.mjs

@@ -193,11 +193,11 @@ export class AXDataTableComponent extends MXBaseComponent {
         this.updateHScroll();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: AXDataTableComponent, selector: "ax-data-table", inputs: { rowTemplate: "rowTemplate", emptyTemplate: "emptyTemplate", loadingTemplate: "loadingTemplate", showHeader: "showHeader", fetchDataMode: "fetchDataMode", dataSource: "dataSource", focusedRow: "focusedRow", selectedRows: "selectedRows", itemHeight: "itemHeight" }, outputs: { onPageChanged: "onPageChanged", focusedRowChange: "focusedRowChange", selectedRowsChange: "selectedRowsChange", onScrolledIndexChanged: "onScrolledIndexChanged" }, providers: [{ provide: AXPagedComponent, useExisting: AXDataTableComponent }], queries: [{ propertyName: "columns", predicate: AXDataTableColumnComponent }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, static: true }, { propertyName: "headerContainer", first: true, predicate: ["headerContainer"], descendants: true }, { propertyName: "footerContainer", first: true, predicate: ["footerContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\">\n</ng-content>\n<!------------------- Header contents ------------------->\n<div class=\"ax-header-content\" *ngIf=\"showHeader\">\n  <div class=\"ax-header-columns ax-header-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: 10px;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <!------------------- start fixed column ------------------->\n          <th *ngFor=\"let c of startFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\" class=\"ax-column-fixed\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption }}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <!------------------- not fixed column ------------------->\n          <th [attr.colspan]=\"notFixedColumnCount()\">\n\n          </th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n  <div class=\"ax-header-columns\">\n    <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n      <colgroup>\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: auto;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <th *ngFor=\"let c of startFixedColumn()\">\n          </th>\n          <th *ngFor=\"let c of notFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption}}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n</div>\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n  <div class=\"ax-body-columns ax-body-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col>\n      </colgroup>\n      <tbody>\n      </tbody>\n    </table>\n  </div>\n  <div class=\"ax-body-columns\">\n    <div cdkVirtualScrollingElement [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll($event)\">\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n          <colgroup>\n            <!------------------- start fixed column ------------------->\n            <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n            <!------------------- not fixed column ------------------->\n            <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n            <col>\n          </colgroup>\n          <tbody>\n            <ng-container\n              *cdkVirtualFor=\"let item of listDataSource;  let i = index; trackBy: trackByIdx;let rIndex=index;\">\n              <ng-template [ngIf]=\"rowTemplate\" [ngIfElse]=\"rowTpl\">\n                <ng-container *ngTemplateOutlet=\"rowTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                </ng-container>\n              </ng-template>\n              <ng-template #rowTpl>\n                <tr [class.ax-state-focused]=\"focusedRow && item===focusedRow\" [attr.data-index]=\"rIndex\"\n                  [class.ax-state-selected]=\"selectedRows.includes(item)\" (click)=\"handleRowClick($event,item)\">\n                  <!------------------- start fixed column ------------------->\n                  <ng-container *ngFor=\"let c of startFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\" [attr.data-fixed]=\"c.fixed\"\n                        class=\"ax-column-fixed\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <!------------------- Not fixed column ------------------->\n                  <ng-container *ngFor=\"let c of notFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <td></td>\n                </tr>\n              </ng-template>\n            </ng-container>\n          </tbody>\n        </table>\n      </cdk-virtual-scroll-viewport>\n    </div>\n  </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n  <div class=\"ax-table-info\">\n    <div>\n      Showing {{startRowIndex}} of {{totalRows}} items\n    </div>\n    <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n      <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n    </ax-button>\n  </div>\n  <ng-content select=\"ax-footer\">\n  </ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n    </ng-container>\n  </ng-container>\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <ax-skeleton [animated]=\"true\"></ax-skeleton>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-template #emptyTpl>\n  <tr>\n    <td [attr.colspan]=\"columns.length\">\n      <ng-template [ngIf]=\"emptyTemplate\" [ngIfElse]=\"defaultEmptyTemplate\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n      </ng-template>\n      <ng-template #defaultEmptyTemplate>\n        <ax-result type=\"empty\" caption=\" {{'common.no-result-found' | trans }}\"></ax-result>\n      </ng-template>\n    </td>\n  </tr>\n</ng-template>", styles: [".ax-dark ax-data-table .ax-header-content th.ax-interactive:hover{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-neutral),var(--tw-bg-opacity))!important}.ax-dark ax-data-table .ax-body-content tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}ax-data-table{height:100%;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;line-height:1.25rem}ax-data-table table{table-layout:fixed}ax-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-data-table .ax-header-content .ax-header-columns{height:100%}ax-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}ax-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-neutral),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content{position:relative}ax-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-body-content .ax-body-columns{height:100%}ax-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) td{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) ax-skeleton{width:25%}ax-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 70%,white);--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.5rem 1rem}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content{justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content{position:relative}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));align-items:center;justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content 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;--tw-text-opacity: 1;color:rgba(var(--ax-color-ghost-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover:not(ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-selected,ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:active{opacity:1}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-icon{font-size:1.125rem;line-height:1.75rem}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content{display:flex;width:100%;justify-content:flex-start}ax-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem .875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "component", type: i3.AXResultComponent, selector: "ax-result", inputs: ["type", "caption", "description"] }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i5.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: i6.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: AXDataTableComponent, selector: "ax-data-table", inputs: { rowTemplate: "rowTemplate", emptyTemplate: "emptyTemplate", loadingTemplate: "loadingTemplate", showHeader: "showHeader", fetchDataMode: "fetchDataMode", dataSource: "dataSource", focusedRow: "focusedRow", selectedRows: "selectedRows", itemHeight: "itemHeight" }, outputs: { onPageChanged: "onPageChanged", focusedRowChange: "focusedRowChange", selectedRowsChange: "selectedRowsChange", onScrolledIndexChanged: "onScrolledIndexChanged" }, providers: [{ provide: AXPagedComponent, useExisting: AXDataTableComponent }], queries: [{ propertyName: "columns", predicate: AXDataTableColumnComponent }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, static: true }, { propertyName: "headerContainer", first: true, predicate: ["headerContainer"], descendants: true }, { propertyName: "footerContainer", first: true, predicate: ["footerContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\">\n</ng-content>\n<!------------------- Header contents ------------------->\n<div class=\"ax-header-content\" *ngIf=\"showHeader\">\n  <div class=\"ax-header-columns ax-header-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: 10px;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <!------------------- start fixed column ------------------->\n          <th *ngFor=\"let c of startFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\" class=\"ax-column-fixed\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption }}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <!------------------- not fixed column ------------------->\n          <th [attr.colspan]=\"notFixedColumnCount()\">\n\n          </th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n  <div class=\"ax-header-columns\">\n    <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n      <colgroup>\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: auto;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <th *ngFor=\"let c of startFixedColumn()\">\n          </th>\n          <th *ngFor=\"let c of notFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption}}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n</div>\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n  <div class=\"ax-body-columns ax-body-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col>\n      </colgroup>\n      <tbody>\n      </tbody>\n    </table>\n  </div>\n  <div class=\"ax-body-columns\">\n    <div cdkVirtualScrollingElement [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll($event)\">\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n          <colgroup>\n            <!------------------- start fixed column ------------------->\n            <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n            <!------------------- not fixed column ------------------->\n            <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n            <col>\n          </colgroup>\n          <tbody>\n            <ng-container\n              *cdkVirtualFor=\"let item of listDataSource;  let i = index; trackBy: trackByIdx;let rIndex=index;\">\n              <ng-template [ngIf]=\"rowTemplate\" [ngIfElse]=\"rowTpl\">\n                <ng-container *ngTemplateOutlet=\"rowTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                </ng-container>\n              </ng-template>\n              <ng-template #rowTpl>\n                <tr [class.ax-state-focused]=\"focusedRow && item===focusedRow\" [attr.data-index]=\"rIndex\"\n                  [class.ax-state-selected]=\"selectedRows.includes(item)\" (click)=\"handleRowClick($event,item)\">\n                  <!------------------- start fixed column ------------------->\n                  <ng-container *ngFor=\"let c of startFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\" [attr.data-fixed]=\"c.fixed\"\n                        class=\"ax-column-fixed\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <!------------------- Not fixed column ------------------->\n                  <ng-container *ngFor=\"let c of notFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <td></td>\n                </tr>\n              </ng-template>\n            </ng-container>\n          </tbody>\n        </table>\n      </cdk-virtual-scroll-viewport>\n    </div>\n  </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n  <div class=\"ax-table-info\">\n    <div>\n      Showing {{startRowIndex}} of {{totalRows}} items\n    </div>\n    <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n      <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n    </ax-button>\n  </div>\n  <ng-content select=\"ax-footer\">\n  </ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n    </ng-container>\n  </ng-container>\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <ax-skeleton [animated]=\"true\"></ax-skeleton>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-template #emptyTpl>\n  <tr>\n    <td [attr.colspan]=\"columns.length\">\n      <ng-template [ngIf]=\"emptyTemplate\" [ngIfElse]=\"defaultEmptyTemplate\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n      </ng-template>\n      <ng-template #defaultEmptyTemplate>\n        <ax-result type=\"empty\" caption=\" {{'common.no-result-found' | trans }}\"></ax-result>\n      </ng-template>\n    </td>\n  </tr>\n</ng-template>", styles: [".ax-dark ax-data-table .ax-header-content th.ax-interactive:hover{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-neutral),var(--tw-bg-opacity))!important}.ax-dark ax-data-table .ax-body-content tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}ax-data-table{height:100%;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;line-height:1.25rem}ax-data-table table{table-layout:fixed}ax-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-data-table .ax-header-content .ax-header-columns{height:100%}ax-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}ax-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-neutral),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content{position:relative}ax-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-body-content .ax-body-columns{height:100%}ax-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) td{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) ax-skeleton{width:25%}ax-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 70%,white);--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.5rem 1rem}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content{justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column button.ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content{position:relative}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));align-items:center;justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content 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;--tw-text-opacity: 1;color:rgba(var(--ax-color-ghost-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover:not(ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-selected,ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:active{opacity:1}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-icon{font-size:1.125rem;line-height:1.75rem}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content{display:flex;width:100%;justify-content:flex-start}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content>span{display:inline-block}ax-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem .875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "component", type: i3.AXResultComponent, selector: "ax-result", inputs: ["type", "caption", "description"] }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i5.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "component", type: i6.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-data-table', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: AXPagedComponent, useExisting: AXDataTableComponent }], template: "<ng-content select=\"ax-header\">\n</ng-content>\n<!------------------- Header contents ------------------->\n<div class=\"ax-header-content\" *ngIf=\"showHeader\">\n  <div class=\"ax-header-columns ax-header-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: 10px;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <!------------------- start fixed column ------------------->\n          <th *ngFor=\"let c of startFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\" class=\"ax-column-fixed\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption }}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <!------------------- not fixed column ------------------->\n          <th [attr.colspan]=\"notFixedColumnCount()\">\n\n          </th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n  <div class=\"ax-header-columns\">\n    <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n      <colgroup>\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: auto;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <th *ngFor=\"let c of startFixedColumn()\">\n          </th>\n          <th *ngFor=\"let c of notFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption}}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n</div>\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n  <div class=\"ax-body-columns ax-body-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col>\n      </colgroup>\n      <tbody>\n      </tbody>\n    </table>\n  </div>\n  <div class=\"ax-body-columns\">\n    <div cdkVirtualScrollingElement [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll($event)\">\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n          <colgroup>\n            <!------------------- start fixed column ------------------->\n            <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n            <!------------------- not fixed column ------------------->\n            <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n            <col>\n          </colgroup>\n          <tbody>\n            <ng-container\n              *cdkVirtualFor=\"let item of listDataSource;  let i = index; trackBy: trackByIdx;let rIndex=index;\">\n              <ng-template [ngIf]=\"rowTemplate\" [ngIfElse]=\"rowTpl\">\n                <ng-container *ngTemplateOutlet=\"rowTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                </ng-container>\n              </ng-template>\n              <ng-template #rowTpl>\n                <tr [class.ax-state-focused]=\"focusedRow && item===focusedRow\" [attr.data-index]=\"rIndex\"\n                  [class.ax-state-selected]=\"selectedRows.includes(item)\" (click)=\"handleRowClick($event,item)\">\n                  <!------------------- start fixed column ------------------->\n                  <ng-container *ngFor=\"let c of startFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\" [attr.data-fixed]=\"c.fixed\"\n                        class=\"ax-column-fixed\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <!------------------- Not fixed column ------------------->\n                  <ng-container *ngFor=\"let c of notFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <td></td>\n                </tr>\n              </ng-template>\n            </ng-container>\n          </tbody>\n        </table>\n      </cdk-virtual-scroll-viewport>\n    </div>\n  </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n  <div class=\"ax-table-info\">\n    <div>\n      Showing {{startRowIndex}} of {{totalRows}} items\n    </div>\n    <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n      <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n    </ax-button>\n  </div>\n  <ng-content select=\"ax-footer\">\n  </ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n    </ng-container>\n  </ng-container>\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <ax-skeleton [animated]=\"true\"></ax-skeleton>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-template #emptyTpl>\n  <tr>\n    <td [attr.colspan]=\"columns.length\">\n      <ng-template [ngIf]=\"emptyTemplate\" [ngIfElse]=\"defaultEmptyTemplate\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n      </ng-template>\n      <ng-template #defaultEmptyTemplate>\n        <ax-result type=\"empty\" caption=\" {{'common.no-result-found' | trans }}\"></ax-result>\n      </ng-template>\n    </td>\n  </tr>\n</ng-template>", styles: [".ax-dark ax-data-table .ax-header-content th.ax-interactive:hover{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-neutral),var(--tw-bg-opacity))!important}.ax-dark ax-data-table .ax-body-content tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}ax-data-table{height:100%;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;line-height:1.25rem}ax-data-table table{table-layout:fixed}ax-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-data-table .ax-header-content .ax-header-columns{height:100%}ax-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}ax-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-neutral),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content{position:relative}ax-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-body-content .ax-body-columns{height:100%}ax-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) td{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) ax-skeleton{width:25%}ax-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 70%,white);--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.5rem 1rem}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content{justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content{position:relative}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));align-items:center;justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content 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;--tw-text-opacity: 1;color:rgba(var(--ax-color-ghost-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover:not(ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-selected,ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:active{opacity:1}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-icon{font-size:1.125rem;line-height:1.75rem}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content{display:flex;width:100%;justify-content:flex-start}ax-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem .875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"] }]
+            args: [{ selector: 'ax-data-table', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: AXPagedComponent, useExisting: AXDataTableComponent }], template: "<ng-content select=\"ax-header\">\n</ng-content>\n<!------------------- Header contents ------------------->\n<div class=\"ax-header-content\" *ngIf=\"showHeader\">\n  <div class=\"ax-header-columns ax-header-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: 10px;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <!------------------- start fixed column ------------------->\n          <th *ngFor=\"let c of startFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\" class=\"ax-column-fixed\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption }}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <!------------------- not fixed column ------------------->\n          <th [attr.colspan]=\"notFixedColumnCount()\">\n\n          </th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n  <div class=\"ax-header-columns\">\n    <table tabindex=\"0\" [style.width]=\"width\" #headerContainer>\n      <colgroup>\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col style=\"width: auto;\">\n      </colgroup>\n      <thead>\n        <tr>\n          <th *ngFor=\"let c of startFixedColumn()\">\n          </th>\n          <th *ngFor=\"let c of notFixedColumn()\" [class.ax-interactive]=\"c.allowSorting\"\n            (click)=\"c.allowSorting ? handleColumnClick($event,c) : null\">\n            <ng-template [ngIf]=\"c.headerTemplate\" [ngIfElse]=\"captionTpl\">\n              <ng-container *ngTemplateOutlet=\"c.headerTemplate\"></ng-container>\n            </ng-template>\n            <ng-template #captionTpl>\n              <div class=\"ax-caption\">\n                {{c.caption}}\n                <ax-icon *ngIf=\"getSort(c)\" icon=\"ax-icon {{getSort(c)}}\"></ax-icon>\n              </div>\n            </ng-template>\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n    </table>\n  </div>\n</div>\n<!------------------- Body contents ------------------->\n<div [style.height]=\"height\" class=\"ax-body-content\">\n  <div class=\"ax-body-columns ax-body-fixed-columns\" *ngIf=\"false\">\n    <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n      <colgroup>\n        <!------------------- start fixed column ------------------->\n        <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n        <!------------------- not fixed column ------------------->\n        <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n        <col>\n      </colgroup>\n      <tbody>\n      </tbody>\n    </table>\n  </div>\n  <div class=\"ax-body-columns\">\n    <div cdkVirtualScrollingElement [style.height]=\"'100%'\" (scroll)=\"_handleOnScroll($event)\">\n      <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <table tabindex=\"0\" class=\"ax-table-body\" [style.width]=\"width\">\n          <colgroup>\n            <!------------------- start fixed column ------------------->\n            <col *ngFor=\"let c of startFixedColumn()\" [style.width]=\"c.width\">\n            <!------------------- not fixed column ------------------->\n            <col *ngFor=\"let c of notFixedColumn()\" [style.width]=\"c.width\">\n            <col>\n          </colgroup>\n          <tbody>\n            <ng-container\n              *cdkVirtualFor=\"let item of listDataSource;  let i = index; trackBy: trackByIdx;let rIndex=index;\">\n              <ng-template [ngIf]=\"rowTemplate\" [ngIfElse]=\"rowTpl\">\n                <ng-container *ngTemplateOutlet=\"rowTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                </ng-container>\n              </ng-template>\n              <ng-template #rowTpl>\n                <tr [class.ax-state-focused]=\"focusedRow && item===focusedRow\" [attr.data-index]=\"rIndex\"\n                  [class.ax-state-selected]=\"selectedRows.includes(item)\" (click)=\"handleRowClick($event,item)\">\n                  <!------------------- start fixed column ------------------->\n                  <ng-container *ngFor=\"let c of startFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\" [attr.data-fixed]=\"c.fixed\"\n                        class=\"ax-column-fixed\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <!------------------- Not fixed column ------------------->\n                  <ng-container *ngFor=\"let c of notFixedColumn()\">\n                    <ng-template [ngIf]=\"c.cellTemplate\" [ngIfElse]=\"cellTpl\">\n                      <div class=\"ax-content\">\n                        <ng-container\n                          *ngTemplateOutlet=\"c.cellTemplate;context: { $implicit: {data:item,rowIndex:rIndex} }\">\n                        </ng-container>\n                      </div>\n                    </ng-template>\n                    <ng-template #cellTpl>\n                      <td [attr.data-label]=\"c.caption\" tabindex=\"0\" [class]=\"c.cssClass\">\n                        <div class=\"ax-content\">\n                          <ng-container *ngIf=\"item || !c.skeleton;else loadingTpl\">\n                            <ng-container\n                              *ngTemplateOutlet=\"c.template; context: { $implicit: {data:item,rowIndex:rIndex} }\"></ng-container>\n                          </ng-container>\n                        </div>\n                      </td>\n                    </ng-template>\n                  </ng-container>\n                  <td></td>\n                </tr>\n              </ng-template>\n            </ng-container>\n          </tbody>\n        </table>\n      </cdk-virtual-scroll-viewport>\n    </div>\n  </div>\n</div>\n<div class=\"ax-table-footer\" #footerContainer>\n  <div class=\"ax-table-info\">\n    <div>\n      Showing {{startRowIndex}} of {{totalRows}} items\n    </div>\n    <ax-button look=\"blank\" class=\"ax-sm\" (onClick)=\"refresh()\">\n      <ax-icon icon=\"ax-icon ax-icon-refresh\"></ax-icon>\n    </ax-button>\n  </div>\n  <ng-content select=\"ax-footer\">\n  </ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n    </ng-container>\n  </ng-container>\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <ax-skeleton [animated]=\"true\"></ax-skeleton>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-template #emptyTpl>\n  <tr>\n    <td [attr.colspan]=\"columns.length\">\n      <ng-template [ngIf]=\"emptyTemplate\" [ngIfElse]=\"defaultEmptyTemplate\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n      </ng-template>\n      <ng-template #defaultEmptyTemplate>\n        <ax-result type=\"empty\" caption=\" {{'common.no-result-found' | trans }}\"></ax-result>\n      </ng-template>\n    </td>\n  </tr>\n</ng-template>", styles: [".ax-dark ax-data-table .ax-header-content th.ax-interactive:hover{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-neutral),var(--tw-bg-opacity))!important}.ax-dark ax-data-table .ax-body-content tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 70%)!important;--tw-text-opacity: 1 !important;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))!important}.ax-dark ax-data-table .ax-body-content tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1 !important;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)),black 50%)!important}ax-data-table{height:100%;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));font-size:.875rem;line-height:1.25rem}ax-data-table table{table-layout:fixed}ax-data-table .ax-header-content{position:relative;height:3rem;overflow:hidden}ax-data-table .ax-header-content .ax-header-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-header-content .ax-header-fixed-columns th.ax-column-fixed{pointer-events:auto}ax-data-table .ax-header-content .ax-header-fixed-columns th:not(.ax-column-fixed){visibility:hidden;background-color:transparent}ax-data-table .ax-header-content .ax-header-columns{height:100%}ax-data-table .ax-header-content .ax-header-columns>table{height:100%;overflow:hidden;border-start-end-radius:var(--ax-rounded-border-default);border-start-start-radius:var(--ax-rounded-border-default)}ax-data-table .ax-header-content .ax-header-columns>table th{border-bottom-width:1px;border-inline-end-width:1px;border-style:solid;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity));padding:.75rem 1rem;text-align:start;font-weight:500;text-transform:uppercase}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive{cursor:pointer}ax-data-table .ax-header-content .ax-header-columns>table th.ax-interactive:hover{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-neutral),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-header-content .ax-header-columns>table th .ax-caption{display:flex;align-items:center;gap:.5rem}ax-data-table .ax-header-content .ax-header-columns>table th:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content{position:relative}ax-data-table .ax-body-content .ax-body-fixed-columns{pointer-events:none;position:absolute;z-index:10}ax-data-table .ax-body-content .ax-body-columns{height:100%}ax-data-table .ax-body-content .ax-body-columns table{border-collapse:collapse}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) td{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))}ax-data-table .ax-body-content .ax-body-columns table tr:nth-child(odd) ax-skeleton{width:25%}ax-data-table .ax-body-content .ax-body-columns table tr{height:2.5rem}ax-data-table .ax-body-content .ax-body-columns table tr:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 30%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-focused:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 50%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}ax-data-table .ax-body-content .ax-body-columns table tr.ax-state-selected:hover td:not(.ax-index-column){--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 70%,white);--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td{position:relative;min-width:2rem;border-bottom-width:1px;border-inline-end-width:1px;border-color:rgba(var(--ax-color-border-default));--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));padding:.5rem 1rem}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column{--tw-bg-opacity: 1 !important;background-color:rgba(var(--ax-color-on-surface),var(--tw-bg-opacity))!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content{justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-index-column>.ax-content span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column button.ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content{position:relative}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content>div{position:absolute;inset-inline-start:0px;top:50%;display:flex;width:100%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));align-items:center;justify-content:center}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content 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;--tw-text-opacity: 1;color:rgba(var(--ax-color-ghost-fore),var(--tw-text-opacity))}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover:not(ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-selected,ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:hover.ax-state-disabled){opacity:.75}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button:active{opacity:1}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-ripple{background-color:rgba(var(--ax-color-ghost-fore),.05)}ax-data-table .ax-body-content .ax-body-columns table td.ax-command-column>.ax-content button .ax-icon{font-size:1.125rem;line-height:1.75rem}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content{display:flex;width:100%;justify-content:flex-start}ax-data-table .ax-body-content .ax-body-columns table td>.ax-content>span{display:inline-block}ax-data-table .ax-body-content .ax-body-columns table td:last-child{border-inline-end-width:0px}ax-data-table .ax-body-content .ax-body-columns table td ax-skeleton{height:.875rem;width:33.333333%;border-radius:.375rem}ax-data-table .ax-table-footer{border-collapse:collapse;overflow:hidden;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem .875rem}ax-data-table .ax-table-footer .ax-table-info{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between}\n"] }]
         }], propDecorators: { columns: [{
                 type: ContentChildren,
                 args: [AXDataTableColumnComponent]

package/esm2022/data-table/lib/data-table.module.mjs

@@ -1,5 +1,5 @@
 import { AXButtonModule } from '@acorex/components/button';
-import { AXCommonModule } from '@acorex/components/common';
+import { AXCommonModule, AXRippleDirective } from '@acorex/components/common';
 import { AXDecoratorModule } from '@acorex/components/decorators';
 import { AXDropdownModule } from '@acorex/components/dropdown';
 import { AXLoadingModule } from '@acorex/components/loading';
@@ -36,6 +36,7 @@ const MODULES = [
     AXButtonModule,
     AXDropdownModule,
     AXFormatModule,
+    AXRippleDirective,
 ];
 export class AXDataTableModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -54,13 +55,24 @@ export class AXDataTableModule {
             AXSkeletonModule,
             AXButtonModule,
             AXDropdownModule,
-            AXFormatModule], exports: [AXDataTableComponent,
+            AXFormatModule,
+            AXRippleDirective], exports: [AXDataTableComponent,
             AXDataTableTextColumnComponent,
             AXRowIndexColumnComponent,
             AXRowSelectColumnComponent,
             AXRowCommandColumnComponent,
             AXRowDropdownCommandColumnComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableModule, imports: [MODULES] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableModule, imports: [CommonModule,
+            AXCommonModule,
+            ScrollingModule,
+            AXTranslationModule,
+            AXResultModule,
+            AXLoadingModule,
+            AXDecoratorModule,
+            AXSkeletonModule,
+            AXButtonModule,
+            AXDropdownModule,
+            AXFormatModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDataTableModule, decorators: [{
             type: NgModule,
@@ -71,4 +83,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                     providers: [],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS10YWJsZS5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvZGF0YS10YWJsZS9zcmMvbGliL2RhdGEtdGFibGUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDbEUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQzdELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUMvRCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDckQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDL0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3pELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSw4QkFBOEIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQ3RGLE9BQU8sRUFDTCwyQkFBMkIsRUFDM0IsbUNBQW1DLEdBQ3BDLE1BQU0sd0NBQXdDLENBQUM7QUFDaEQsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDakYsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDbkYsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7O0FBRTlELE1BQU0sU0FBUyxHQUFHO0lBQ2hCLG9CQUFvQjtJQUNwQiw4QkFBOEI7SUFDOUIseUJBQXlCO0lBQ3pCLDBCQUEwQjtJQUMxQiwyQkFBMkI7SUFDM0IsbUNBQW1DO0NBQ3BDLENBQUM7QUFDRixNQUFNLE9BQU8sR0FBRztJQUNkLFlBQVk7SUFDWixjQUFjO0lBQ2QsZUFBZTtJQUNmLG1CQUFtQjtJQUNuQixjQUFjO0lBQ2QsZUFBZTtJQUNmLGlCQUFpQjtJQUNqQixnQkFBZ0I7SUFDaEIsY0FBYztJQUNkLGdCQUFnQjtJQUNoQixjQUFjO0NBQ2YsQ0FBQztBQVFGLE1BQU0sT0FBTyxpQkFBaUI7OEdBQWpCLGlCQUFpQjsrR0FBakIsaUJBQWlCLGlCQTNCNUIsb0JBQW9CO1lBQ3BCLDhCQUE4QjtZQUM5Qix5QkFBeUI7WUFDekIsMEJBQTBCO1lBQzFCLDJCQUEyQjtZQUMzQixtQ0FBbUMsYUFHbkMsWUFBWTtZQUNaLGNBQWM7WUFDZCxlQUFlO1lBQ2YsbUJBQW1CO1lBQ25CLGNBQWM7WUFDZCxlQUFlO1lBQ2YsaUJBQWlCO1lBQ2pCLGdCQUFnQjtZQUNoQixjQUFjO1lBQ2QsZ0JBQWdCO1lBQ2hCLGNBQWMsYUFsQmQsb0JBQW9CO1lBQ3BCLDhCQUE4QjtZQUM5Qix5QkFBeUI7WUFDekIsMEJBQTBCO1lBQzFCLDJCQUEyQjtZQUMzQixtQ0FBbUM7K0dBc0J4QixpQkFBaUIsWUFKZixPQUFPOzsyRkFJVCxpQkFBaUI7a0JBTjdCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsR0FBRyxTQUFTLENBQUM7b0JBQzVCLE9BQU8sRUFBRSxDQUFDLEdBQUcsT0FBTyxDQUFDO29CQUNyQixPQUFPLEVBQUUsQ0FBQyxHQUFHLFNBQVMsQ0FBQztvQkFDdkIsU0FBUyxFQUFFLEVBQUU7aUJBQ2QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBWEJ1dHRvbk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9idXR0b24nO1xuaW1wb3J0IHsgQVhDb21tb25Nb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvY29tbW9uJztcbmltcG9ydCB7IEFYRGVjb3JhdG9yTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2RlY29yYXRvcnMnO1xuaW1wb3J0IHsgQVhEcm9wZG93bk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9kcm9wZG93bic7XG5pbXBvcnQgeyBBWExvYWRpbmdNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvbG9hZGluZyc7XG5pbXBvcnQgeyBBWFJlc3VsdE1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9yZXN1bHQnO1xuaW1wb3J0IHsgQVhTa2VsZXRvbk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9za2VsZXRvbic7XG5pbXBvcnQgeyBBWEZvcm1hdE1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29yZS9mb3JtYXQnO1xuaW1wb3J0IHsgQVhUcmFuc2xhdGlvbk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29yZS90cmFuc2xhdGlvbic7XG5pbXBvcnQgeyBTY3JvbGxpbmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jZGsvc2Nyb2xsaW5nJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQVhEYXRhVGFibGVUZXh0Q29sdW1uQ29tcG9uZW50IH0gZnJvbSAnLi9jb2x1bW5zL2RhdGEtdGV4dC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7XG4gIEFYUm93Q29tbWFuZENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dEcm9wZG93bkNvbW1hbmRDb2x1bW5Db21wb25lbnQsXG59IGZyb20gJy4vY29sdW1ucy9yb3ctY29tbWFuZC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7IEFYUm93SW5kZXhDb2x1bW5Db21wb25lbnQgfSBmcm9tICcuL2NvbHVtbnMvcm93LWluZGV4LWNvbHVtbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhSb3dTZWxlY3RDb2x1bW5Db21wb25lbnQgfSBmcm9tICcuL2NvbHVtbnMvcm93LXNlbGVjdC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7IEFYRGF0YVRhYmxlQ29tcG9uZW50IH0gZnJvbSAnLi9kYXRhLXRhYmxlLmNvbXBvbmVudCc7XG5cbmNvbnN0IENPTVBPTkVOVCA9IFtcbiAgQVhEYXRhVGFibGVDb21wb25lbnQsXG4gIEFYRGF0YVRhYmxlVGV4dENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dJbmRleENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dTZWxlY3RDb2x1bW5Db21wb25lbnQsXG4gIEFYUm93Q29tbWFuZENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dEcm9wZG93bkNvbW1hbmRDb2x1bW5Db21wb25lbnQsXG5dO1xuY29uc3QgTU9EVUxFUyA9IFtcbiAgQ29tbW9uTW9kdWxlLFxuICBBWENvbW1vbk1vZHVsZSxcbiAgU2Nyb2xsaW5nTW9kdWxlLFxuICBBWFRyYW5zbGF0aW9uTW9kdWxlLFxuICBBWFJlc3VsdE1vZHVsZSxcbiAgQVhMb2FkaW5nTW9kdWxlLFxuICBBWERlY29yYXRvck1vZHVsZSxcbiAgQVhTa2VsZXRvbk1vZHVsZSxcbiAgQVhCdXR0b25Nb2R1bGUsXG4gIEFYRHJvcGRvd25Nb2R1bGUsXG4gIEFYRm9ybWF0TW9kdWxlLFxuXTtcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbLi4uQ09NUE9ORU5UXSxcbiAgaW1wb3J0czogWy4uLk1PRFVMRVNdLFxuICBleHBvcnRzOiBbLi4uQ09NUE9ORU5UXSxcbiAgcHJvdmlkZXJzOiBbXSxcbn0pXG5leHBvcnQgY2xhc3MgQVhEYXRhVGFibGVNb2R1bGUge31cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS10YWJsZS5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvZGF0YS10YWJsZS9zcmMvbGliL2RhdGEtdGFibGUubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsY0FBYyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDOUUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDbEUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQzdELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUMvRCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDckQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDL0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3pELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSw4QkFBOEIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQ3RGLE9BQU8sRUFDTCwyQkFBMkIsRUFDM0IsbUNBQW1DLEdBQ3BDLE1BQU0sd0NBQXdDLENBQUM7QUFDaEQsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDakYsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDbkYsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7O0FBRTlELE1BQU0sU0FBUyxHQUFHO0lBQ2hCLG9CQUFvQjtJQUNwQiw4QkFBOEI7SUFDOUIseUJBQXlCO0lBQ3pCLDBCQUEwQjtJQUMxQiwyQkFBMkI7SUFDM0IsbUNBQW1DO0NBQ3BDLENBQUM7QUFDRixNQUFNLE9BQU8sR0FBRztJQUNkLFlBQVk7SUFDWixjQUFjO0lBQ2QsZUFBZTtJQUNmLG1CQUFtQjtJQUNuQixjQUFjO0lBQ2QsZUFBZTtJQUNmLGlCQUFpQjtJQUNqQixnQkFBZ0I7SUFDaEIsY0FBYztJQUNkLGdCQUFnQjtJQUNoQixjQUFjO0lBQ2QsaUJBQWlCO0NBQ2xCLENBQUM7QUFRRixNQUFNLE9BQU8saUJBQWlCOzhHQUFqQixpQkFBaUI7K0dBQWpCLGlCQUFpQixpQkE1QjVCLG9CQUFvQjtZQUNwQiw4QkFBOEI7WUFDOUIseUJBQXlCO1lBQ3pCLDBCQUEwQjtZQUMxQiwyQkFBMkI7WUFDM0IsbUNBQW1DLGFBR25DLFlBQVk7WUFDWixjQUFjO1lBQ2QsZUFBZTtZQUNmLG1CQUFtQjtZQUNuQixjQUFjO1lBQ2QsZUFBZTtZQUNmLGlCQUFpQjtZQUNqQixnQkFBZ0I7WUFDaEIsY0FBYztZQUNkLGdCQUFnQjtZQUNoQixjQUFjO1lBQ2QsaUJBQWlCLGFBbkJqQixvQkFBb0I7WUFDcEIsOEJBQThCO1lBQzlCLHlCQUF5QjtZQUN6QiwwQkFBMEI7WUFDMUIsMkJBQTJCO1lBQzNCLG1DQUFtQzsrR0F1QnhCLGlCQUFpQixZQXBCNUIsWUFBWTtZQUNaLGNBQWM7WUFDZCxlQUFlO1lBQ2YsbUJBQW1CO1lBQ25CLGNBQWM7WUFDZCxlQUFlO1lBQ2YsaUJBQWlCO1lBQ2pCLGdCQUFnQjtZQUNoQixjQUFjO1lBQ2QsZ0JBQWdCO1lBQ2hCLGNBQWM7OzJGQVVILGlCQUFpQjtrQkFON0IsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyxHQUFHLFNBQVMsQ0FBQztvQkFDNUIsT0FBTyxFQUFFLENBQUMsR0FBRyxPQUFPLENBQUM7b0JBQ3JCLE9BQU8sRUFBRSxDQUFDLEdBQUcsU0FBUyxDQUFDO29CQUN2QixTQUFTLEVBQUUsRUFBRTtpQkFDZCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFYQnV0dG9uTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2J1dHRvbic7XG5pbXBvcnQgeyBBWENvbW1vbk1vZHVsZSwgQVhSaXBwbGVEaXJlY3RpdmUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvY29tbW9uJztcbmltcG9ydCB7IEFYRGVjb3JhdG9yTW9kdWxlIH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2RlY29yYXRvcnMnO1xuaW1wb3J0IHsgQVhEcm9wZG93bk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9kcm9wZG93bic7XG5pbXBvcnQgeyBBWExvYWRpbmdNb2R1bGUgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvbG9hZGluZyc7XG5pbXBvcnQgeyBBWFJlc3VsdE1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9yZXN1bHQnO1xuaW1wb3J0IHsgQVhTa2VsZXRvbk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29tcG9uZW50cy9za2VsZXRvbic7XG5pbXBvcnQgeyBBWEZvcm1hdE1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29yZS9mb3JtYXQnO1xuaW1wb3J0IHsgQVhUcmFuc2xhdGlvbk1vZHVsZSB9IGZyb20gJ0BhY29yZXgvY29yZS90cmFuc2xhdGlvbic7XG5pbXBvcnQgeyBTY3JvbGxpbmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jZGsvc2Nyb2xsaW5nJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQVhEYXRhVGFibGVUZXh0Q29sdW1uQ29tcG9uZW50IH0gZnJvbSAnLi9jb2x1bW5zL2RhdGEtdGV4dC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7XG4gIEFYUm93Q29tbWFuZENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dEcm9wZG93bkNvbW1hbmRDb2x1bW5Db21wb25lbnQsXG59IGZyb20gJy4vY29sdW1ucy9yb3ctY29tbWFuZC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7IEFYUm93SW5kZXhDb2x1bW5Db21wb25lbnQgfSBmcm9tICcuL2NvbHVtbnMvcm93LWluZGV4LWNvbHVtbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgQVhSb3dTZWxlY3RDb2x1bW5Db21wb25lbnQgfSBmcm9tICcuL2NvbHVtbnMvcm93LXNlbGVjdC1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7IEFYRGF0YVRhYmxlQ29tcG9uZW50IH0gZnJvbSAnLi9kYXRhLXRhYmxlLmNvbXBvbmVudCc7XG5cbmNvbnN0IENPTVBPTkVOVCA9IFtcbiAgQVhEYXRhVGFibGVDb21wb25lbnQsXG4gIEFYRGF0YVRhYmxlVGV4dENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dJbmRleENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dTZWxlY3RDb2x1bW5Db21wb25lbnQsXG4gIEFYUm93Q29tbWFuZENvbHVtbkNvbXBvbmVudCxcbiAgQVhSb3dEcm9wZG93bkNvbW1hbmRDb2x1bW5Db21wb25lbnQsXG5dO1xuY29uc3QgTU9EVUxFUyA9IFtcbiAgQ29tbW9uTW9kdWxlLFxuICBBWENvbW1vbk1vZHVsZSxcbiAgU2Nyb2xsaW5nTW9kdWxlLFxuICBBWFRyYW5zbGF0aW9uTW9kdWxlLFxuICBBWFJlc3VsdE1vZHVsZSxcbiAgQVhMb2FkaW5nTW9kdWxlLFxuICBBWERlY29yYXRvck1vZHVsZSxcbiAgQVhTa2VsZXRvbk1vZHVsZSxcbiAgQVhCdXR0b25Nb2R1bGUsXG4gIEFYRHJvcGRvd25Nb2R1bGUsXG4gIEFYRm9ybWF0TW9kdWxlLFxuICBBWFJpcHBsZURpcmVjdGl2ZSxcbl07XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogWy4uLkNPTVBPTkVOVF0sXG4gIGltcG9ydHM6IFsuLi5NT0RVTEVTXSxcbiAgZXhwb3J0czogWy4uLkNPTVBPTkVOVF0sXG4gIHByb3ZpZGVyczogW10sXG59KVxuZXhwb3J0IGNsYXNzIEFYRGF0YVRhYmxlTW9kdWxlIHt9XG4iXX0=

package/esm2022/decorators/lib/components/generic-content.component.mjs

@@ -3,7 +3,7 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/
 import * as i0 from "@angular/core";
 export class AXDecoratorGenericComponent extends MXBaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDecoratorGenericComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title", providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: 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", providers: [
             { provide: 'ax-footer', useExisting: AXDecoratorGenericComponent },
             { provide: 'ax-header', useExisting: AXDecoratorGenericComponent },
             { provide: 'ax-content', useExisting: AXDecoratorGenericComponent },
@@ -14,12 +14,14 @@ export class AXDecoratorGenericComponent extends MXBaseComponent {
             { provide: 'ax-text', useExisting: AXDecoratorGenericComponent },
             { provide: 'ax-title', useExisting: AXDecoratorGenericComponent },
             { provide: 'ax-sub-title', useExisting: AXDecoratorGenericComponent },
+            { provide: 'ax-placeholder', useExisting: AXDecoratorGenericComponent },
+            { provide: 'ax-overlay', useExisting: AXDecoratorGenericComponent },
         ], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDecoratorGenericComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title',
+                    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',
                     template: `<ng-content></ng-content>`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
@@ -34,7 +36,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                         { provide: 'ax-text', useExisting: AXDecoratorGenericComponent },
                         { provide: 'ax-title', useExisting: AXDecoratorGenericComponent },
                         { provide: 'ax-sub-title', useExisting: AXDecoratorGenericComponent },
+                        { provide: 'ax-placeholder', useExisting: AXDecoratorGenericComponent },
+                        { provide: 'ax-overlay', useExisting: AXDecoratorGenericComponent },
                     ],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ2VuZXJpYy1jb250ZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9kZWNvcmF0b3JzL3NyYy9saWIvY29tcG9uZW50cy9nZW5lcmljLWNvbnRlbnQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQXFCdEYsTUFBTSxPQUFPLDJCQUE0QixTQUFRLGVBQWU7OEdBQW5ELDJCQUEyQjtrR0FBM0IsMkJBQTJCLDZJQWIzQjtZQUNULEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbEUsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNsRSxFQUFFLE9BQU8sRUFBRSxZQUFZLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ25FLEVBQUUsT0FBTyxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbkUsRUFBRSxPQUFPLEVBQUUsY0FBYyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNyRSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ2xFLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbEUsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNoRSxFQUFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ2pFLEVBQUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7U0FDdEUsaURBZFMsMkJBQTJCOzsyRkFnQjFCLDJCQUEyQjtrQkFuQnZDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUNOLG9IQUFvSDtvQkFDdEgsUUFBUSxFQUFFLDJCQUEyQjtvQkFDckMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07b0JBQy9DLGFBQWEsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJO29CQUNyQyxTQUFTLEVBQUU7d0JBQ1QsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ2xFLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNsRSxFQUFFLE9BQU8sRUFBRSxZQUFZLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDbkUsRUFBRSxPQUFPLEVBQUUsWUFBWSxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ25FLEVBQUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNyRSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDbEUsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ2xFLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNoRSxFQUFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDakUsRUFBRSxPQUFPLEVBQUUsY0FBYyxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7cUJBQ3RFO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTVhCYXNlQ29tcG9uZW50IH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6XG4gICAgJ2F4LWZvb3RlciwgYXgtaGVhZGVyLCBheC1jb250ZW50LCBheC1kaXZpZGVyLCBheC1mb3JtLWhpbnQsIGF4LXByZWZpeCwgYXgtc3VmZml4LCBheC10ZXh0LCBheC10aXRsZSAsIGF4LXN1Yi10aXRsZScsXG4gIHRlbXBsYXRlOiBgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PmAsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBwcm92aWRlcnM6IFtcbiAgICB7IHByb3ZpZGU6ICdheC1mb290ZXInLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtaGVhZGVyJywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LWNvbnRlbnQnLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtZGl2aWRlcicsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC1mb3JtLWhpbnQnLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtcHJlZml4JywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXN1ZmZpeCcsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC10ZXh0JywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXRpdGxlJywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXN1Yi10aXRsZScsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IGV4dGVuZHMgTVhCYXNlQ29tcG9uZW50IHt9XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ2VuZXJpYy1jb250ZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9kZWNvcmF0b3JzL3NyYy9saWIvY29tcG9uZW50cy9nZW5lcmljLWNvbnRlbnQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQXVCdEYsTUFBTSxPQUFPLDJCQUE0QixTQUFRLGVBQWU7OEdBQW5ELDJCQUEyQjtrR0FBM0IsMkJBQTJCLHlLQWYzQjtZQUNULEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbEUsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNsRSxFQUFFLE9BQU8sRUFBRSxZQUFZLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ25FLEVBQUUsT0FBTyxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbkUsRUFBRSxPQUFPLEVBQUUsY0FBYyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNyRSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ2xFLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDbEUsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSwyQkFBMkIsRUFBRTtZQUNoRSxFQUFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ2pFLEVBQUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7WUFDckUsRUFBRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsV0FBVyxFQUFFLDJCQUEyQixFQUFFO1lBQ3ZFLEVBQUUsT0FBTyxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsMkJBQTJCLEVBQUU7U0FDcEUsaURBaEJTLDJCQUEyQjs7MkZBa0IxQiwyQkFBMkI7a0JBckJ2QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFDTixnSkFBZ0o7b0JBQ2xKLFFBQVEsRUFBRSwyQkFBMkI7b0JBQ3JDLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtvQkFDckMsU0FBUyxFQUFFO3dCQUNULEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNsRSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDbEUsRUFBRSxPQUFPLEVBQUUsWUFBWSxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ25FLEVBQUUsT0FBTyxFQUFFLFlBQVksRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNuRSxFQUFFLE9BQU8sRUFBRSxjQUFjLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDckUsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ2xFLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNsRSxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTt3QkFDaEUsRUFBRSxPQUFPLEVBQUUsVUFBVSxFQUFFLFdBQVcsNkJBQTZCLEVBQUU7d0JBQ2pFLEVBQUUsT0FBTyxFQUFFLGNBQWMsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUNyRSxFQUFFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxXQUFXLDZCQUE2QixFQUFFO3dCQUN2RSxFQUFFLE9BQU8sRUFBRSxZQUFZLEVBQUUsV0FBVyw2QkFBNkIsRUFBRTtxQkFDcEU7aUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBNWEJhc2VDb21wb25lbnQgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjpcbiAgICAnYXgtZm9vdGVyLCBheC1oZWFkZXIsIGF4LWNvbnRlbnQsIGF4LWRpdmlkZXIsIGF4LWZvcm0taGludCwgYXgtcHJlZml4LCBheC1zdWZmaXgsIGF4LXRleHQsIGF4LXRpdGxlICwgYXgtc3ViLXRpdGxlLCBheC1wbGFjZWhvbGRlciwgYXgtb3ZlcmxheScsXG4gIHRlbXBsYXRlOiBgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PmAsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBwcm92aWRlcnM6IFtcbiAgICB7IHByb3ZpZGU6ICdheC1mb290ZXInLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtaGVhZGVyJywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LWNvbnRlbnQnLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtZGl2aWRlcicsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC1mb3JtLWhpbnQnLCB1c2VFeGlzdGluZzogQVhEZWNvcmF0b3JHZW5lcmljQ29tcG9uZW50IH0sXG4gICAgeyBwcm92aWRlOiAnYXgtcHJlZml4JywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXN1ZmZpeCcsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC10ZXh0JywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXRpdGxlJywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICAgIHsgcHJvdmlkZTogJ2F4LXN1Yi10aXRsZScsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC1wbGFjZWhvbGRlcicsIHVzZUV4aXN0aW5nOiBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgfSxcbiAgICB7IHByb3ZpZGU6ICdheC1vdmVybGF5JywgdXNlRXhpc3Rpbmc6IEFYRGVjb3JhdG9yR2VuZXJpY0NvbXBvbmVudCB9LFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBBWERlY29yYXRvckdlbmVyaWNDb21wb25lbnQgZXh0ZW5kcyBNWEJhc2VDb21wb25lbnQge31cbiJdfQ==

package/esm2022/dialog/lib/dialog.component.mjs

@@ -39,7 +39,7 @@ export class AXDialogComponent extends MXBaseComponent {
                 provide: AXClosbaleComponent,
                 useExisting: AXDialogComponent,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-secondary),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-secondary),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-success),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-success),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-warning),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-warning),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-danger),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-danger),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-info),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-info),var(--tw-text-opacity)),black 30%)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "focus-time"] }, { kind: "directive", type: i3.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i6.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\"\n  cdkDrag\n  cdkDragHandle\n  tabindex=\"-1\"\n>\n  <div class=\"ax-dialog-content-wrapper\">\n    <div class=\"ax-dialog-icon-side\" *ngIf=\"data.icon !== 'none'\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      <i class=\"ax-icon ax-icon-close\" *ngIf=\"data.closeButton\"></i>\n    </div>\n  </div>\n  <ax-footer>\n    <ng-container *ngFor=\"let button of data.buttons; let i = index\">\n      <ax-button\n        [text]=\"button.text\"\n        [tabindex]=\"i\"\n        [axHotkey]=\"button.hotkey\"\n        [axAutoFocus]=\"_hasAutoFocus(button)\"\n        (onClick)=\"_handleButtonClick(button)\"\n        [look]=\"button.look\"\n        [disabled]=\"button.disabled\"\n        [color]=\"button.color\"\n      >\n        <ax-loading *ngIf=\"button.loading\"></ax-loading>\n      </ax-button>\n    </ng-container>\n  </ax-footer>\n</div>\n", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-primary),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-primary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-secondary),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-secondary-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-success),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-success-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-warning),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-warning-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-danger),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-danger-fore),var(--tw-text-opacity))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-info),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-info-fore),var(--tw-text-opacity))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;font-weight:500;line-height:1.5rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-primary),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-secondary-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-secondary),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-secondary),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-success-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-success),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-success),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-warning-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-warning),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-warning),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-danger-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-danger),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-danger),var(--tw-text-opacity)),black 30%)}.ax-dialog.ax-info-default .ax-dialog-icon{--tw-bg-opacity: 1;background-color:color-mix(in srgb,rgba(var(--ax-color-info),var(--tw-bg-opacity)) 10%,white);--tw-text-opacity: 1;color:color-mix(in srgb,rgba(var(--ax-color-info),var(--tw-text-opacity)),black 30%)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "directive", type: i3.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i6.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: i7.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXDialogComponent, decorators: [{
             type: Component,

package/esm2022/form/lib/validation-summary.component.mjs

@@ -71,7 +71,7 @@ export class AXValidationSummaryComponent extends MXBaseComponent {
         </ax-suffix>
       </ax-footer>
     </ax-alert>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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" }, { kind: "component", type: i4.AXAlertComponent, selector: "ax-alert", inputs: ["color", "timeOut", "visible"], outputs: ["colorChange", "onClosed"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.AXAlertComponent, selector: "ax-alert", inputs: ["color", "timeOut", "visible"], outputs: ["colorChange", "onClosed"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXValidationSummaryComponent, decorators: [{
             type: Component,

package/esm2022/image/lib/image.component.mjs

@@ -5,6 +5,7 @@ import * as i1 from "@angular/common";
 export class AXImageComponent extends MXBaseComponent {
     constructor() {
         super(...arguments);
+        this.overlayMode = 'hover';
         this.priority = 'auto';
         this.onLoad = new EventEmitter();
         this.onError = new EventEmitter();
@@ -38,19 +39,22 @@ export class AXImageComponent extends MXBaseComponent {
             nativeEvent: e,
         });
     }
-    get __stateError() {
-        return this._hasError || !this.src;
-    }
-    get __stateLoading() {
-        return this._isLoading;
+    get __hostClass() {
+        return [
+            `ax-overlay-${this.overlayMode}`,
+            `${this._hasError || !this.src ? 'ax-state-empty' : ''}`,
+            `${this._isLoading ? 'ax-state-loading' : ''}`,
+        ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: AXImageComponent, selector: "ax-image", inputs: { src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class.ax-state-empty": "this.__stateError", "class.ax-state-loading": "this.__stateLoading" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\" />\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:block;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image:not(.ax-state-empty,.ax-state-loading):hover ax-overlay[data-overlay-mode=hover]{display:flex}@keyframes ax-fadeIn{0%{opacity:0}}ax-image:not(.ax-state-empty,.ax-state-loading):hover ax-overlay[data-overlay-mode=hover]{animation:1s both ax-fadeIn;animation-duration:.5s}ax-image img{height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#00000080}ax-image ax-overlay[data-overlay-mode=hover]{display:none}ax-image ax-loading{height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: AXImageComponent, selector: "ax-image", inputs: { overlayMode: "overlayMode", src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#000000bf}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: AXImageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-image', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\" />\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:block;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image:not(.ax-state-empty,.ax-state-loading):hover ax-overlay[data-overlay-mode=hover]{display:flex}@keyframes ax-fadeIn{0%{opacity:0}}ax-image:not(.ax-state-empty,.ax-state-loading):hover ax-overlay[data-overlay-mode=hover]{animation:1s both ax-fadeIn;animation-duration:.5s}ax-image img{height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#00000080}ax-image ax-overlay[data-overlay-mode=hover]{display:none}ax-image ax-loading{height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"] }]
-        }], propDecorators: { src: [{
+            args: [{ selector: 'ax-image', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], template: "<img\n  *ngIf=\"src\"\n  class=\"ax-state-hidden\"\n  [class.ax-state-loaded]=\"_isLoaded\"\n  [src]=\"src\"\n  [alt]=\"alt\"\n  [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\"\n  (load)=\"_handleLoadImage($event)\"\n  (error)=\"_handleErrorImage($event)\"\n/>\n<ng-content select=\"ax-overlay\"></ng-content>\n<ng-container *ngIf=\"!src || _hasError\">\n  <ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"_isLoading\">\n  <ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n</ng-container>\n", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#000000bf}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;--tw-bg-opacity: 1;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity))}\n"] }]
+        }], propDecorators: { overlayMode: [{
+                type: Input
+            }], src: [{
                 type: Input
             }], alt: [{
                 type: Input
@@ -62,11 +66,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                 type: Output
             }], onError: [{
                 type: Output
-            }], __stateError: [{
-                type: HostBinding,
-                args: ['class.ax-state-empty']
-            }], __stateLoading: [{
+            }], __hostClass: [{
                 type: HostBinding,
-                args: ['class.ax-state-loading']
+                args: ['class']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2ltYWdlL3NyYy9saWIvaW1hZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2ltYWdlL3NyYy9saWIvaW1hZ2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFlLGVBQWUsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQ3pFLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixXQUFXLEVBQ1gsS0FBSyxFQUVMLE1BQU0sRUFDTixpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7OztBQVV2QixNQUFNLE9BQU8sZ0JBQWlCLFNBQVEsZUFBZTtJQVJyRDs7UUFnQkUsYUFBUSxHQUE0QixNQUFNLENBQUM7UUFNM0MsV0FBTSxHQUE4QixJQUFJLFlBQVksRUFBZSxDQUFDO1FBR3BFLFlBQU8sR0FBMEMsSUFBSSxZQUFZLEVBQTJCLENBQUM7UUFFbkYsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUNsQixjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGVBQVUsR0FBRyxLQUFLLENBQUM7S0F3QzlCO0lBdENDLFFBQVE7UUFDTixLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDakIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsR0FBRyxJQUFJLElBQUksQ0FBQztJQUNyQyxDQUFDO0lBRUQsZ0JBQWdCLENBQUMsQ0FBUTtRQUN2QixJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztRQUN0QixJQUFJLENBQUMsU0FBUyxHQUFHLEtBQUssQ0FBQztRQUN2QixJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztRQUN4QixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQztZQUNmLFNBQVMsRUFBRSxJQUFJO1lBQ2YsV0FBVyxFQUFFLElBQUksQ0FBQyxjQUFjLEVBQUU7WUFDbEMsaUJBQWlCLEVBQUUsS0FBSztZQUN4QixXQUFXLEVBQUUsQ0FBQztTQUNmLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxpQkFBaUIsQ0FBQyxDQUFhO1FBQzdCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDO1FBQ3RCLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxVQUFVLEdBQUcsS0FBSyxDQUFDO1FBQ3hCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDO1lBQ2hCLFNBQVMsRUFBRSxJQUFJO1lBQ2YsV0FBVyxFQUFFLElBQUksQ0FBQyxjQUFjLEVBQUU7WUFDbEMsaUJBQWlCLEVBQUUsS0FBSztZQUN4QixXQUFXLEVBQUUsQ0FBQztTQUNmLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxJQUNJLFlBQVk7UUFDZCxPQUFPLElBQUksQ0FBQyxTQUFTLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxJQUNJLGNBQWM7UUFDaEIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQ3pCLENBQUM7OEdBNURVLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLHNSQUZoQixDQUFDLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRSxRQUFRLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxpRENsQmxFLHFqQkFpQkE7OzJGREdhLGdCQUFnQjtrQkFSNUIsU0FBUzsrQkFDRSxVQUFVLGlCQUdMLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sYUFDcEMsQ0FBQyxFQUFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsUUFBUSxrQkFBa0IsRUFBRSxDQUFDOzhCQUloRSxHQUFHO3NCQURGLEtBQUs7Z0JBSU4sR0FBRztzQkFERixLQUFLO2dCQUlOLFFBQVE7c0JBRFAsS0FBSztnQkFJTixJQUFJO3NCQURILEtBQUs7Z0JBSU4sTUFBTTtzQkFETCxNQUFNO2dCQUlQLE9BQU87c0JBRE4sTUFBTTtnQkFxQ0gsWUFBWTtzQkFEZixXQUFXO3VCQUFDLHNCQUFzQjtnQkFNL0IsY0FBYztzQkFEakIsV0FBVzt1QkFBQyx3QkFBd0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBWEh0bWxFdmVudCwgTVhCYXNlQ29tcG9uZW50IH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL2NvbW1vbic7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIEhvc3RCaW5kaW5nLFxuICBJbnB1dCxcbiAgT25Jbml0LFxuICBPdXRwdXQsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXgtaW1hZ2UnLFxuICB0ZW1wbGF0ZVVybDogJy4vaW1hZ2UuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9pbWFnZS5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgcHJvdmlkZXJzOiBbeyBwcm92aWRlOiAnYXgtaW1hZ2UnLCB1c2VWYWx1ZTogQVhJbWFnZUNvbXBvbmVudCB9XSxcbn0pXG5leHBvcnQgY2xhc3MgQVhJbWFnZUNvbXBvbmVudCBleHRlbmRzIE1YQmFzZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpXG4gIHNyYz86IHN0cmluZyB8IG51bGw7XG5cbiAgQElucHV0KClcbiAgYWx0Pzogc3RyaW5nIHwgbnVsbDtcblxuICBASW5wdXQoKVxuICBwcmlvcml0eTogJ2xvdycgfCAnYXV0bycgfCAnaGlnaCcgPSAnYXV0byc7XG5cbiAgQElucHV0KClcbiAgbGF6eTogZmFsc2U7XG5cbiAgQE91dHB1dCgpXG4gIG9uTG9hZDogRXZlbnRFbWl0dGVyPEFYSHRtbEV2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXI8QVhIdG1sRXZlbnQ+KCk7XG5cbiAgQE91dHB1dCgpXG4gIG9uRXJyb3I6IEV2ZW50RW1pdHRlcjxBWEh0bWxFdmVudDxFcnJvckV2ZW50Pj4gPSBuZXcgRXZlbnRFbWl0dGVyPEFYSHRtbEV2ZW50PEVycm9yRXZlbnQ+PigpO1xuXG4gIHByb3RlY3RlZCBfaGFzRXJyb3IgPSBmYWxzZTtcbiAgcHJvdGVjdGVkIF9pc0xvYWRlZCA9IGZhbHNlO1xuICBwcm90ZWN0ZWQgX2lzTG9hZGluZyA9IGZhbHNlO1xuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHN1cGVyLm5nT25Jbml0KCk7XG4gICAgdGhpcy5faXNMb2FkaW5nID0gdGhpcy5zcmMgIT0gbnVsbDtcbiAgfVxuXG4gIF9oYW5kbGVMb2FkSW1hZ2UoZTogRXZlbnQpIHtcbiAgICB0aGlzLl9pc0xvYWRlZCA9IHRydWU7XG4gICAgdGhpcy5faGFzRXJyb3IgPSBmYWxzZTtcbiAgICB0aGlzLl9pc0xvYWRpbmcgPSBmYWxzZTtcbiAgICB0aGlzLm9uTG9hZC5lbWl0KHtcbiAgICAgIGNvbXBvbmVudDogdGhpcyxcbiAgICAgIGh0bWxFbGVtZW50OiB0aGlzLmdldEhvc3RFbGVtZW50KCksXG4gICAgICBpc1VzZXJJbnRlcmFjdGlvbjogZmFsc2UsXG4gICAgICBuYXRpdmVFdmVudDogZSxcbiAgICB9KTtcbiAgfVxuXG4gIF9oYW5kbGVFcnJvckltYWdlKGU6IEVycm9yRXZlbnQpIHtcbiAgICB0aGlzLl9oYXNFcnJvciA9IHRydWU7XG4gICAgdGhpcy5faXNMb2FkZWQgPSBmYWxzZTtcbiAgICB0aGlzLl9pc0xvYWRpbmcgPSBmYWxzZTtcbiAgICB0aGlzLm9uRXJyb3IuZW1pdCh7XG4gICAgICBjb21wb25lbnQ6IHRoaXMsXG4gICAgICBodG1sRWxlbWVudDogdGhpcy5nZXRIb3N0RWxlbWVudCgpLFxuICAgICAgaXNVc2VySW50ZXJhY3Rpb246IGZhbHNlLFxuICAgICAgbmF0aXZlRXZlbnQ6IGUsXG4gICAgfSk7XG4gIH1cblxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmF4LXN0YXRlLWVtcHR5JylcbiAgZ2V0IF9fc3RhdGVFcnJvcigpIHtcbiAgICByZXR1cm4gdGhpcy5faGFzRXJyb3IgfHwgIXRoaXMuc3JjO1xuICB9XG5cbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5heC1zdGF0ZS1sb2FkaW5nJylcbiAgZ2V0IF9fc3RhdGVMb2FkaW5nKCkge1xuICAgIHJldHVybiB0aGlzLl9pc0xvYWRpbmc7XG4gIH1cbn1cbiIsIjxpbWdcbiAgKm5nSWY9XCJzcmNcIlxuICBjbGFzcz1cImF4LXN0YXRlLWhpZGRlblwiXG4gIFtjbGFzcy5heC1zdGF0ZS1sb2FkZWRdPVwiX2lzTG9hZGVkXCJcbiAgW3NyY109XCJzcmNcIlxuICBbYWx0XT1cImFsdFwiXG4gIFthdHRyLmZldGNocHJpb3JpdHldPVwicHJpb3JpdHlcIlxuICBbYXR0ci5sb2FkaW5nXT1cImxhenkgPyAnbGF6eScgOiAnZWFnZXInXCJcbiAgKGxvYWQpPVwiX2hhbmRsZUxvYWRJbWFnZSgkZXZlbnQpXCJcbiAgKGVycm9yKT1cIl9oYW5kbGVFcnJvckltYWdlKCRldmVudClcIiAvPlxuPG5nLWNvbnRlbnQgc2VsZWN0PVwiYXgtb3ZlcmxheVwiPjwvbmctY29udGVudD5cbjxuZy1jb250YWluZXIgKm5nSWY9XCIhc3JjIHx8IF9oYXNFcnJvclwiPlxuICA8bmctY29udGVudCBzZWxlY3Q9XCJheC1wbGFjZWhvbGRlclwiPjwvbmctY29udGVudD5cbjwvbmctY29udGFpbmVyPlxuPG5nLWNvbnRhaW5lciAqbmdJZj1cIl9pc0xvYWRpbmdcIj5cbiAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiYXgtbG9hZGluZ1wiPjwvbmctY29udGVudD5cbjwvbmctY29udGFpbmVyPlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2ltYWdlL3NyYy9saWIvaW1hZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2ltYWdlL3NyYy9saWIvaW1hZ2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFlLGVBQWUsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQ3pFLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixXQUFXLEVBQ1gsS0FBSyxFQUVMLE1BQU0sRUFDTixpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7OztBQVV2QixNQUFNLE9BQU8sZ0JBQWlCLFNBQVEsZUFBZTtJQVJyRDs7UUFVRSxnQkFBVyxHQUF1QixPQUFPLENBQUM7UUFTMUMsYUFBUSxHQUE0QixNQUFNLENBQUM7UUFNM0MsV0FBTSxHQUE4QixJQUFJLFlBQVksRUFBZSxDQUFDO1FBR3BFLFlBQU8sR0FBMEMsSUFBSSxZQUFZLEVBQTJCLENBQUM7UUFFbkYsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUNsQixjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGVBQVUsR0FBRyxLQUFLLENBQUM7S0F1QzlCO0lBckNDLFFBQVE7UUFDTixLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDakIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsR0FBRyxJQUFJLElBQUksQ0FBQztJQUNyQyxDQUFDO0lBRUQsZ0JBQWdCLENBQUMsQ0FBUTtRQUN2QixJQUFJLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztRQUN0QixJQUFJLENBQUMsU0FBUyxHQUFHLEtBQUssQ0FBQztRQUN2QixJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztRQUN4QixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQztZQUNmLFNBQVMsRUFBRSxJQUFJO1lBQ2YsV0FBVyxFQUFFLElBQUksQ0FBQyxjQUFjLEVBQUU7WUFDbEMsaUJBQWlCLEVBQUUsS0FBSztZQUN4QixXQUFXLEVBQUUsQ0FBQztTQUNmLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxpQkFBaUIsQ0FBQyxDQUFhO1FBQzdCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDO1FBQ3RCLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxVQUFVLEdBQUcsS0FBSyxDQUFDO1FBQ3hCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDO1lBQ2hCLFNBQVMsRUFBRSxJQUFJO1lBQ2YsV0FBVyxFQUFFLElBQUksQ0FBQyxjQUFjLEVBQUU7WUFDbEMsaUJBQWlCLEVBQUUsS0FBSztZQUN4QixXQUFXLEVBQUUsQ0FBQztTQUNmLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxJQUNJLFdBQVc7UUFDYixPQUFPO1lBQ0wsY0FBYyxJQUFJLENBQUMsV0FBVyxFQUFFO1lBQ2hDLEdBQUcsSUFBSSxDQUFDLFNBQVMsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7WUFDeEQsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFO1NBQy9DLENBQUM7SUFDSixDQUFDOzhHQTlEVSxnQkFBZ0I7a0dBQWhCLGdCQUFnQixpUEFGaEIsQ0FBQyxFQUFFLE9BQU8sRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLGdCQUFnQixFQUFFLENBQUMsaURDbEJsRSxzbEJBa0JBOzsyRkRFYSxnQkFBZ0I7a0JBUjVCLFNBQVM7K0JBQ0UsVUFBVSxpQkFHTCxpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDLENBQUMsRUFBRSxPQUFPLEVBQUUsVUFBVSxFQUFFLFFBQVEsa0JBQWtCLEVBQUUsQ0FBQzs4QkFJaEUsV0FBVztzQkFEVixLQUFLO2dCQUlOLEdBQUc7c0JBREYsS0FBSztnQkFJTixHQUFHO3NCQURGLEtBQUs7Z0JBSU4sUUFBUTtzQkFEUCxLQUFLO2dCQUlOLElBQUk7c0JBREgsS0FBSztnQkFJTixNQUFNO3NCQURMLE1BQU07Z0JBSVAsT0FBTztzQkFETixNQUFNO2dCQXFDSCxXQUFXO3NCQURkLFdBQVc7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFYSHRtbEV2ZW50LCBNWEJhc2VDb21wb25lbnQgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvY29tbW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSG9zdEJpbmRpbmcsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdheC1pbWFnZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9pbWFnZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2ltYWdlLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFt7IHByb3ZpZGU6ICdheC1pbWFnZScsIHVzZVZhbHVlOiBBWEltYWdlQ29tcG9uZW50IH1dLFxufSlcbmV4cG9ydCBjbGFzcyBBWEltYWdlQ29tcG9uZW50IGV4dGVuZHMgTVhCYXNlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgQElucHV0KClcbiAgb3ZlcmxheU1vZGU6ICdhbHdheXMnIHwgJ2hvdmVyJyA9ICdob3Zlcic7XG5cbiAgQElucHV0KClcbiAgc3JjPzogc3RyaW5nIHwgbnVsbDtcblxuICBASW5wdXQoKVxuICBhbHQ/OiBzdHJpbmcgfCBudWxsO1xuXG4gIEBJbnB1dCgpXG4gIHByaW9yaXR5OiAnbG93JyB8ICdhdXRvJyB8ICdoaWdoJyA9ICdhdXRvJztcblxuICBASW5wdXQoKVxuICBsYXp5OiBmYWxzZTtcblxuICBAT3V0cHV0KClcbiAgb25Mb2FkOiBFdmVudEVtaXR0ZXI8QVhIdG1sRXZlbnQ+ID0gbmV3IEV2ZW50RW1pdHRlcjxBWEh0bWxFdmVudD4oKTtcblxuICBAT3V0cHV0KClcbiAgb25FcnJvcjogRXZlbnRFbWl0dGVyPEFYSHRtbEV2ZW50PEVycm9yRXZlbnQ+PiA9IG5ldyBFdmVudEVtaXR0ZXI8QVhIdG1sRXZlbnQ8RXJyb3JFdmVudD4+KCk7XG5cbiAgcHJvdGVjdGVkIF9oYXNFcnJvciA9IGZhbHNlO1xuICBwcm90ZWN0ZWQgX2lzTG9hZGVkID0gZmFsc2U7XG4gIHByb3RlY3RlZCBfaXNMb2FkaW5nID0gZmFsc2U7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgc3VwZXIubmdPbkluaXQoKTtcbiAgICB0aGlzLl9pc0xvYWRpbmcgPSB0aGlzLnNyYyAhPSBudWxsO1xuICB9XG5cbiAgX2hhbmRsZUxvYWRJbWFnZShlOiBFdmVudCkge1xuICAgIHRoaXMuX2lzTG9hZGVkID0gdHJ1ZTtcbiAgICB0aGlzLl9oYXNFcnJvciA9IGZhbHNlO1xuICAgIHRoaXMuX2lzTG9hZGluZyA9IGZhbHNlO1xuICAgIHRoaXMub25Mb2FkLmVtaXQoe1xuICAgICAgY29tcG9uZW50OiB0aGlzLFxuICAgICAgaHRtbEVsZW1lbnQ6IHRoaXMuZ2V0SG9zdEVsZW1lbnQoKSxcbiAgICAgIGlzVXNlckludGVyYWN0aW9uOiBmYWxzZSxcbiAgICAgIG5hdGl2ZUV2ZW50OiBlLFxuICAgIH0pO1xuICB9XG5cbiAgX2hhbmRsZUVycm9ySW1hZ2UoZTogRXJyb3JFdmVudCkge1xuICAgIHRoaXMuX2hhc0Vycm9yID0gdHJ1ZTtcbiAgICB0aGlzLl9pc0xvYWRlZCA9IGZhbHNlO1xuICAgIHRoaXMuX2lzTG9hZGluZyA9IGZhbHNlO1xuICAgIHRoaXMub25FcnJvci5lbWl0KHtcbiAgICAgIGNvbXBvbmVudDogdGhpcyxcbiAgICAgIGh0bWxFbGVtZW50OiB0aGlzLmdldEhvc3RFbGVtZW50KCksXG4gICAgICBpc1VzZXJJbnRlcmFjdGlvbjogZmFsc2UsXG4gICAgICBuYXRpdmVFdmVudDogZSxcbiAgICB9KTtcbiAgfVxuXG4gIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICBnZXQgX19ob3N0Q2xhc3MoKTogc3RyaW5nW10ge1xuICAgIHJldHVybiBbXG4gICAgICBgYXgtb3ZlcmxheS0ke3RoaXMub3ZlcmxheU1vZGV9YCxcbiAgICAgIGAke3RoaXMuX2hhc0Vycm9yIHx8ICF0aGlzLnNyYyA/ICdheC1zdGF0ZS1lbXB0eScgOiAnJ31gLFxuICAgICAgYCR7dGhpcy5faXNMb2FkaW5nID8gJ2F4LXN0YXRlLWxvYWRpbmcnIDogJyd9YCxcbiAgICBdO1xuICB9XG59XG4iLCI8aW1nXG4gICpuZ0lmPVwic3JjXCJcbiAgY2xhc3M9XCJheC1zdGF0ZS1oaWRkZW5cIlxuICBbY2xhc3MuYXgtc3RhdGUtbG9hZGVkXT1cIl9pc0xvYWRlZFwiXG4gIFtzcmNdPVwic3JjXCJcbiAgW2FsdF09XCJhbHRcIlxuICBbYXR0ci5mZXRjaHByaW9yaXR5XT1cInByaW9yaXR5XCJcbiAgW2F0dHIubG9hZGluZ109XCJsYXp5ID8gJ2xhenknIDogJ2VhZ2VyJ1wiXG4gIChsb2FkKT1cIl9oYW5kbGVMb2FkSW1hZ2UoJGV2ZW50KVwiXG4gIChlcnJvcik9XCJfaGFuZGxlRXJyb3JJbWFnZSgkZXZlbnQpXCJcbi8+XG48bmctY29udGVudCBzZWxlY3Q9XCJheC1vdmVybGF5XCI+PC9uZy1jb250ZW50PlxuPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFzcmMgfHwgX2hhc0Vycm9yXCI+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cImF4LXBsYWNlaG9sZGVyLCBuZy1jb250ZW50XCI+PC9uZy1jb250ZW50PlxuPC9uZy1jb250YWluZXI+XG48bmctY29udGFpbmVyICpuZ0lmPVwiX2lzTG9hZGluZ1wiPlxuICA8bmctY29udGVudCBzZWxlY3Q9XCJheC1sb2FkaW5nLCBheC1sb2FkaW5nLXNwaW5uZXJcIj48L25nLWNvbnRlbnQ+XG48L25nLWNvbnRhaW5lcj5cbiJdfQ==