@energycap/components 0.42.4-esbuild.20250131-1441 → 0.43.0

package/esm2022/lib/display/json-display/json-display.component.mjs

@@ -28,10 +28,10 @@ export class JsonDisplayComponent {
             this.jsonDisplay.patchValue(display);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: JsonDisplayComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: JsonDisplayComponent, selector: "ec-json-display", inputs: { id: "id", jsonString: "jsonString", maxLength: "maxLength" }, host: { properties: { "attr.id": "this.attrId" } }, usesOnChanges: true, ngImport: i0, template: "<ec-button id=\"{{id}}_copy\"\r\n           class=\"copy-button\"\r\n           *ngIf=\"jsonDisplay.value\"\r\n           type=\"icon\"\r\n           icon=\"icon-copy\"\r\n           [ecCopyButton]=\"jsonDisplay\">\r\n</ec-button>\r\n<pre><code>{{jsonDisplay.value}}</code></pre>", styles: [":host{display:block;position:relative;color:var(--ec-color-primary-light);background:#354751;max-height:15rem;min-height:2.125rem;font-size:var(--ec-font-size-label);border-radius:var(--ec-border-radius-card);overflow-x:auto;overflow-y:auto;text-align:right}pre{margin-bottom:0;margin-top:-2rem;text-align:left}pre code{display:block;padding:.5rem}.copy-button{position:sticky;top:0}.copy-button ::ng-deep .ec-icon{color:var(--ec-color-secondary-light)!important}.copy-button ::ng-deep button:hover{background-color:transparent!important}.copy-button ::ng-deep button:hover .ec-icon{color:var(--ec-color-primary-light)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "directive", type: i4.CopyButtonDirective, selector: "[ecCopyButton]", inputs: ["ecCopyButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JsonDisplayComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: JsonDisplayComponent, selector: "ec-json-display", inputs: { id: "id", jsonString: "jsonString", maxLength: "maxLength" }, host: { properties: { "attr.id": "this.attrId" } }, usesOnChanges: true, ngImport: i0, template: "<ec-button id=\"{{id}}_copy\"\r\n           class=\"copy-button\"\r\n           *ngIf=\"jsonDisplay.value\"\r\n           type=\"icon\"\r\n           icon=\"icon-copy\"\r\n           [ecCopyButton]=\"jsonDisplay\">\r\n</ec-button>\r\n<pre><code>{{jsonDisplay.value}}</code></pre>", styles: [":host{display:block;position:relative;color:var(--ec-color-primary-light);background:#354751;max-height:15rem;min-height:2.125rem;font-size:var(--ec-font-size-label);border-radius:var(--ec-border-radius-card);overflow-x:auto;overflow-y:auto;text-align:right}pre{margin-bottom:0;margin-top:-2rem;text-align:left}pre code{display:block;padding:.5rem}.copy-button{position:sticky;top:0}.copy-button ::ng-deep .ec-icon{color:var(--ec-color-secondary-light)!important}.copy-button ::ng-deep button:hover{background-color:transparent!important}.copy-button ::ng-deep button:hover .ec-icon{color:var(--ec-color-primary-light)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "directive", type: i4.CopyButtonDirective, selector: "[ecCopyButton]", inputs: ["ecCopyButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: JsonDisplayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JsonDisplayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-json-display', template: "<ec-button id=\"{{id}}_copy\"\r\n           class=\"copy-button\"\r\n           *ngIf=\"jsonDisplay.value\"\r\n           type=\"icon\"\r\n           icon=\"icon-copy\"\r\n           [ecCopyButton]=\"jsonDisplay\">\r\n</ec-button>\r\n<pre><code>{{jsonDisplay.value}}</code></pre>", styles: [":host{display:block;position:relative;color:var(--ec-color-primary-light);background:#354751;max-height:15rem;min-height:2.125rem;font-size:var(--ec-font-size-label);border-radius:var(--ec-border-radius-card);overflow-x:auto;overflow-y:auto;text-align:right}pre{margin-bottom:0;margin-top:-2rem;text-align:left}pre code{display:block;padding:.5rem}.copy-button{position:sticky;top:0}.copy-button ::ng-deep .ec-icon{color:var(--ec-color-secondary-light)!important}.copy-button ::ng-deep button:hover{background-color:transparent!important}.copy-button ::ng-deep button:hover .ec-icon{color:var(--ec-color-primary-light)!important}\n"] }]
         }], ctorParameters: () => [{ type: i1.TranslateService }], propDecorators: { id: [{

package/esm2022/lib/display/resizable/resizable-base.mjs

@@ -104,10 +104,10 @@ export class ResizableBase {
             console.error('rememberWidth is set but will not take effect unless ID is also set');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableBase, deps: [{ token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: ResizableBase, inputs: { rememberWidth: "rememberWidth", id: "id" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableBase, deps: [{ token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ResizableBase, inputs: { rememberWidth: "rememberWidth", id: "id" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.CacheService }, { type: Document, decorators: [{
                     type: Inject,

package/esm2022/lib/display/resizable/resizable.component.mjs

@@ -38,13 +38,13 @@ export class ResizableComponent extends ResizableBase {
     restoreWidths(widths) {
         this.setWidth(widths[0]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ResizableComponent, selector: "ec-resizable", usesInheritance: true, ngImport: i0, template: `<div class="content">
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ResizableComponent, selector: "ec-resizable", usesInheritance: true, ngImport: i0, template: `<div class="content">
               <ng-content></ng-content>
             </div>
             <div class="handle" (mousedown)="startDrag($event)"></div>`, isInline: true, styles: [":host{width:240px;max-width:480px;min-width:100px;position:relative;border-right:1px solid var(--ec-border-color);display:flex}:host.is-active{-webkit-user-select:none;user-select:none}:host.is-active .handle:after{background-color:var(--ec-color-interactive)}.handle{position:absolute;right:-7px;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter)}.handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}.handle:hover{cursor:col-resize}.handle:hover:after{background-color:var(--ec-color-interactive)}.content{overflow:hidden;display:flex;flex:1 1;min-height:0;min-width:0}.content ::ng-deep>*{flex:1 1;min-height:0;min-width:0}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-resizable', template: `<div class="content">
               <ng-content></ng-content>

package/esm2022/lib/display/spinner/spinner.component.mjs

@@ -2,10 +2,10 @@ import { Component } from '@angular/core';
 import * as i0 from "@angular/core";
 /** Exposes the markup and styles that represent the spinner. No inputs or outputs defined because it is just a visual component*/
 export class SpinnerComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SpinnerComponent, selector: "ec-spinner", ngImport: i0, template: "<div class=\"spinner\">\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.25rem}.spinner-dot:nth-child(1){animation-delay:-.6s}.spinner-dot:nth-child(2){animation-delay:-.4s}.spinner-dot:nth-child(3){animation-delay:-.2s}:host(.spinner-small) .spinner-dot{width:.5rem;height:.5rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.1666666667rem}:host(.spinner-small) .spinner-dot:nth-child(1){animation-delay:-.6s}:host(.spinner-small) .spinner-dot:nth-child(2){animation-delay:-.4s}:host(.spinner-small) .spinner-dot:nth-child(3){animation-delay:-.2s}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpinnerComponent, selector: "ec-spinner", ngImport: i0, template: "<div class=\"spinner\">\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.25rem}.spinner-dot:nth-child(1){animation-delay:-.6s}.spinner-dot:nth-child(2){animation-delay:-.4s}.spinner-dot:nth-child(3){animation-delay:-.2s}:host(.spinner-small) .spinner-dot{width:.5rem;height:.5rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.1666666667rem}:host(.spinner-small) .spinner-dot:nth-child(1){animation-delay:-.6s}:host(.spinner-small) .spinner-dot:nth-child(2){animation-delay:-.4s}:host(.spinner-small) .spinner-dot:nth-child(3){animation-delay:-.2s}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-spinner', template: "<div class=\"spinner\">\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n  <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.25rem}.spinner-dot:nth-child(1){animation-delay:-.6s}.spinner-dot:nth-child(2){animation-delay:-.4s}.spinner-dot:nth-child(3){animation-delay:-.2s}:host(.spinner-small) .spinner-dot{width:.5rem;height:.5rem;background-color:var(--ec-spinner-color, var(--ec-color-purple-5));animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.1666666667rem}:host(.spinner-small) .spinner-dot:nth-child(1){animation-delay:-.6s}:host(.spinner-small) .spinner-dot:nth-child(2){animation-delay:-.4s}:host(.spinner-small) .spinner-dot:nth-child(3){animation-delay:-.2s}\n"] }]
         }] });

package/esm2022/lib/display/splash/splash.component.mjs

@@ -32,10 +32,10 @@ export class SplashComponent {
         this.destroyed.next();
         this.destroyed.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SplashComponent, deps: [{ token: i1.SplashService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SplashComponent, selector: "ec-splash", ngImport: i0, template: "<div class=\"app-splash\" [class.app-loaded]=\"!isVisible\">\r\n    <img src=\"/assets/images/splash.gif\">\r\n</div>" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplashComponent, deps: [{ token: i1.SplashService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SplashComponent, selector: "ec-splash", ngImport: i0, template: "<div class=\"app-splash\" [class.app-loaded]=\"!isVisible\">\r\n    <img src=\"/assets/images/splash.gif\">\r\n</div>" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SplashComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplashComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-splash', template: "<div class=\"app-splash\" [class.app-loaded]=\"!isVisible\">\r\n    <img src=\"/assets/images/splash.gif\">\r\n</div>" }]
         }], ctorParameters: () => [{ type: i1.SplashService }] });

package/esm2022/lib/display/splash/splash.service.mjs

@@ -23,10 +23,10 @@ export class SplashService {
     hideSplash() {
         this._splashVisibility.next(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SplashService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SplashService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplashService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplashService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SplashService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplashService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'

package/esm2022/lib/display/table/resizable-column.component.mjs

@@ -8,10 +8,10 @@ export class ResizableColumnComponent {
     emitWidth(width) {
         this.onResize.emit(width);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableColumnComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ResizableColumnComponent, selector: "th.is-resizable", outputs: { onResize: "onResize" }, ngImport: i0, template: "<div class=\"content-wrapper\">\r\n  <div class=\"content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"handle\"></div>\r\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableColumnComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ResizableColumnComponent, selector: "th.is-resizable", outputs: { onResize: "onResize" }, ngImport: i0, template: "<div class=\"content-wrapper\">\r\n  <div class=\"content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"handle\"></div>\r\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableColumnComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableColumnComponent, decorators: [{
             type: Component,
             args: [{ selector: 'th.is-resizable', template: "<div class=\"content-wrapper\">\r\n  <div class=\"content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n<div class=\"handle\"></div>\r\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { onResize: [{

package/esm2022/lib/display/table/resizable-table.directive.mjs

@@ -203,10 +203,10 @@ export class ResizableTableDirective extends ResizableBase {
         this.renderer.setStyle(this.tableEl, 'width', Math.max(this.currentTableWidth, totalColWidths) + 'px');
         this.renderer.setStyle(this.tableEl, 'minWidth', '100%');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableTableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: ResizableTableDirective, selector: "[ecResizableTable]", inputs: { isResizable: ["ecResizableTable", "isResizable"], containerEl: "containerEl", sortableTable: "sortableTable", resizableColumns: "resizableColumns" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableTableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ResizableTableDirective, selector: "[ecResizableTable]", inputs: { isResizable: ["ecResizableTable", "isResizable"], containerEl: "containerEl", sortableTable: "sortableTable", resizableColumns: "resizableColumns" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableTableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResizableTableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ecResizableTable]'

package/esm2022/lib/display/table/searchable-table.component.mjs

@@ -254,10 +254,10 @@ export class SearchableTableComponent {
         }
         return this.translateService.instant(this.noDataMessage || 'SearchableTable_Default_NoData_SC');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchableTableComponent, deps: [{ token: i1.ErrorService }, { token: i2.TranslateService }, { token: i3.RowCountPipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchableTableComponent, selector: "ec-searchable-table", inputs: { id: "id", resizable: "resizable", sortable: "sortable", sort: "sort", autofocus: "autofocus", tableClasses: "tableClasses", searchboxPlaceholder: "searchboxPlaceholder", formModel: "formModel", noDataMessage: "noDataMessage", noSearchResultsMessage: "noSearchResultsMessage", ready: "ready", getItems: "getItems", refresh: "refresh", status: "status", tableLayoutFixed: "tableLayoutFixed", searchboxTabIndex: "searchboxTabIndex", maxItemCount: "maxItemCount", hideSearchControl: "hideSearchControl", hideHeader: "hideHeader", objectType: "objectType", hideFooter: "hideFooter", pageable: "pageable", pageSize: "pageSize", maxTabs: "maxTabs", searchboxReadonly: "searchboxReadonly", selectionContext: "selectionContext", selectionToolbarTemplate: "selectionToolbarTemplate", additionalCountText: "additionalCountText", selectable: "selectable", customContentTemplate: "customContentTemplate", removeCard: "removeCard", overlayClasses: "overlayClasses", fillParentHeight: "fillParentHeight", disablePaginationControls: "disablePaginationControls" }, outputs: { sortChange: "sortChange", pageChangeEmitter: "pageChange", itemsChange: "itemsChange" }, queries: [{ propertyName: "resizableColumns", predicate: ResizableColumnComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<header *ngIf=\"!hideHeader\"\r\n        class=\"d-flex flex-shrink align-items-center mb-3\">\r\n  <ec-textbox id=\"{{id}}_searchbox\"\r\n              *ngIf=\"!hideSearchControl\"\r\n              class=\"mb-0 flex-grow mr-2\"\r\n              [autofocus]=\"autofocus\"\r\n              [formModel]=\"searchModel\"\r\n              [tabindex]=\"searchboxTabIndex\"\r\n              [placeholder]=\"searchboxPlaceholder\"\r\n              [readonly]=\"searchboxReadonly\"></ec-textbox>\r\n  <div class=\"flex-grow\">\r\n    <ng-content select=\".searchable-table-controls\"></ng-content>\r\n  </div>\r\n</header>\r\n<section id=\"{{id}}_card\"\r\n         class=\"d-flex flex-column {{overlayClasses}}\"\r\n         [ngClass]=\"{'is-translucent': status.status !== 'error', 'has-mask': status.status !== 'hasData', 'card m-0 bg-content': !customContentTemplate && !removeCard}\"\r\n         ecOverlay\r\n         [status]=\"status.status\"\r\n         [message]=\"status.message\"\r\n         [displayAsMask]=\"true\">\r\n  <ng-content select=\".card-header\"></ng-content>\r\n  <ng-container *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\">\r\n  </ng-container>\r\n\r\n  <!-- the default template is an ec-table with proxied-over searchable table inputs. \r\n    If that doesn't work for you then you can specify a customContentTemplate to use instead\r\n    and still retain all the event handling, header, footer pagination, etc support -->\r\n  <ng-template #defaultContentTemplate>\r\n    <ec-table id=\"{{id}}_table\"\r\n              class=\"{{tableClasses}}\"\r\n              [class.is-fixed]=\"tableLayoutFixed\"\r\n              [sortable]=\"sortable\"\r\n              [sort]=\"sort\"\r\n              (sortChange)=\"onSortChange($event)\"\r\n              [resizable]=\"resizable\"\r\n              [scrollable]=\"true\"\r\n              [selectable]=\"selectable\"\r\n              [selectionContext]=\"selectionContext\"\r\n              [selectionToolbarTemplate]=\"selectionToolbarTemplate\"\r\n              [resizableColumns]=\"resizableColumns\">\r\n      <ng-content></ng-content>\r\n    </ec-table>\r\n  </ng-template>\r\n\r\n  <!-- pagination footer visible if table is page-able and there are more than one page of results -->\r\n  <footer *ngIf=\"!hideFooter && pageable && searchResults.totalItemsBeforePaging! > pageSize!\"\r\n          class=\"pagination-footer\"\r\n          [class.border-top]=\"!customContentTemplate\">\r\n    <ec-table-pagination id=\"{{id}}_pager\"\r\n                         class=\"font-color-primary\"\r\n                         [totalItems]=\"searchResults.totalItemsBeforePaging\"\r\n                         [pageSize]=\"pageSize\"\r\n                         [maxTabs]=\"maxTabs\"\r\n                         [pageNumber]=\"pageInfo?.pageNumber\"\r\n                         [disablePaginationControls]=\"disablePaginationControls\"\r\n                         (pageChanged)=\"onPageChange($event)\">\r\n    </ec-table-pagination>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto font-color-hint text-truncate\" \r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n\r\n  <!-- default footer: visible if hideFooter is false and table is not page-able or there are only one page of results (always shows if there is a caption to indicate no results) -->\r\n  <footer *ngIf=\"(!hideFooter && (!pageable || searchResults.totalItemsBeforePaging! <= pageSize!)) || tableCaption\"\r\n          class=\"caption-footer\"\r\n          [ngClass]=\"{'has-results': searchResults?.items?.length, 'border-top': searchResults?.items?.length && !customContentTemplate}\">\r\n    <ng-content *ngIf=\"!tableCaption\"\r\n                select=\".searchable-table-footer\"></ng-content>\r\n    <div id=\"tableCaption\"\r\n         *ngIf=\"tableCaption\"\r\n         [innerHTML]=\"tableCaption\"></div>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto text-truncate\"\r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n</section>", styles: [":host{--ec-searchable-table-flex-properties: 0 1 auto;--ec-searchable-table-flex-overlay-section: var(--ec-searchable-table-flex-properties, 0 1 auto);--ec-searchable-table-flex-ec-table: var(--ec-searchable-table-flex-properties, 0 1 auto);display:flex;flex-direction:column;flex:1 1;min-height:0}:host ::ng-deep .card-header+ec-table.is-selectable th{height:2.5rem;padding-bottom:.9375rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle{padding-top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle:before{top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable .selectable-table-toolbar{height:2.5rem;padding-bottom:.5rem}section{flex:var(--ec-searchable-table-flex-overlay-section);min-height:0}ec-table{flex:var(--ec-searchable-table-flex-ec-table);min-height:0}footer{display:flex;align-items:center;flex:none;font-size:var(--ec-font-size-label);line-height:1rem}footer.has-results{color:var(--ec-color-hint-dark);text-align:right}.pagination-footer{padding:0 .5rem 0 0}.caption-footer{padding:.5rem;height:var(--ec-searchable-table-height-caption-footer)}.card.has-mask{min-height:15rem}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.TextboxComponent, selector: "ec-textbox", inputs: ["autocomplete", "type", "placeholder", "maxlength", "minlength", "rows", "selectOnAutofocus", "upperCase"] }, { kind: "component", type: i6.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i7.TableComponent, selector: "ec-table", inputs: ["id", "scrollable", "resizable", "condensed", "sortable", "selectionContext", "selectionToolbarTemplate", "selectable", "isForm", "sort", "resizableColumns"], outputs: ["sortChange"] }, { kind: "component", type: i8.TablePaginationComponent, selector: "ec-table-pagination", inputs: ["id", "totalItems", "pageSize", "pageNumber", "maxTabs", "disablePaginationControls"], outputs: ["pageChanged"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchableTableComponent, deps: [{ token: i1.ErrorService }, { token: i2.TranslateService }, { token: i3.RowCountPipe }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SearchableTableComponent, selector: "ec-searchable-table", inputs: { id: "id", resizable: "resizable", sortable: "sortable", sort: "sort", autofocus: "autofocus", tableClasses: "tableClasses", searchboxPlaceholder: "searchboxPlaceholder", formModel: "formModel", noDataMessage: "noDataMessage", noSearchResultsMessage: "noSearchResultsMessage", ready: "ready", getItems: "getItems", refresh: "refresh", status: "status", tableLayoutFixed: "tableLayoutFixed", searchboxTabIndex: "searchboxTabIndex", maxItemCount: "maxItemCount", hideSearchControl: "hideSearchControl", hideHeader: "hideHeader", objectType: "objectType", hideFooter: "hideFooter", pageable: "pageable", pageSize: "pageSize", maxTabs: "maxTabs", searchboxReadonly: "searchboxReadonly", selectionContext: "selectionContext", selectionToolbarTemplate: "selectionToolbarTemplate", additionalCountText: "additionalCountText", selectable: "selectable", customContentTemplate: "customContentTemplate", removeCard: "removeCard", overlayClasses: "overlayClasses", fillParentHeight: "fillParentHeight", disablePaginationControls: "disablePaginationControls" }, outputs: { sortChange: "sortChange", pageChangeEmitter: "pageChange", itemsChange: "itemsChange" }, queries: [{ propertyName: "resizableColumns", predicate: ResizableColumnComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<header *ngIf=\"!hideHeader\"\r\n        class=\"d-flex flex-shrink align-items-center mb-3\">\r\n  <ec-textbox id=\"{{id}}_searchbox\"\r\n              *ngIf=\"!hideSearchControl\"\r\n              class=\"mb-0 flex-grow mr-2\"\r\n              [autofocus]=\"autofocus\"\r\n              [formModel]=\"searchModel\"\r\n              [tabindex]=\"searchboxTabIndex\"\r\n              [placeholder]=\"searchboxPlaceholder\"\r\n              [readonly]=\"searchboxReadonly\"></ec-textbox>\r\n  <div class=\"flex-grow\">\r\n    <ng-content select=\".searchable-table-controls\"></ng-content>\r\n  </div>\r\n</header>\r\n<section id=\"{{id}}_card\"\r\n         class=\"d-flex flex-column {{overlayClasses}}\"\r\n         [ngClass]=\"{'is-translucent': status.status !== 'error', 'has-mask': status.status !== 'hasData', 'card m-0 bg-content': !customContentTemplate && !removeCard}\"\r\n         ecOverlay\r\n         [status]=\"status.status\"\r\n         [message]=\"status.message\"\r\n         [displayAsMask]=\"true\">\r\n  <ng-content select=\".card-header\"></ng-content>\r\n  <ng-container *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\">\r\n  </ng-container>\r\n\r\n  <!-- the default template is an ec-table with proxied-over searchable table inputs. \r\n    If that doesn't work for you then you can specify a customContentTemplate to use instead\r\n    and still retain all the event handling, header, footer pagination, etc support -->\r\n  <ng-template #defaultContentTemplate>\r\n    <ec-table id=\"{{id}}_table\"\r\n              class=\"{{tableClasses}}\"\r\n              [class.is-fixed]=\"tableLayoutFixed\"\r\n              [sortable]=\"sortable\"\r\n              [sort]=\"sort\"\r\n              (sortChange)=\"onSortChange($event)\"\r\n              [resizable]=\"resizable\"\r\n              [scrollable]=\"true\"\r\n              [selectable]=\"selectable\"\r\n              [selectionContext]=\"selectionContext\"\r\n              [selectionToolbarTemplate]=\"selectionToolbarTemplate\"\r\n              [resizableColumns]=\"resizableColumns\">\r\n      <ng-content></ng-content>\r\n    </ec-table>\r\n  </ng-template>\r\n\r\n  <!-- pagination footer visible if table is page-able and there are more than one page of results -->\r\n  <footer *ngIf=\"!hideFooter && pageable && searchResults.totalItemsBeforePaging! > pageSize!\"\r\n          class=\"pagination-footer\"\r\n          [class.border-top]=\"!customContentTemplate\">\r\n    <ec-table-pagination id=\"{{id}}_pager\"\r\n                         class=\"font-color-primary\"\r\n                         [totalItems]=\"searchResults.totalItemsBeforePaging\"\r\n                         [pageSize]=\"pageSize\"\r\n                         [maxTabs]=\"maxTabs\"\r\n                         [pageNumber]=\"pageInfo?.pageNumber\"\r\n                         [disablePaginationControls]=\"disablePaginationControls\"\r\n                         (pageChanged)=\"onPageChange($event)\">\r\n    </ec-table-pagination>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto font-color-hint text-truncate\" \r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n\r\n  <!-- default footer: visible if hideFooter is false and table is not page-able or there are only one page of results (always shows if there is a caption to indicate no results) -->\r\n  <footer *ngIf=\"(!hideFooter && (!pageable || searchResults.totalItemsBeforePaging! <= pageSize!)) || tableCaption\"\r\n          class=\"caption-footer\"\r\n          [ngClass]=\"{'has-results': searchResults?.items?.length, 'border-top': searchResults?.items?.length && !customContentTemplate}\">\r\n    <ng-content *ngIf=\"!tableCaption\"\r\n                select=\".searchable-table-footer\"></ng-content>\r\n    <div id=\"tableCaption\"\r\n         *ngIf=\"tableCaption\"\r\n         [innerHTML]=\"tableCaption\"></div>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto text-truncate\"\r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n</section>", styles: [":host{--ec-searchable-table-flex-properties: 0 1 auto;--ec-searchable-table-flex-overlay-section: var(--ec-searchable-table-flex-properties, 0 1 auto);--ec-searchable-table-flex-ec-table: var(--ec-searchable-table-flex-properties, 0 1 auto);display:flex;flex-direction:column;flex:1 1;min-height:0}:host ::ng-deep .card-header+ec-table.is-selectable th{height:2.5rem;padding-bottom:.9375rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle{padding-top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle:before{top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable .selectable-table-toolbar{height:2.5rem;padding-bottom:.5rem}section{flex:var(--ec-searchable-table-flex-overlay-section);min-height:0}ec-table{flex:var(--ec-searchable-table-flex-ec-table);min-height:0}footer{display:flex;align-items:center;flex:none;font-size:var(--ec-font-size-label);line-height:1rem}footer.has-results{color:var(--ec-color-hint-dark);text-align:right}.pagination-footer{padding:0 .5rem 0 0}.caption-footer{padding:.5rem;height:var(--ec-searchable-table-height-caption-footer)}.card.has-mask{min-height:15rem}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.TextboxComponent, selector: "ec-textbox", inputs: ["autocomplete", "type", "placeholder", "maxlength", "minlength", "rows", "selectOnAutofocus", "upperCase"] }, { kind: "component", type: i6.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i7.TableComponent, selector: "ec-table", inputs: ["id", "scrollable", "resizable", "condensed", "sortable", "selectionContext", "selectionToolbarTemplate", "selectable", "isForm", "sort", "resizableColumns"], outputs: ["sortChange"] }, { kind: "component", type: i8.TablePaginationComponent, selector: "ec-table-pagination", inputs: ["id", "totalItems", "pageSize", "pageNumber", "maxTabs", "disablePaginationControls"], outputs: ["pageChanged"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchableTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchableTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-searchable-table', template: "<header *ngIf=\"!hideHeader\"\r\n        class=\"d-flex flex-shrink align-items-center mb-3\">\r\n  <ec-textbox id=\"{{id}}_searchbox\"\r\n              *ngIf=\"!hideSearchControl\"\r\n              class=\"mb-0 flex-grow mr-2\"\r\n              [autofocus]=\"autofocus\"\r\n              [formModel]=\"searchModel\"\r\n              [tabindex]=\"searchboxTabIndex\"\r\n              [placeholder]=\"searchboxPlaceholder\"\r\n              [readonly]=\"searchboxReadonly\"></ec-textbox>\r\n  <div class=\"flex-grow\">\r\n    <ng-content select=\".searchable-table-controls\"></ng-content>\r\n  </div>\r\n</header>\r\n<section id=\"{{id}}_card\"\r\n         class=\"d-flex flex-column {{overlayClasses}}\"\r\n         [ngClass]=\"{'is-translucent': status.status !== 'error', 'has-mask': status.status !== 'hasData', 'card m-0 bg-content': !customContentTemplate && !removeCard}\"\r\n         ecOverlay\r\n         [status]=\"status.status\"\r\n         [message]=\"status.message\"\r\n         [displayAsMask]=\"true\">\r\n  <ng-content select=\".card-header\"></ng-content>\r\n  <ng-container *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\">\r\n  </ng-container>\r\n\r\n  <!-- the default template is an ec-table with proxied-over searchable table inputs. \r\n    If that doesn't work for you then you can specify a customContentTemplate to use instead\r\n    and still retain all the event handling, header, footer pagination, etc support -->\r\n  <ng-template #defaultContentTemplate>\r\n    <ec-table id=\"{{id}}_table\"\r\n              class=\"{{tableClasses}}\"\r\n              [class.is-fixed]=\"tableLayoutFixed\"\r\n              [sortable]=\"sortable\"\r\n              [sort]=\"sort\"\r\n              (sortChange)=\"onSortChange($event)\"\r\n              [resizable]=\"resizable\"\r\n              [scrollable]=\"true\"\r\n              [selectable]=\"selectable\"\r\n              [selectionContext]=\"selectionContext\"\r\n              [selectionToolbarTemplate]=\"selectionToolbarTemplate\"\r\n              [resizableColumns]=\"resizableColumns\">\r\n      <ng-content></ng-content>\r\n    </ec-table>\r\n  </ng-template>\r\n\r\n  <!-- pagination footer visible if table is page-able and there are more than one page of results -->\r\n  <footer *ngIf=\"!hideFooter && pageable && searchResults.totalItemsBeforePaging! > pageSize!\"\r\n          class=\"pagination-footer\"\r\n          [class.border-top]=\"!customContentTemplate\">\r\n    <ec-table-pagination id=\"{{id}}_pager\"\r\n                         class=\"font-color-primary\"\r\n                         [totalItems]=\"searchResults.totalItemsBeforePaging\"\r\n                         [pageSize]=\"pageSize\"\r\n                         [maxTabs]=\"maxTabs\"\r\n                         [pageNumber]=\"pageInfo?.pageNumber\"\r\n                         [disablePaginationControls]=\"disablePaginationControls\"\r\n                         (pageChanged)=\"onPageChange($event)\">\r\n    </ec-table-pagination>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto font-color-hint text-truncate\" \r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n\r\n  <!-- default footer: visible if hideFooter is false and table is not page-able or there are only one page of results (always shows if there is a caption to indicate no results) -->\r\n  <footer *ngIf=\"(!hideFooter && (!pageable || searchResults.totalItemsBeforePaging! <= pageSize!)) || tableCaption\"\r\n          class=\"caption-footer\"\r\n          [ngClass]=\"{'has-results': searchResults?.items?.length, 'border-top': searchResults?.items?.length && !customContentTemplate}\">\r\n    <ng-content *ngIf=\"!tableCaption\"\r\n                select=\".searchable-table-footer\"></ng-content>\r\n    <div id=\"tableCaption\"\r\n         *ngIf=\"tableCaption\"\r\n         [innerHTML]=\"tableCaption\"></div>\r\n    <div id=\"resultsCount\"\r\n         *ngIf=\"searchResults?.items?.length\"\r\n         class=\"ml-auto text-truncate\"\r\n         title=\"{{resultsCount}} {{additionalCountText}}\">{{resultsCount}} {{additionalCountText}}</div>\r\n  </footer>\r\n</section>", styles: [":host{--ec-searchable-table-flex-properties: 0 1 auto;--ec-searchable-table-flex-overlay-section: var(--ec-searchable-table-flex-properties, 0 1 auto);--ec-searchable-table-flex-ec-table: var(--ec-searchable-table-flex-properties, 0 1 auto);display:flex;flex-direction:column;flex:1 1;min-height:0}:host ::ng-deep .card-header+ec-table.is-selectable th{height:2.5rem;padding-bottom:.9375rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle{padding-top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable th.is-resizable .handle:before{top:.5rem}:host ::ng-deep .card-header+ec-table.is-selectable .selectable-table-toolbar{height:2.5rem;padding-bottom:.5rem}section{flex:var(--ec-searchable-table-flex-overlay-section);min-height:0}ec-table{flex:var(--ec-searchable-table-flex-ec-table);min-height:0}footer{display:flex;align-items:center;flex:none;font-size:var(--ec-font-size-label);line-height:1rem}footer.has-results{color:var(--ec-color-hint-dark);text-align:right}.pagination-footer{padding:0 .5rem 0 0}.caption-footer{padding:.5rem;height:var(--ec-searchable-table-height-caption-footer)}.card.has-mask{min-height:15rem}\n"] }]
         }], ctorParameters: () => [{ type: i1.ErrorService }, { type: i2.TranslateService }, { type: i3.RowCountPipe }], propDecorators: { id: [{

package/esm2022/lib/display/table/table-detail-row.component.mjs

@@ -2,15 +2,15 @@ import { Component, Input } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/cdk/scrolling";
 export class TableDetailRowComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableDetailRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableDetailRowComponent, selector: "[ecTableDetailRow]", inputs: { contentClass: "contentClass", contentColSpan: "contentColSpan", maxHeight: "maxHeight" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableDetailRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableDetailRowComponent, selector: "[ecTableDetailRow]", inputs: { contentClass: "contentClass", contentColSpan: "contentColSpan", maxHeight: "maxHeight" }, ngImport: i0, template: `
     <td></td>
     <td [class.has-max-height]="maxHeight" class="table-detail-content {{contentClass}}" [attr.colspan]="contentColSpan">
       <div [style.max-height]="maxHeight" cdkScrollable><ng-content></ng-content></div>
     </td>
   `, isInline: true, styles: [":host{background-color:var(--ec-background-color-detail)}td:first-child{width:1.5rem;padding:.25rem 0!important;vertical-align:top}.table-detail-content{background-color:transparent;border-top:1px solid var(--ec-border-color);padding:1rem 2rem 1rem 0!important}.table-detail-content.has-max-height{padding:0!important}.table-detail-content.has-max-height>div{overflow-y:auto;padding:1rem 2rem 1rem 0}\n"], dependencies: [{ kind: "directive", type: i1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableDetailRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableDetailRowComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ecTableDetailRow]', template: `
     <td></td>

package/esm2022/lib/display/table/table-locked-column.component.mjs

@@ -33,10 +33,10 @@ export class TableLockedColumnComponent {
             this.borderLeft = this.options.border || false;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableLockedColumnComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableLockedColumnComponent, selector: "[ecTableLockedColumn]", inputs: { options: ["ecTableLockedColumn", "options"] }, host: { properties: { "style.left.px": "this.left", "style.right.px": "this.right", "class.border-right": "this.borderRight", "class.border-left": "this.borderLeft" } }, usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host{background-color:var(--ec-background-color);position:sticky!important;z-index:calc(var(--ec-z-index-sticky-header) + 1)!important}:host(th){z-index:calc(var(--ec-z-index-sticky-header) + 2)!important}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableLockedColumnComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableLockedColumnComponent, selector: "[ecTableLockedColumn]", inputs: { options: ["ecTableLockedColumn", "options"] }, host: { properties: { "style.left.px": "this.left", "style.right.px": "this.right", "class.border-right": "this.borderRight", "class.border-left": "this.borderLeft" } }, usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host{background-color:var(--ec-background-color);position:sticky!important;z-index:calc(var(--ec-z-index-sticky-header) + 1)!important}:host(th){z-index:calc(var(--ec-z-index-sticky-header) + 2)!important}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableLockedColumnComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableLockedColumnComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ecTableLockedColumn]', template: `<ng-content></ng-content>`, styles: [":host{background-color:var(--ec-background-color);position:sticky!important;z-index:calc(var(--ec-z-index-sticky-header) + 1)!important}:host(th){z-index:calc(var(--ec-z-index-sticky-header) + 2)!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { options: [{

package/esm2022/lib/display/table/table-master-header-row.component.mjs

@@ -2,10 +2,10 @@ import { Component, Input } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 export class TableMasterHeaderRowComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableMasterHeaderRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableMasterHeaderRowComponent, selector: "[ecTableMasterHeaderRow]", inputs: { hideTableMaster: "hideTableMaster" }, ngImport: i0, template: `<th *ngIf="!hideTableMaster"></th><ng-content></ng-content>`, isInline: true, styles: ["th{width:1.5rem;padding:.25rem 0!important;vertical-align:top}th ::ng-deep+th,th ::ng-deep+th.is-resizable{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableMasterHeaderRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableMasterHeaderRowComponent, selector: "[ecTableMasterHeaderRow]", inputs: { hideTableMaster: "hideTableMaster" }, ngImport: i0, template: `<th *ngIf="!hideTableMaster"></th><ng-content></ng-content>`, isInline: true, styles: ["th{width:1.5rem;padding:.25rem 0!important;vertical-align:top}th ::ng-deep+th,th ::ng-deep+th.is-resizable{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableMasterHeaderRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableMasterHeaderRowComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ecTableMasterHeaderRow]', template: `<th *ngIf="!hideTableMaster"></th><ng-content></ng-content>`, styles: ["th{width:1.5rem;padding:.25rem 0!important;vertical-align:top}th ::ng-deep+th,th ::ng-deep+th.is-resizable{padding-left:0}\n"] }]
         }], propDecorators: { hideTableMaster: [{

package/esm2022/lib/display/table/table-master-row.component.mjs

@@ -126,10 +126,10 @@ export class TableMasterRowComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableMasterRowComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableMasterRowComponent, selector: "[ecTableMasterRow]", inputs: { id: "id", hasDetails: "hasDetails", showDetails: "showDetails", detailTemplate: "detailTemplate", detailContext: "detailContext", detailRowColSpan: "detailRowColSpan", detailRowClass: "detailRowClass", detailRowContentClass: "detailRowContentClass", detailRowMaxHeight: "detailRowMaxHeight", collapsibleToggleCellClass: "collapsibleToggleCellClass", hideTableMaster: "hideTableMaster" }, outputs: { showDetailsChanged: "showDetailsChanged" }, viewQueries: [{ propertyName: "detailRowTemplate", first: true, predicate: ["detailRow"], descendants: true, read: TemplateRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<td *ngIf=\"!hideTableMaster\" class=\"{{collapsibleToggleCellClass}}\">\r\n  <ec-collapsible-toggle *ngIf=\"hasDetails\"\r\n                         id=\"{{id}}_toggle\"\r\n                         [expanded]=\"showDetails\"\r\n                         (expandedChange)=\"toggleDetails($event)\"></ec-collapsible-toggle>\r\n</td>\r\n<ng-content></ng-content>\r\n\r\n<ng-template #detailRow>\r\n  <tr ecTableDetailRow class=\"{{detailRowClass}}\" [contentClass]=\"detailRowContentClass\" [contentColSpan]=\"detailRowColSpan\" [maxHeight]=\"detailRowMaxHeight\">\r\n      <ng-container *ngTemplateOutlet=\"detailTemplate; context: {$implicit: detailContext}\"></ng-container>\r\n  </tr>\r\n</ng-template>", styles: ["td{width:1.5rem;padding:.25rem 0!important;vertical-align:top}td ::ng-deep+td{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CollapsibleToggleComponent, selector: "ec-collapsible-toggle", inputs: ["id", "expanded", "tabindex"], outputs: ["expandedChange"] }, { kind: "component", type: i3.TableDetailRowComponent, selector: "[ecTableDetailRow]", inputs: ["contentClass", "contentColSpan", "maxHeight"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableMasterRowComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableMasterRowComponent, selector: "[ecTableMasterRow]", inputs: { id: "id", hasDetails: "hasDetails", showDetails: "showDetails", detailTemplate: "detailTemplate", detailContext: "detailContext", detailRowColSpan: "detailRowColSpan", detailRowClass: "detailRowClass", detailRowContentClass: "detailRowContentClass", detailRowMaxHeight: "detailRowMaxHeight", collapsibleToggleCellClass: "collapsibleToggleCellClass", hideTableMaster: "hideTableMaster" }, outputs: { showDetailsChanged: "showDetailsChanged" }, viewQueries: [{ propertyName: "detailRowTemplate", first: true, predicate: ["detailRow"], descendants: true, read: TemplateRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<td *ngIf=\"!hideTableMaster\" class=\"{{collapsibleToggleCellClass}}\">\r\n  <ec-collapsible-toggle *ngIf=\"hasDetails\"\r\n                         id=\"{{id}}_toggle\"\r\n                         [expanded]=\"showDetails\"\r\n                         (expandedChange)=\"toggleDetails($event)\"></ec-collapsible-toggle>\r\n</td>\r\n<ng-content></ng-content>\r\n\r\n<ng-template #detailRow>\r\n  <tr ecTableDetailRow class=\"{{detailRowClass}}\" [contentClass]=\"detailRowContentClass\" [contentColSpan]=\"detailRowColSpan\" [maxHeight]=\"detailRowMaxHeight\">\r\n      <ng-container *ngTemplateOutlet=\"detailTemplate; context: {$implicit: detailContext}\"></ng-container>\r\n  </tr>\r\n</ng-template>", styles: ["td{width:1.5rem;padding:.25rem 0!important;vertical-align:top}td ::ng-deep+td{padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CollapsibleToggleComponent, selector: "ec-collapsible-toggle", inputs: ["id", "expanded", "tabindex"], outputs: ["expandedChange"] }, { kind: "component", type: i3.TableDetailRowComponent, selector: "[ecTableDetailRow]", inputs: ["contentClass", "contentColSpan", "maxHeight"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableMasterRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableMasterRowComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ecTableMasterRow]', template: "<td *ngIf=\"!hideTableMaster\" class=\"{{collapsibleToggleCellClass}}\">\r\n  <ec-collapsible-toggle *ngIf=\"hasDetails\"\r\n                         id=\"{{id}}_toggle\"\r\n                         [expanded]=\"showDetails\"\r\n                         (expandedChange)=\"toggleDetails($event)\"></ec-collapsible-toggle>\r\n</td>\r\n<ng-content></ng-content>\r\n\r\n<ng-template #detailRow>\r\n  <tr ecTableDetailRow class=\"{{detailRowClass}}\" [contentClass]=\"detailRowContentClass\" [contentColSpan]=\"detailRowColSpan\" [maxHeight]=\"detailRowMaxHeight\">\r\n      <ng-container *ngTemplateOutlet=\"detailTemplate; context: {$implicit: detailContext}\"></ng-container>\r\n  </tr>\r\n</ng-template>", styles: ["td{width:1.5rem;padding:.25rem 0!important;vertical-align:top}td ::ng-deep+td{padding-left:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ApplicationRef }], propDecorators: { id: [{

package/esm2022/lib/display/table/table-pagination.component.mjs

@@ -129,10 +129,10 @@ export class TablePaginationComponent {
             value: { firstPage: start, lastPage: lastPage }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TablePaginationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TablePaginationComponent, selector: "ec-table-pagination", inputs: { id: "id", totalItems: "totalItems", pageSize: "pageSize", pageNumber: "pageNumber", maxTabs: "maxTabs", disablePaginationControls: "disablePaginationControls" }, outputs: { pageChanged: "pageChanged" }, host: { classAttribute: "d-flex px-2 align-items-center" }, usesOnChanges: true, ngImport: i0, template: "<ec-tabs id=\"{{id}}_pages\"\r\n         class=\"my-2 is-condensed\"\r\n         [tabGroup]=\"currentTabs\"\r\n         tabStyle=\"pills\">\r\n</ec-tabs>\r\n<ec-dropdown id=\"{{id}}_morePages\"\r\n             *ngIf=\"dropdownItems.length > 1\"\r\n             class=\"my-1 ml-1\"\r\n             menuTemplateType=\"label\"\r\n             icon=\"icon-more\"\r\n             menuPosition=\"left\"\r\n             [menuMinWidth]=\"80\"\r\n             [showArrow]=\"false\"\r\n             [popupFixed]=\"true\"\r\n             [items]=\"dropdownItems\"\r\n             [disabled]=\"disablePaginationControls\"\r\n             (itemSelected)=\"onItemSelected($event)\">\r\n</ec-dropdown>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TabsComponent, selector: "ec-tabs", inputs: ["id", "tabindex", "tabStyle", "tabGroup"] }, { kind: "component", type: i3.DropdownComponent, selector: "ec-dropdown", inputs: ["id", "autofocus", "status", "disabled", "label", "icon", "buttonType", "buttonAlignment", "buttonTitle", "tabindex", "showArrow", "items", "menuTemplateType", "menuTitle", "menuHeight", "menuWidth", "menuMinWidth", "menuPosition", "menuFooter", "popupFixed", "buttonCustomTemplate", "pending"], outputs: ["itemSelected", "popupOpened"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TablePaginationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TablePaginationComponent, selector: "ec-table-pagination", inputs: { id: "id", totalItems: "totalItems", pageSize: "pageSize", pageNumber: "pageNumber", maxTabs: "maxTabs", disablePaginationControls: "disablePaginationControls" }, outputs: { pageChanged: "pageChanged" }, host: { classAttribute: "d-flex px-2 align-items-center" }, usesOnChanges: true, ngImport: i0, template: "<ec-tabs id=\"{{id}}_pages\"\r\n         class=\"my-2 is-condensed\"\r\n         [tabGroup]=\"currentTabs\"\r\n         tabStyle=\"pills\">\r\n</ec-tabs>\r\n<ec-dropdown id=\"{{id}}_morePages\"\r\n             *ngIf=\"dropdownItems.length > 1\"\r\n             class=\"my-1 ml-1\"\r\n             menuTemplateType=\"label\"\r\n             icon=\"icon-more\"\r\n             menuPosition=\"left\"\r\n             [menuMinWidth]=\"80\"\r\n             [showArrow]=\"false\"\r\n             [popupFixed]=\"true\"\r\n             [items]=\"dropdownItems\"\r\n             [disabled]=\"disablePaginationControls\"\r\n             (itemSelected)=\"onItemSelected($event)\">\r\n</ec-dropdown>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TabsComponent, selector: "ec-tabs", inputs: ["id", "tabindex", "tabStyle", "tabGroup"] }, { kind: "component", type: i3.DropdownComponent, selector: "ec-dropdown", inputs: ["id", "autofocus", "status", "disabled", "label", "icon", "buttonType", "buttonAlignment", "buttonTitle", "tabindex", "showArrow", "items", "menuTemplateType", "menuTitle", "menuHeight", "menuWidth", "menuMinWidth", "menuPosition", "menuFooter", "popupFixed", "buttonCustomTemplate", "pending"], outputs: ["itemSelected", "popupOpened"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TablePaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TablePaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-table-pagination', host: {
                         class: 'd-flex px-2 align-items-center'

package/esm2022/lib/display/table/table-selectable-row.component.mjs

@@ -194,10 +194,10 @@ export class TableSelectableRowComponent {
     clearAllRows() {
         this.context.rowCheckboxes.controls.forEach(control => control.setValue(false));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableSelectableRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableSelectableRowComponent, selector: "[ecTableSelectableRow]", inputs: { id: "id", isSelectionEnabled: ["ecTableSelectableRow", "isSelectionEnabled"], context: ["selectionContext", "context"], rowIndex: "rowIndex", lockedColOptions: "lockedColOptions", isSelected: "isSelected", isCheckboxDisabled: "isCheckboxDisabled" }, host: { listeners: { "click": "rowClicked($event)" }, properties: { "attr.id": "this.id", "class.is-enabled": "this.isSelectionEnabled", "class.is-selected": "this.isSelected", "class.is-header": "this.isHeader" } }, usesOnChanges: true, ngImport: i0, template: "<!-- any elements of the existing table row that must go before the row selection checkbox can be marked with a class of before-checkbox -->\r\n<ng-content select=\".before-checkbox\"></ng-content>\r\n<ng-container *ngIf=\"isSelectionEnabled\">\r\n  <th *ngIf=\"isHeader\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <ec-checkbox id=\"{{id}}_selectAll\"\r\n                 class=\"m-0\"\r\n                 *ngIf=\"context?.selectAllCheckbox\"\r\n                 [formModel]=\"context?.selectAllCheckbox\"\r\n                 [dependentCheckboxesGroup]=\"dependentCheckboxesReference\"\r\n                 [ignoreDisabledDependents]=\"false\">\r\n    </ec-checkbox>\r\n  </th>\r\n  <td *ngIf=\"!isHeader && formControl\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <!-- Use [readonly] and not [disabled] for isCheckboxDisabled to prevent user interaction\r\n         and allow the value to be visible to other components (for example, when they subscribe\r\n         to valueChanges on the FormArray that contains all the checkbox FormControls). -->\r\n    <ec-checkbox id=\"{{id}}_row{{rowIndex}}_checkbox\"\r\n                 [readonly]=\"isCheckboxDisabled\"\r\n                 [attr.id]=\"checkboxAttributeID\"\r\n                 class=\"m-0 row-checkbox\"\r\n                 [formModel]=\"formControl\">\r\n    </ec-checkbox>\r\n  </td>\r\n</ng-container>\r\n<!-- The rest of the table row -->\r\n<ng-content></ng-content>", styles: [":host.is-enabled:not(.is-header){cursor:pointer}:host .checkbox{padding-left:2px;padding-right:2px;width:1.25rem}:host .checkbox:first-child{padding-left:.5rem;width:1.625rem}:host.border-bottom-0 .checkbox{border-bottom:0}td.checkbox ec-checkbox ::ng-deep *{pointer-events:none}th.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-th, middle)}td.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-td, top)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CheckboxComponent, selector: "ec-checkbox", inputs: ["name", "dependentCheckboxesGroup", "ignoreDisabledDependents"] }, { kind: "component", type: i3.TableLockedColumnComponent, selector: "[ecTableLockedColumn]", inputs: ["ecTableLockedColumn"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableSelectableRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableSelectableRowComponent, selector: "[ecTableSelectableRow]", inputs: { id: "id", isSelectionEnabled: ["ecTableSelectableRow", "isSelectionEnabled"], context: ["selectionContext", "context"], rowIndex: "rowIndex", lockedColOptions: "lockedColOptions", isSelected: "isSelected", isCheckboxDisabled: "isCheckboxDisabled" }, host: { listeners: { "click": "rowClicked($event)" }, properties: { "attr.id": "this.id", "class.is-enabled": "this.isSelectionEnabled", "class.is-selected": "this.isSelected", "class.is-header": "this.isHeader" } }, usesOnChanges: true, ngImport: i0, template: "<!-- any elements of the existing table row that must go before the row selection checkbox can be marked with a class of before-checkbox -->\r\n<ng-content select=\".before-checkbox\"></ng-content>\r\n<ng-container *ngIf=\"isSelectionEnabled\">\r\n  <th *ngIf=\"isHeader\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <ec-checkbox id=\"{{id}}_selectAll\"\r\n                 class=\"m-0\"\r\n                 *ngIf=\"context?.selectAllCheckbox\"\r\n                 [formModel]=\"context?.selectAllCheckbox\"\r\n                 [dependentCheckboxesGroup]=\"dependentCheckboxesReference\"\r\n                 [ignoreDisabledDependents]=\"false\">\r\n    </ec-checkbox>\r\n  </th>\r\n  <td *ngIf=\"!isHeader && formControl\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <!-- Use [readonly] and not [disabled] for isCheckboxDisabled to prevent user interaction\r\n         and allow the value to be visible to other components (for example, when they subscribe\r\n         to valueChanges on the FormArray that contains all the checkbox FormControls). -->\r\n    <ec-checkbox id=\"{{id}}_row{{rowIndex}}_checkbox\"\r\n                 [readonly]=\"isCheckboxDisabled\"\r\n                 [attr.id]=\"checkboxAttributeID\"\r\n                 class=\"m-0 row-checkbox\"\r\n                 [formModel]=\"formControl\">\r\n    </ec-checkbox>\r\n  </td>\r\n</ng-container>\r\n<!-- The rest of the table row -->\r\n<ng-content></ng-content>", styles: [":host.is-enabled:not(.is-header){cursor:pointer}:host .checkbox{padding-left:2px;padding-right:2px;width:1.25rem}:host .checkbox:first-child{padding-left:.5rem;width:1.625rem}:host.border-bottom-0 .checkbox{border-bottom:0}td.checkbox ec-checkbox ::ng-deep *{pointer-events:none}th.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-th, middle)}td.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-td, top)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CheckboxComponent, selector: "ec-checkbox", inputs: ["name", "dependentCheckboxesGroup", "ignoreDisabledDependents"] }, { kind: "component", type: i3.TableLockedColumnComponent, selector: "[ecTableLockedColumn]", inputs: ["ecTableLockedColumn"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableSelectableRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableSelectableRowComponent, decorators: [{
             type: Component,
             args: [{ selector: '[ecTableSelectableRow]', template: "<!-- any elements of the existing table row that must go before the row selection checkbox can be marked with a class of before-checkbox -->\r\n<ng-content select=\".before-checkbox\"></ng-content>\r\n<ng-container *ngIf=\"isSelectionEnabled\">\r\n  <th *ngIf=\"isHeader\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <ec-checkbox id=\"{{id}}_selectAll\"\r\n                 class=\"m-0\"\r\n                 *ngIf=\"context?.selectAllCheckbox\"\r\n                 [formModel]=\"context?.selectAllCheckbox\"\r\n                 [dependentCheckboxesGroup]=\"dependentCheckboxesReference\"\r\n                 [ignoreDisabledDependents]=\"false\">\r\n    </ec-checkbox>\r\n  </th>\r\n  <td *ngIf=\"!isHeader && formControl\"\r\n      class=\"checkbox\"\r\n      [ecTableLockedColumn]=\"lockedColOptions\">\r\n    <!-- Use [readonly] and not [disabled] for isCheckboxDisabled to prevent user interaction\r\n         and allow the value to be visible to other components (for example, when they subscribe\r\n         to valueChanges on the FormArray that contains all the checkbox FormControls). -->\r\n    <ec-checkbox id=\"{{id}}_row{{rowIndex}}_checkbox\"\r\n                 [readonly]=\"isCheckboxDisabled\"\r\n                 [attr.id]=\"checkboxAttributeID\"\r\n                 class=\"m-0 row-checkbox\"\r\n                 [formModel]=\"formControl\">\r\n    </ec-checkbox>\r\n  </td>\r\n</ng-container>\r\n<!-- The rest of the table row -->\r\n<ng-content></ng-content>", styles: [":host.is-enabled:not(.is-header){cursor:pointer}:host .checkbox{padding-left:2px;padding-right:2px;width:1.25rem}:host .checkbox:first-child{padding-left:.5rem;width:1.625rem}:host.border-bottom-0 .checkbox{border-bottom:0}td.checkbox ec-checkbox ::ng-deep *{pointer-events:none}th.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-th, middle)}td.checkbox{vertical-align:var(--ec-table-selectable-row-vertical-align-checkbox-td, top)}\n"] }]
         }], propDecorators: { id: [{

package/esm2022/lib/display/table/table.component.mjs

@@ -184,10 +184,10 @@ export class TableComponent {
             this.hasSelection = value.some(v => v);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableComponent, selector: "ec-table", inputs: { id: "id", scrollable: "scrollable", resizable: "resizable", condensed: "condensed", sortable: "sortable", selectionContext: "selectionContext", selectionToolbarTemplate: "selectionToolbarTemplate", selectable: "selectable", isForm: "isForm", sort: "sort", searchableTableResizableColumns: ["resizableColumns", "searchableTableResizableColumns"] }, outputs: { sortChange: "sortChange" }, host: { properties: { "attr.id": "this.id", "class.is-scrollable": "this.scrollable", "class.is-resizable": "this.resizable", "class.is-condensed": "this.condensed", "class.is-sortable": "this.sortable", "class.is-selectable": "this.selectable", "class.is-form-table": "this.isForm", "class.is-master-detail": "this.hasMasterDetailRows" } }, queries: [{ propertyName: "masterRows", predicate: TableMasterRowComponent, descendants: true }, { propertyName: "_resizableColumns", predicate: ResizableColumnComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"selectable-table-toolbar\"\r\n     *ngIf=\"hasSelection && selectionToolbarTemplate\">\r\n  <ng-container *ngTemplateOutlet=\"selectionToolbarTemplate\"></ng-container>\r\n</div>\r\n<div id=\"{{id}}-scroll-container\" \r\n     class=\"table-scroll-container\"\r\n     cdkScrollable>\r\n  <table class=\"main-table\"\r\n         id=\"{{id}}\"\r\n         [ecResizableTable]=\"resizable\"\r\n         [containerEl]=\"el\"\r\n         [sortableTable]=\"sortable\"\r\n         [resizableColumns]=\"resizableColumns\">\r\n    <ng-content></ng-content>\r\n  </table>\r\n</div>", styles: ["ec-table{display:flex;position:relative;min-height:0}ec-table .table-scroll-container{flex:1 1;min-height:0;overflow-y:auto}ec-table .main-table{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--ec-font-size-label)}ec-table .main-table th{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid var(--ec-border-color-dark);color:var(--ec-color-secondary-dark);font-weight:400;vertical-align:middle}ec-table .main-table th:first-child{padding-left:1rem}ec-table .main-table th:last-child{padding-right:1rem}ec-table .main-table td{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-top:1px solid var(--ec-border-color);vertical-align:top}ec-table .main-table td:first-child{padding-left:1rem}ec-table .main-table td:last-child{padding-right:1rem}ec-table .main-table tbody>tr:first-child td{border-top:0}ec-table .main-table tbody>tr.is-error td{background-color:var(--ec-background-color-danger)}ec-table .main-table tbody>tr.is-success td{background-color:var(--ec-background-color-success)}ec-table .main-table tfoot td{font-weight:700}ec-table .main-table tbody>tr.is-selected>td,ec-table .main-table tbody>tr.is-selected{background-color:var(--ec-background-color-selected)}ec-table .main-table tr.is-heading td{color:var(--ec-color-secondary-dark);font-size:var(--ec-font-size-label);font-weight:var(--ec-font-weight-bold);line-height:1.333333333;text-transform:uppercase;padding-bottom:0;vertical-align:bottom;border-top:0}ec-table .main-table tr.is-heading+tr td{border-top:0}ec-table .main-table th.actions-col,ec-table .main-table td.actions-col{padding:0}ec-table .main-table th.actions-1,ec-table .main-table td.actions-1{width:2.0625rem}ec-table .main-table th.actions-2,ec-table .main-table td.actions-2{width:4.0625rem}ec-table .main-table th.actions-3,ec-table .main-table td.actions-3{width:6.0625rem}ec-table .main-table th.actions-4,ec-table .main-table td.actions-4{width:8.0625rem}ec-table .main-table th.actions-5,ec-table .main-table td.actions-5{width:10.0625rem}ec-table.is-condensed th,ec-table.is-condensed td{padding-top:.25rem;padding-bottom:.25rem;height:1.5rem}ec-table.is-condensed:not(.has-borders)>table td{border-bottom-width:0;border-top-width:0}ec-table .selectable-table-toolbar{align-items:center;background-color:var(--ec-background-color);border-bottom:1px solid var(--ec-border-color-dark);display:flex;padding:0 .5rem;position:absolute;left:calc(var(--selection-toolbar-left, 0rem) + 1.625rem);top:0;height:3rem;right:0;z-index:calc(var(--ec-z-index-sticky-header) + 3)}ec-table.is-scrollable>.table-scroll-container>table{position:relative}ec-table.is-scrollable>.table-scroll-container>table>thead th{background-color:var(--ec-background-color);position:sticky!important;top:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color);position:sticky!important;bottom:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>thead th{background-color:var(--ec-background-color-body)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color-body)}ec-table.is-sortable th[data-sortfield]{-webkit-user-select:none;user-select:none}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper{display:flex;cursor:pointer}ec-table.is-sortable th[data-sortfield].is-resizable .content{flex:0 1 auto}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper:after{flex:none;width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after,ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-asc .content-wrapper:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield].is-resizable.text-right .content-wrapper{flex-direction:row-reverse}ec-table.is-sortable th[data-sortfield]:not(.is-resizable){cursor:pointer}ec-table.is-sortable th[data-sortfield]:not(.is-resizable):after{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-asc:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:after{content:\"\";display:none!important}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:before{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-asc:before{font:var(--fa-font-solid);content:\"\\f062\";display:inline-block}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before{transform:scaleY(-1)}ec-table.is-resizable .main-table{table-layout:fixed;width:100%}ec-table.is-resizable th.is-resizable{position:relative;overflow:visible;z-index:var(--ec-z-index-sticky-header)}ec-table.is-resizable th.is-resizable.is-active{-webkit-user-select:none;user-select:none}ec-table.is-resizable th.is-resizable.is-active .handle:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle{position:absolute;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter);right:0;padding:.5rem 0 .5rem 10px}ec-table.is-resizable th.is-resizable .handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}ec-table.is-resizable th.is-resizable .handle:hover{cursor:col-resize}ec-table.is-resizable th.is-resizable .handle:hover:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle:before{content:\"\";display:block;width:1px;background-color:var(--ec-border-color);position:absolute;top:.5rem;bottom:.5rem;right:0}ec-table.is-resizable th.is-resizable .content{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-resizable th.is-resizable:last-child .handle:before{display:none}ec-table.is-resizable td,ec-table.is-resizable th{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-selectable .main-table thead th{height:3rem}ec-table.is-selectable .main-table tbody>tr:hover>td{background-color:var(--ec-background-color-hover);border-color:transparent;cursor:pointer}ec-table.is-selectable .main-table tbody>tr:hover.is-selected{background-color:var(--ec-background-color-selected)}ec-table.is-selectable .main-table tbody>tr:hover+tr>td{border-color:var(--ec-background-color-hover)}ec-table.is-selectable th.is-resizable .handle{padding-top:1rem;padding-bottom:1rem}ec-table.is-selectable th.is-resizable .handle:before{top:1rem;bottom:1rem}ec-table.is-master-detail>table{table-layout:fixed}ec-table.is-form-table td{padding-bottom:.25rem;padding-top:.25rem;height:2.5rem;line-height:2rem;border-top:0;font-size:var(--ec-font-size-body)}ec-table.is-form-table tr:first-child td{padding-top:.5rem;height:2.75rem}ec-table.is-form-table tr:last-child td{padding-bottom:.5rem;height:2.75rem}ec-table.is-fixed .main-table{table-layout:fixed}\n"], dependencies: [{ 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.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i3.ResizableTableDirective, selector: "[ecResizableTable]", inputs: ["ecResizableTable", "containerEl", "sortableTable", "resizableColumns"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TableComponent, selector: "ec-table", inputs: { id: "id", scrollable: "scrollable", resizable: "resizable", condensed: "condensed", sortable: "sortable", selectionContext: "selectionContext", selectionToolbarTemplate: "selectionToolbarTemplate", selectable: "selectable", isForm: "isForm", sort: "sort", searchableTableResizableColumns: ["resizableColumns", "searchableTableResizableColumns"] }, outputs: { sortChange: "sortChange" }, host: { properties: { "attr.id": "this.id", "class.is-scrollable": "this.scrollable", "class.is-resizable": "this.resizable", "class.is-condensed": "this.condensed", "class.is-sortable": "this.sortable", "class.is-selectable": "this.selectable", "class.is-form-table": "this.isForm", "class.is-master-detail": "this.hasMasterDetailRows" } }, queries: [{ propertyName: "masterRows", predicate: TableMasterRowComponent, descendants: true }, { propertyName: "_resizableColumns", predicate: ResizableColumnComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"selectable-table-toolbar\"\r\n     *ngIf=\"hasSelection && selectionToolbarTemplate\">\r\n  <ng-container *ngTemplateOutlet=\"selectionToolbarTemplate\"></ng-container>\r\n</div>\r\n<div id=\"{{id}}-scroll-container\" \r\n     class=\"table-scroll-container\"\r\n     cdkScrollable>\r\n  <table class=\"main-table\"\r\n         id=\"{{id}}\"\r\n         [ecResizableTable]=\"resizable\"\r\n         [containerEl]=\"el\"\r\n         [sortableTable]=\"sortable\"\r\n         [resizableColumns]=\"resizableColumns\">\r\n    <ng-content></ng-content>\r\n  </table>\r\n</div>", styles: ["ec-table{display:flex;position:relative;min-height:0}ec-table .table-scroll-container{flex:1 1;min-height:0;overflow-y:auto}ec-table .main-table{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--ec-font-size-label)}ec-table .main-table th{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid var(--ec-border-color-dark);color:var(--ec-color-secondary-dark);font-weight:400;vertical-align:middle}ec-table .main-table th:first-child{padding-left:1rem}ec-table .main-table th:last-child{padding-right:1rem}ec-table .main-table td{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-top:1px solid var(--ec-border-color);vertical-align:top}ec-table .main-table td:first-child{padding-left:1rem}ec-table .main-table td:last-child{padding-right:1rem}ec-table .main-table tbody>tr:first-child td{border-top:0}ec-table .main-table tbody>tr.is-error td{background-color:var(--ec-background-color-danger)}ec-table .main-table tbody>tr.is-success td{background-color:var(--ec-background-color-success)}ec-table .main-table tfoot td{font-weight:700}ec-table .main-table tbody>tr.is-selected>td,ec-table .main-table tbody>tr.is-selected{background-color:var(--ec-background-color-selected)}ec-table .main-table tr.is-heading td{color:var(--ec-color-secondary-dark);font-size:var(--ec-font-size-label);font-weight:var(--ec-font-weight-bold);line-height:1.333333333;text-transform:uppercase;padding-bottom:0;vertical-align:bottom;border-top:0}ec-table .main-table tr.is-heading+tr td{border-top:0}ec-table .main-table th.actions-col,ec-table .main-table td.actions-col{padding:0}ec-table .main-table th.actions-1,ec-table .main-table td.actions-1{width:2.0625rem}ec-table .main-table th.actions-2,ec-table .main-table td.actions-2{width:4.0625rem}ec-table .main-table th.actions-3,ec-table .main-table td.actions-3{width:6.0625rem}ec-table .main-table th.actions-4,ec-table .main-table td.actions-4{width:8.0625rem}ec-table .main-table th.actions-5,ec-table .main-table td.actions-5{width:10.0625rem}ec-table.is-condensed th,ec-table.is-condensed td{padding-top:.25rem;padding-bottom:.25rem;height:1.5rem}ec-table.is-condensed:not(.has-borders)>table td{border-bottom-width:0;border-top-width:0}ec-table .selectable-table-toolbar{align-items:center;background-color:var(--ec-background-color);border-bottom:1px solid var(--ec-border-color-dark);display:flex;padding:0 .5rem;position:absolute;left:calc(var(--selection-toolbar-left, 0rem) + 1.625rem);top:0;height:3rem;right:0;z-index:calc(var(--ec-z-index-sticky-header) + 3)}ec-table.is-scrollable>.table-scroll-container>table{position:relative}ec-table.is-scrollable>.table-scroll-container>table>thead th{background-color:var(--ec-background-color);position:sticky!important;top:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color);position:sticky!important;bottom:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>thead th{background-color:var(--ec-background-color-body)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color-body)}ec-table.is-sortable th[data-sortfield]{-webkit-user-select:none;user-select:none}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper{display:flex;cursor:pointer}ec-table.is-sortable th[data-sortfield].is-resizable .content{flex:0 1 auto}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper:after{flex:none;width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after,ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-asc .content-wrapper:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield].is-resizable.text-right .content-wrapper{flex-direction:row-reverse}ec-table.is-sortable th[data-sortfield]:not(.is-resizable){cursor:pointer}ec-table.is-sortable th[data-sortfield]:not(.is-resizable):after{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-asc:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:after{content:\"\";display:none!important}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:before{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-asc:before{font:var(--fa-font-solid);content:\"\\f062\";display:inline-block}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before{transform:scaleY(-1)}ec-table.is-resizable .main-table{table-layout:fixed;width:100%}ec-table.is-resizable th.is-resizable{position:relative;overflow:visible;z-index:var(--ec-z-index-sticky-header)}ec-table.is-resizable th.is-resizable.is-active{-webkit-user-select:none;user-select:none}ec-table.is-resizable th.is-resizable.is-active .handle:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle{position:absolute;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter);right:0;padding:.5rem 0 .5rem 10px}ec-table.is-resizable th.is-resizable .handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}ec-table.is-resizable th.is-resizable .handle:hover{cursor:col-resize}ec-table.is-resizable th.is-resizable .handle:hover:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle:before{content:\"\";display:block;width:1px;background-color:var(--ec-border-color);position:absolute;top:.5rem;bottom:.5rem;right:0}ec-table.is-resizable th.is-resizable .content{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-resizable th.is-resizable:last-child .handle:before{display:none}ec-table.is-resizable td,ec-table.is-resizable th{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-selectable .main-table thead th{height:3rem}ec-table.is-selectable .main-table tbody>tr:hover>td{background-color:var(--ec-background-color-hover);border-color:transparent;cursor:pointer}ec-table.is-selectable .main-table tbody>tr:hover.is-selected{background-color:var(--ec-background-color-selected)}ec-table.is-selectable .main-table tbody>tr:hover+tr>td{border-color:var(--ec-background-color-hover)}ec-table.is-selectable th.is-resizable .handle{padding-top:1rem;padding-bottom:1rem}ec-table.is-selectable th.is-resizable .handle:before{top:1rem;bottom:1rem}ec-table.is-master-detail>table{table-layout:fixed}ec-table.is-form-table td{padding-bottom:.25rem;padding-top:.25rem;height:2.5rem;line-height:2rem;border-top:0;font-size:var(--ec-font-size-body)}ec-table.is-form-table tr:first-child td{padding-top:.5rem;height:2.75rem}ec-table.is-form-table tr:last-child td{padding-bottom:.5rem;height:2.75rem}ec-table.is-fixed .main-table{table-layout:fixed}\n"], dependencies: [{ 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.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i3.ResizableTableDirective, selector: "[ecResizableTable]", inputs: ["ecResizableTable", "containerEl", "sortableTable", "resizableColumns"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-table', encapsulation: ViewEncapsulation.None, template: "<div class=\"selectable-table-toolbar\"\r\n     *ngIf=\"hasSelection && selectionToolbarTemplate\">\r\n  <ng-container *ngTemplateOutlet=\"selectionToolbarTemplate\"></ng-container>\r\n</div>\r\n<div id=\"{{id}}-scroll-container\" \r\n     class=\"table-scroll-container\"\r\n     cdkScrollable>\r\n  <table class=\"main-table\"\r\n         id=\"{{id}}\"\r\n         [ecResizableTable]=\"resizable\"\r\n         [containerEl]=\"el\"\r\n         [sortableTable]=\"sortable\"\r\n         [resizableColumns]=\"resizableColumns\">\r\n    <ng-content></ng-content>\r\n  </table>\r\n</div>", styles: ["ec-table{display:flex;position:relative;min-height:0}ec-table .table-scroll-container{flex:1 1;min-height:0;overflow-y:auto}ec-table .main-table{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--ec-font-size-label)}ec-table .main-table th{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid var(--ec-border-color-dark);color:var(--ec-color-secondary-dark);font-weight:400;vertical-align:middle}ec-table .main-table th:first-child{padding-left:1rem}ec-table .main-table th:last-child{padding-right:1rem}ec-table .main-table td{height:2rem;line-height:1rem;padding:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-top:1px solid var(--ec-border-color);vertical-align:top}ec-table .main-table td:first-child{padding-left:1rem}ec-table .main-table td:last-child{padding-right:1rem}ec-table .main-table tbody>tr:first-child td{border-top:0}ec-table .main-table tbody>tr.is-error td{background-color:var(--ec-background-color-danger)}ec-table .main-table tbody>tr.is-success td{background-color:var(--ec-background-color-success)}ec-table .main-table tfoot td{font-weight:700}ec-table .main-table tbody>tr.is-selected>td,ec-table .main-table tbody>tr.is-selected{background-color:var(--ec-background-color-selected)}ec-table .main-table tr.is-heading td{color:var(--ec-color-secondary-dark);font-size:var(--ec-font-size-label);font-weight:var(--ec-font-weight-bold);line-height:1.333333333;text-transform:uppercase;padding-bottom:0;vertical-align:bottom;border-top:0}ec-table .main-table tr.is-heading+tr td{border-top:0}ec-table .main-table th.actions-col,ec-table .main-table td.actions-col{padding:0}ec-table .main-table th.actions-1,ec-table .main-table td.actions-1{width:2.0625rem}ec-table .main-table th.actions-2,ec-table .main-table td.actions-2{width:4.0625rem}ec-table .main-table th.actions-3,ec-table .main-table td.actions-3{width:6.0625rem}ec-table .main-table th.actions-4,ec-table .main-table td.actions-4{width:8.0625rem}ec-table .main-table th.actions-5,ec-table .main-table td.actions-5{width:10.0625rem}ec-table.is-condensed th,ec-table.is-condensed td{padding-top:.25rem;padding-bottom:.25rem;height:1.5rem}ec-table.is-condensed:not(.has-borders)>table td{border-bottom-width:0;border-top-width:0}ec-table .selectable-table-toolbar{align-items:center;background-color:var(--ec-background-color);border-bottom:1px solid var(--ec-border-color-dark);display:flex;padding:0 .5rem;position:absolute;left:calc(var(--selection-toolbar-left, 0rem) + 1.625rem);top:0;height:3rem;right:0;z-index:calc(var(--ec-z-index-sticky-header) + 3)}ec-table.is-scrollable>.table-scroll-container>table{position:relative}ec-table.is-scrollable>.table-scroll-container>table>thead th{background-color:var(--ec-background-color);position:sticky!important;top:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color);position:sticky!important;bottom:0;z-index:var(--ec-z-index-sticky-header)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>thead th{background-color:var(--ec-background-color-body)}ec-table.is-scrollable.bg-body>.table-scroll-container>table>tfoot td{background-color:var(--ec-background-color-body)}ec-table.is-sortable th[data-sortfield]{-webkit-user-select:none;user-select:none}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper{display:flex;cursor:pointer}ec-table.is-sortable th[data-sortfield].is-resizable .content{flex:0 1 auto}ec-table.is-sortable th[data-sortfield].is-resizable .content-wrapper:after{flex:none;width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after,ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-asc .content-wrapper:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield].is-resizable.is-sorted-desc .content-wrapper:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield].is-resizable.text-right .content-wrapper{flex-direction:row-reverse}ec-table.is-sortable th[data-sortfield]:not(.is-resizable){cursor:pointer}ec-table.is-sortable th[data-sortfield]:not(.is-resizable):after{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-asc:after{font:var(--fa-font-solid);content:\"\\f062\";display:inline-flex}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).is-sorted-desc:after{transform:scaleY(-1)}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:after{content:\"\";display:none!important}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right:before{width:.875rem;height:.875rem;margin:0 .25rem;font-size:.75rem;display:none;align-items:center;justify-content:center}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before,ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-asc:before{font:var(--fa-font-solid);content:\"\\f062\";display:inline-block}ec-table.is-sortable th[data-sortfield]:not(.is-resizable).text-right.is-sorted-desc:before{transform:scaleY(-1)}ec-table.is-resizable .main-table{table-layout:fixed;width:100%}ec-table.is-resizable th.is-resizable{position:relative;overflow:visible;z-index:var(--ec-z-index-sticky-header)}ec-table.is-resizable th.is-resizable.is-active{-webkit-user-select:none;user-select:none}ec-table.is-resizable th.is-resizable.is-active .handle:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle{position:absolute;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter);right:0;padding:.5rem 0 .5rem 10px}ec-table.is-resizable th.is-resizable .handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}ec-table.is-resizable th.is-resizable .handle:hover{cursor:col-resize}ec-table.is-resizable th.is-resizable .handle:hover:after{background-color:var(--ec-color-interactive)}ec-table.is-resizable th.is-resizable .handle:before{content:\"\";display:block;width:1px;background-color:var(--ec-border-color);position:absolute;top:.5rem;bottom:.5rem;right:0}ec-table.is-resizable th.is-resizable .content{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-resizable th.is-resizable:last-child .handle:before{display:none}ec-table.is-resizable td,ec-table.is-resizable th{overflow:hidden;text-overflow:clip;white-space:nowrap}ec-table.is-selectable .main-table thead th{height:3rem}ec-table.is-selectable .main-table tbody>tr:hover>td{background-color:var(--ec-background-color-hover);border-color:transparent;cursor:pointer}ec-table.is-selectable .main-table tbody>tr:hover.is-selected{background-color:var(--ec-background-color-selected)}ec-table.is-selectable .main-table tbody>tr:hover+tr>td{border-color:var(--ec-background-color-hover)}ec-table.is-selectable th.is-resizable .handle{padding-top:1rem;padding-bottom:1rem}ec-table.is-selectable th.is-resizable .handle:before{top:1rem;bottom:1rem}ec-table.is-master-detail>table{table-layout:fixed}ec-table.is-form-table td{padding-bottom:.25rem;padding-top:.25rem;height:2.5rem;line-height:2rem;border-top:0;font-size:var(--ec-font-size-body)}ec-table.is-form-table tr:first-child td{padding-top:.5rem;height:2.75rem}ec-table.is-form-table tr:last-child td{padding-bottom:.5rem;height:2.75rem}ec-table.is-fixed .main-table{table-layout:fixed}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { id: [{

package/esm2022/lib/display/tags/tags.component.mjs

@@ -57,10 +57,10 @@ export class TagsComponent {
         this.tagsArray = this.tagsArray.filter(t => t !== tag);
         this.tagClosed.emit(tag);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TagsComponent, selector: "ec-tags", inputs: { id: "id", tags: "tags", wrap: "wrap", isCondensed: "isCondensed" }, outputs: { tagClosed: "tagClosed" }, usesOnChanges: true, ngImport: i0, template: "<ul class=\"tags\"\r\n    [class.is-wrapped]=\"wrap\">\r\n   <li *ngFor=\"let tag of tagsArray; index as i\"\r\n       id=\"{{id}}_tag_{{i}}\"\r\n       class=\"tag is-{{tag.type}} {{tag.classList}} mr-1\"\r\n       [ngClass]=\"{'text-caption-1': !isCondensed, 'text-caption-2': isCondensed, 'is-condensed': isCondensed, 'pr-0': tag.isDismissable, 'is-link': tag.url}\"\r\n       title=\"{{tag.tooltip | translate}}\">\r\n      <i *ngIf=\"tag.icon\"\r\n         class=\"ec-icon {{tag.icon}} ec-icon-sm\"></i>\r\n      <span *ngIf=\"!tag.url\">{{tag.label | translate}}</span>\r\n\r\n      <a *ngIf=\"tag.url\"\r\n         id=\"{{id}}_tag_{{i}}_link\"\r\n         class=\"font-weight-bold\"\r\n         href=\"{{tag.url}}\"\r\n         target=\"{{tag.target}}\">{{tag.label | translate}}</a>\r\n\r\n      <button id=\"{{id}}_tag_{{i}}_dismissButton\"\r\n              *ngIf=\"tag.isDismissable\"\r\n              (click)=\"closeTag(tag)\">\r\n         <i class=\"ec-icon ec-icon-sm icon-cancel\"></i>\r\n      </button>\r\n   </li>\r\n</ul>", styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:var(--ec-color-gray-1);border:2px solid var(--ec-color-gray-4);display:inline-flex;align-items:center;border-radius:calc(var(--ec-border-radius, .25rem) * 3);height:1.5rem;line-height:1.25rem;padding:0 .4375rem;vertical-align:top}.tag>.ec-icon:first-child{margin-right:.1875rem}.tag .ec-icon{display:flex;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;width:auto;height:auto;min-width:1em;justify-content:center}.tag.is-inverted{background-color:var(--ec-background-color);border-color:var(--ec-background-color)}.tag.is-info{background-color:var(--ec-color-cobalt-1);border-color:var(--ec-color-info)}.tag.is-info>.ec-icon:first-child{color:var(--ec-color-info)}.tag.is-success{background-color:var(--ec-color-green-1);border-color:var(--ec-color-success)}.tag.is-success>.ec-icon:first-child{color:var(--ec-color-success)}.tag.is-warning{background-color:var(--ec-color-yellow-1);border-color:var(--ec-color-caution)}.tag.is-warning>.ec-icon:first-child{color:var(--ec-color-caution)}.tag.is-danger{background-color:var(--ec-color-red-1);border-color:var(--ec-color-danger)}.tag.is-danger>.ec-icon:first-child{color:var(--ec-color-danger)}.tag.is-accent{background-color:var(--ec-color-purple-1);border-color:var(--ec-color-accent)}.tag.is-accent>.ec-icon:first-child{color:var(--ec-color-accent)}.tag.is-chargeback{background-color:var(--ec-color-orange-1);border-color:var(--ec-color-orange-7)}.tag.is-chargeback>.ec-icon:first-child{color:var(--ec-color-orange-7)}.tag.is-accrual{background-color:var(--ec-color-aqua-1);border-color:var(--ec-color-aqua-5)}.tag.is-accrual>.ec-icon:first-child{color:var(--ec-color-aqua-5)}.tag.is-system{background-color:var(--ec-color-gray-1);border-color:var(--ec-color-gray-4)}.tag.is-system>.ec-icon:first-child{color:var(--ec-color-gray-4)}button{background-color:transparent;border:0;display:flex;align-items:center;padding:0 .25rem;height:100%;cursor:pointer;position:relative}button:hover,button:focus{outline:none}button:hover:before,button:focus:before{display:block;content:\"\";position:absolute;inset:.0625rem .125rem;background-color:#1a1a231a;border-radius:.125rem}.is-condensed{border-radius:var(--ec-border-radius);border-width:1px;padding:0 .25rem;height:1.125rem;line-height:1.125rem;min-width:1.125rem;justify-content:center}.is-condensed>.ec-icon:first-child{margin-right:.125rem}.is-link a:after{opacity:1;margin-left:.1875rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TagsComponent, selector: "ec-tags", inputs: { id: "id", tags: "tags", wrap: "wrap", isCondensed: "isCondensed" }, outputs: { tagClosed: "tagClosed" }, usesOnChanges: true, ngImport: i0, template: "<ul class=\"tags\"\r\n    [class.is-wrapped]=\"wrap\">\r\n   <li *ngFor=\"let tag of tagsArray; index as i\"\r\n       id=\"{{id}}_tag_{{i}}\"\r\n       class=\"tag is-{{tag.type}} {{tag.classList}} mr-1\"\r\n       [ngClass]=\"{'text-caption-1': !isCondensed, 'text-caption-2': isCondensed, 'is-condensed': isCondensed, 'pr-0': tag.isDismissable, 'is-link': tag.url}\"\r\n       title=\"{{tag.tooltip | translate}}\">\r\n      <i *ngIf=\"tag.icon\"\r\n         class=\"ec-icon {{tag.icon}} ec-icon-sm\"></i>\r\n      <span *ngIf=\"!tag.url\">{{tag.label | translate}}</span>\r\n\r\n      <a *ngIf=\"tag.url\"\r\n         id=\"{{id}}_tag_{{i}}_link\"\r\n         class=\"font-weight-bold\"\r\n         href=\"{{tag.url}}\"\r\n         target=\"{{tag.target}}\">{{tag.label | translate}}</a>\r\n\r\n      <button id=\"{{id}}_tag_{{i}}_dismissButton\"\r\n              *ngIf=\"tag.isDismissable\"\r\n              (click)=\"closeTag(tag)\">\r\n         <i class=\"ec-icon ec-icon-sm icon-cancel\"></i>\r\n      </button>\r\n   </li>\r\n</ul>", styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:var(--ec-color-gray-1);border:2px solid var(--ec-color-gray-4);display:inline-flex;align-items:center;border-radius:calc(var(--ec-border-radius, .25rem) * 3);height:1.5rem;line-height:1.25rem;padding:0 .4375rem;vertical-align:top}.tag>.ec-icon:first-child{margin-right:.1875rem}.tag .ec-icon{display:flex;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;width:auto;height:auto;min-width:1em;justify-content:center}.tag.is-inverted{background-color:var(--ec-background-color);border-color:var(--ec-background-color)}.tag.is-info{background-color:var(--ec-color-cobalt-1);border-color:var(--ec-color-info)}.tag.is-info>.ec-icon:first-child{color:var(--ec-color-info)}.tag.is-success{background-color:var(--ec-color-green-1);border-color:var(--ec-color-success)}.tag.is-success>.ec-icon:first-child{color:var(--ec-color-success)}.tag.is-warning{background-color:var(--ec-color-yellow-1);border-color:var(--ec-color-caution)}.tag.is-warning>.ec-icon:first-child{color:var(--ec-color-caution)}.tag.is-danger{background-color:var(--ec-color-red-1);border-color:var(--ec-color-danger)}.tag.is-danger>.ec-icon:first-child{color:var(--ec-color-danger)}.tag.is-accent{background-color:var(--ec-color-purple-1);border-color:var(--ec-color-accent)}.tag.is-accent>.ec-icon:first-child{color:var(--ec-color-accent)}.tag.is-chargeback{background-color:var(--ec-color-orange-1);border-color:var(--ec-color-orange-7)}.tag.is-chargeback>.ec-icon:first-child{color:var(--ec-color-orange-7)}.tag.is-accrual{background-color:var(--ec-color-aqua-1);border-color:var(--ec-color-aqua-5)}.tag.is-accrual>.ec-icon:first-child{color:var(--ec-color-aqua-5)}.tag.is-system{background-color:var(--ec-color-gray-1);border-color:var(--ec-color-gray-4)}.tag.is-system>.ec-icon:first-child{color:var(--ec-color-gray-4)}button{background-color:transparent;border:0;display:flex;align-items:center;padding:0 .25rem;height:100%;cursor:pointer;position:relative}button:hover,button:focus{outline:none}button:hover:before,button:focus:before{display:block;content:\"\";position:absolute;inset:.0625rem .125rem;background-color:#1a1a231a;border-radius:.125rem}.is-condensed{border-radius:var(--ec-border-radius);border-width:1px;padding:0 .25rem;height:1.125rem;line-height:1.125rem;min-width:1.125rem;justify-content:center}.is-condensed>.ec-icon:first-child{margin-right:.125rem}.is-link a:after{opacity:1;margin-left:.1875rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TagsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-tags', template: "<ul class=\"tags\"\r\n    [class.is-wrapped]=\"wrap\">\r\n   <li *ngFor=\"let tag of tagsArray; index as i\"\r\n       id=\"{{id}}_tag_{{i}}\"\r\n       class=\"tag is-{{tag.type}} {{tag.classList}} mr-1\"\r\n       [ngClass]=\"{'text-caption-1': !isCondensed, 'text-caption-2': isCondensed, 'is-condensed': isCondensed, 'pr-0': tag.isDismissable, 'is-link': tag.url}\"\r\n       title=\"{{tag.tooltip | translate}}\">\r\n      <i *ngIf=\"tag.icon\"\r\n         class=\"ec-icon {{tag.icon}} ec-icon-sm\"></i>\r\n      <span *ngIf=\"!tag.url\">{{tag.label | translate}}</span>\r\n\r\n      <a *ngIf=\"tag.url\"\r\n         id=\"{{id}}_tag_{{i}}_link\"\r\n         class=\"font-weight-bold\"\r\n         href=\"{{tag.url}}\"\r\n         target=\"{{tag.target}}\">{{tag.label | translate}}</a>\r\n\r\n      <button id=\"{{id}}_tag_{{i}}_dismissButton\"\r\n              *ngIf=\"tag.isDismissable\"\r\n              (click)=\"closeTag(tag)\">\r\n         <i class=\"ec-icon ec-icon-sm icon-cancel\"></i>\r\n      </button>\r\n   </li>\r\n</ul>", styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:var(--ec-color-gray-1);border:2px solid var(--ec-color-gray-4);display:inline-flex;align-items:center;border-radius:calc(var(--ec-border-radius, .25rem) * 3);height:1.5rem;line-height:1.25rem;padding:0 .4375rem;vertical-align:top}.tag>.ec-icon:first-child{margin-right:.1875rem}.tag .ec-icon{display:flex;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;width:auto;height:auto;min-width:1em;justify-content:center}.tag.is-inverted{background-color:var(--ec-background-color);border-color:var(--ec-background-color)}.tag.is-info{background-color:var(--ec-color-cobalt-1);border-color:var(--ec-color-info)}.tag.is-info>.ec-icon:first-child{color:var(--ec-color-info)}.tag.is-success{background-color:var(--ec-color-green-1);border-color:var(--ec-color-success)}.tag.is-success>.ec-icon:first-child{color:var(--ec-color-success)}.tag.is-warning{background-color:var(--ec-color-yellow-1);border-color:var(--ec-color-caution)}.tag.is-warning>.ec-icon:first-child{color:var(--ec-color-caution)}.tag.is-danger{background-color:var(--ec-color-red-1);border-color:var(--ec-color-danger)}.tag.is-danger>.ec-icon:first-child{color:var(--ec-color-danger)}.tag.is-accent{background-color:var(--ec-color-purple-1);border-color:var(--ec-color-accent)}.tag.is-accent>.ec-icon:first-child{color:var(--ec-color-accent)}.tag.is-chargeback{background-color:var(--ec-color-orange-1);border-color:var(--ec-color-orange-7)}.tag.is-chargeback>.ec-icon:first-child{color:var(--ec-color-orange-7)}.tag.is-accrual{background-color:var(--ec-color-aqua-1);border-color:var(--ec-color-aqua-5)}.tag.is-accrual>.ec-icon:first-child{color:var(--ec-color-aqua-5)}.tag.is-system{background-color:var(--ec-color-gray-1);border-color:var(--ec-color-gray-4)}.tag.is-system>.ec-icon:first-child{color:var(--ec-color-gray-4)}button{background-color:transparent;border:0;display:flex;align-items:center;padding:0 .25rem;height:100%;cursor:pointer;position:relative}button:hover,button:focus{outline:none}button:hover:before,button:focus:before{display:block;content:\"\";position:absolute;inset:.0625rem .125rem;background-color:#1a1a231a;border-radius:.125rem}.is-condensed{border-radius:var(--ec-border-radius);border-width:1px;padding:0 .25rem;height:1.125rem;line-height:1.125rem;min-width:1.125rem;justify-content:center}.is-condensed>.ec-icon:first-child{margin-right:.125rem}.is-link a:after{opacity:1;margin-left:.1875rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { id: [{

package/esm2022/lib/display/toast/toast/toast.component.mjs

@@ -54,10 +54,10 @@ export class ToastComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastComponent, deps: [{ token: i1.ToastService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ToastComponent, selector: "ec-toast", inputs: { toastItem: "toastItem" }, outputs: { closed: "closed" }, host: { properties: { "attr.id": "this.id", "class.is-open": "this.open", "style.--toast-animation-duration.ms": "this.TOAST_ANIMATION_DURATION" } }, usesOnChanges: true, ngImport: i0, template: "<ec-banner id=\"{{toastItem?.id}}_banner\"\r\n           [type]=\"toastItem?.type\"\r\n           bannerStyle=\"toast\"\r\n           [customIcon]=\"toastItem?.icon\"\r\n           [showCloseBtn]=\"toastItem?.dismissible\"\r\n           [autoHideOnClose]=\"false\"\r\n           (closed)=\"closeClicked()\">\r\n  <div class=\"d-flex\">\r\n    <div id=\"{{toastItem?.id}}_message\"\r\n         [innerHTML]=\"toastItem?.message | translate\"></div>\r\n    <button id=\"{{toastItem?.id}}_action\"\r\n            ecLinkButton\r\n            *ngIf=\"toastItem?.action && toastItem?.actionLabel\"\r\n            class=\"font-weight-bold ml-2\"\r\n            (click)=\"toastItem!.action!()\">{{toastItem?.actionLabel | translate}}</button>\r\n  </div>\r\n</ec-banner>", styles: [":host{display:block;position:fixed;bottom:0;left:50%;transform:translate(-50%,150%);transition:transform var(--toast-animation-duration, .25s);transition-timing-function:ease-in;z-index:var(--ec-z-index-toast)}:host.is-open{transform:translate(-50%,calc(-1 * var(--toast-bottom, 0rem) - 1.5rem));transition-timing-function:cubic-bezier(.18,.89,.32,1.28)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BannerComponent, selector: "ec-banner", inputs: ["hidden", "id", "type", "bannerStyle", "title", "text", "list", "showCloseBtn", "autoHideOnClose", "customIcon", "rememberClosed"], outputs: ["closed"] }, { kind: "component", type: i4.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastComponent, deps: [{ token: i1.ToastService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ToastComponent, selector: "ec-toast", inputs: { toastItem: "toastItem" }, outputs: { closed: "closed" }, host: { properties: { "attr.id": "this.id", "class.is-open": "this.open", "style.--toast-animation-duration.ms": "this.TOAST_ANIMATION_DURATION" } }, usesOnChanges: true, ngImport: i0, template: "<ec-banner id=\"{{toastItem?.id}}_banner\"\r\n           [type]=\"toastItem?.type\"\r\n           bannerStyle=\"toast\"\r\n           [customIcon]=\"toastItem?.icon\"\r\n           [showCloseBtn]=\"toastItem?.dismissible\"\r\n           [autoHideOnClose]=\"false\"\r\n           (closed)=\"closeClicked()\">\r\n  <div class=\"d-flex\">\r\n    <div id=\"{{toastItem?.id}}_message\"\r\n         [innerHTML]=\"toastItem?.message | translate\"></div>\r\n    <button id=\"{{toastItem?.id}}_action\"\r\n            ecLinkButton\r\n            *ngIf=\"toastItem?.action && toastItem?.actionLabel\"\r\n            class=\"font-weight-bold ml-2\"\r\n            (click)=\"toastItem!.action!()\">{{toastItem?.actionLabel | translate}}</button>\r\n  </div>\r\n</ec-banner>", styles: [":host{display:block;position:fixed;bottom:0;left:50%;transform:translate(-50%,150%);transition:transform var(--toast-animation-duration, .25s);transition-timing-function:ease-in;z-index:var(--ec-z-index-toast)}:host.is-open{transform:translate(-50%,calc(-1 * var(--toast-bottom, 0rem) - 1.5rem));transition-timing-function:cubic-bezier(.18,.89,.32,1.28)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BannerComponent, selector: "ec-banner", inputs: ["hidden", "id", "type", "bannerStyle", "title", "text", "list", "showCloseBtn", "autoHideOnClose", "customIcon", "rememberClosed"], outputs: ["closed"] }, { kind: "component", type: i4.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ec-toast', template: "<ec-banner id=\"{{toastItem?.id}}_banner\"\r\n           [type]=\"toastItem?.type\"\r\n           bannerStyle=\"toast\"\r\n           [customIcon]=\"toastItem?.icon\"\r\n           [showCloseBtn]=\"toastItem?.dismissible\"\r\n           [autoHideOnClose]=\"false\"\r\n           (closed)=\"closeClicked()\">\r\n  <div class=\"d-flex\">\r\n    <div id=\"{{toastItem?.id}}_message\"\r\n         [innerHTML]=\"toastItem?.message | translate\"></div>\r\n    <button id=\"{{toastItem?.id}}_action\"\r\n            ecLinkButton\r\n            *ngIf=\"toastItem?.action && toastItem?.actionLabel\"\r\n            class=\"font-weight-bold ml-2\"\r\n            (click)=\"toastItem!.action!()\">{{toastItem?.actionLabel | translate}}</button>\r\n  </div>\r\n</ec-banner>", styles: [":host{display:block;position:fixed;bottom:0;left:50%;transform:translate(-50%,150%);transition:transform var(--toast-animation-duration, .25s);transition-timing-function:ease-in;z-index:var(--ec-z-index-toast)}:host.is-open{transform:translate(-50%,calc(-1 * var(--toast-bottom, 0rem) - 1.5rem));transition-timing-function:cubic-bezier(.18,.89,.32,1.28)}\n"] }]
         }], ctorParameters: () => [{ type: i1.ToastService }], propDecorators: { toastItem: [{

package/esm2022/lib/display/toast/toast.service.mjs

@@ -23,10 +23,10 @@ export class ToastService {
         const event = new ToastEvent('remove', toast, source);
         this._events.next(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToastService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'