@cqa-lib/cqa-ui 1.0.30 → 1.0.32

package/esm2020/lib/dashboards/failed-test-cases-card/failed-test-cases-card.component.mjs

@@ -1,6 +1,7 @@
 import { ChangeDetectionStrategy, Component, Input, Output, EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
+import * as i1 from "@angular/material/icon";
+import * as i2 from "@angular/common";
 export class FailedTestCasesCardComponent {
     constructor() {
         /** E.g., "C-62: Upload Content" */
@@ -36,12 +37,45 @@ export class FailedTestCasesCardComponent {
     onCardClick() {
         this.cardClick.emit();
     }
+    onCopyTitle(event) {
+        event.stopPropagation(); // Prevent card click from firing
+        if (navigator.clipboard && this.title) {
+            navigator.clipboard.writeText(this.title).catch((err) => {
+                console.error('Failed to copy title:', err);
+                // Fallback for older browsers
+                this.fallbackCopyToClipboard(this.title);
+            });
+        }
+        else {
+            // Fallback for browsers without clipboard API
+            this.fallbackCopyToClipboard(this.title);
+        }
+    }
+    fallbackCopyToClipboard(text) {
+        const textArea = document.createElement('textarea');
+        textArea.value = text;
+        textArea.style.position = 'fixed';
+        textArea.style.left = '-999999px';
+        textArea.style.top = '-999999px';
+        document.body.appendChild(textArea);
+        textArea.focus();
+        textArea.select();
+        try {
+            document.execCommand('copy');
+        }
+        catch (err) {
+            console.error('Fallback copy failed:', err);
+        }
+        finally {
+            document.body.removeChild(textArea);
+        }
+    }
 }
 FailedTestCasesCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass", tags: "tags" }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title -->\n        <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "number": i1.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass", tags: "tags" }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title with Copy Button -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-1 cqa-min-w-0\">\n          <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A] cqa-truncate\">{{ title }}</h3>\n          <button\n            type=\"button\"\n            class=\"cqa-inline-flex cqa-cursor-pointer cqa-outline-none cqa-bg-transparent cqa-border-none cqa-p-1 cqa-items-center cqa-justify-center cqa-min-w-[20px] cqa-min-h-[20px] cqa-flex-shrink-0 cqa-text-[#6B7280] hover:cqa-text-[#1A1A1A] cqa-transition-colors\"\n            (click)=\"onCopyTitle($event)\"\n            [attr.aria-label]=\"'Copy title'\"\n            title=\"Copy title\"\n          >\n            <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">content_copy</mat-icon>\n          </button>\n        </div>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "number": i2.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title -->\n        <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", styles: [] }]
+            args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title with Copy Button -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-1 cqa-min-w-0\">\n          <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A] cqa-truncate\">{{ title }}</h3>\n          <button\n            type=\"button\"\n            class=\"cqa-inline-flex cqa-cursor-pointer cqa-outline-none cqa-bg-transparent cqa-border-none cqa-p-1 cqa-items-center cqa-justify-center cqa-min-w-[20px] cqa-min-h-[20px] cqa-flex-shrink-0 cqa-text-[#6B7280] hover:cqa-text-[#1A1A1A] cqa-transition-colors\"\n            (click)=\"onCopyTitle($event)\"\n            [attr.aria-label]=\"'Copy title'\"\n            title=\"Copy title\"\n          >\n            <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">content_copy</mat-icon>\n          </button>\n        </div>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", styles: [] }]
         }], propDecorators: { title: [{
                 type: Input
             }], failures: [{
@@ -69,4 +103,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
             }], cardClick: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2Rhc2hib2FyZHMvZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC9mYWlsZWQtdGVzdC1jYXNlcy1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZGFzaGJvYXJkcy9mYWlsZWQtdGVzdC1jYXNlcy1jYXJkL2ZhaWxlZC10ZXN0LWNhc2VzLWNhcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUWhHLE1BQU0sT0FBTyw0QkFBNEI7SUFOekM7UUFPRSxtQ0FBbUM7UUFDMUIsVUFBSyxHQUFXLGtCQUFrQixDQUFDO1FBQzVDLGdEQUFnRDtRQUN2QyxhQUFRLEdBQVcsQ0FBQyxDQUFDO1FBQzlCLG9DQUFvQztRQUMzQixrQkFBYSxHQUFXLFVBQVUsQ0FBQztRQUM1QyxvREFBb0Q7UUFDM0MsY0FBUyxHQUFXLHFDQUFxQyxDQUFDO1FBR25FLCtDQUErQztRQUN0QyxtQkFBYyxHQUFXLFlBQVksQ0FBQztRQUMvQyx3Q0FBd0M7UUFDL0Isa0JBQWEsR0FBWSxJQUFJLENBQUM7UUFHdkMsMEJBQTBCO1FBQ2pCLG9CQUFlLEdBQVcsYUFBYSxDQUFDO1FBQ2pELDhDQUE4QztRQUNyQyxjQUFTLEdBQVcsRUFBRSxDQUFDO1FBQ2hDLCtCQUErQjtRQUN0QixvQkFBZSxHQUFXLG9CQUFvQixDQUFDO1FBQ3hELDhDQUE4QztRQUNyQyxTQUFJLEdBQWEsRUFBRSxDQUFDO1FBQzdCLHVDQUF1QztRQUM3QixjQUFTLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztLQWFoRDtJQVhDLElBQUksZ0JBQWdCO1FBQ2xCLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsQ0FBQyxNQUFNLEVBQUU7WUFDcEQsT0FBTyx5QkFBeUIsQ0FBQztTQUNsQztRQUNELHNDQUFzQztRQUN0QyxPQUFPLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDL0IsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3hCLENBQUM7O3lIQXRDVSw0QkFBNEI7NkdBQTVCLDRCQUE0QixtYkNSekMsZzdFQXdDTTsyRkRoQ08sNEJBQTRCO2tCQU54QyxTQUFTOytCQUNFLDRCQUE0QixtQkFHckIsdUJBQXVCLENBQUMsTUFBTTs4QkFJdEMsS0FBSztzQkFBYixLQUFLO2dCQUVHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBRUcsYUFBYTtzQkFBckIsS0FBSztnQkFFRyxTQUFTO3NCQUFqQixLQUFLO2dCQUVHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBRUcsY0FBYztzQkFBdEIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUcsZUFBZTtzQkFBdkIsS0FBSztnQkFFRyxTQUFTO3NCQUFqQixLQUFLO2dCQUVHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBRUcsSUFBSTtzQkFBWixLQUFLO2dCQUVJLFNBQVM7c0JBQWxCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3FhLWZhaWxlZC10ZXN0LWNhc2VzLWNhcmQnLFxuICB0ZW1wbGF0ZVVybDogJy4vZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogW10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBGYWlsZWRUZXN0Q2FzZXNDYXJkQ29tcG9uZW50IHtcbiAgLyoqIEUuZy4sIFwiQy02MjogVXBsb2FkIENvbnRlbnRcIiAqL1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJ0ZhaWxlZCBUZXN0IENhc2UnO1xuICAvKiogTnVtYmVyIG9mIGZhaWx1cmVzIHRvIGRpc3BsYXkgaW4gdGhlIHBpbGwgKi9cbiAgQElucHV0KCkgZmFpbHVyZXM6IG51bWJlciA9IDA7XG4gIC8qKiBQaWxsIGxhYmVsIChlLmcuLCBcImZhaWx1cmVzXCIpICovXG4gIEBJbnB1dCgpIGZhaWx1cmVzTGFiZWw6IHN0cmluZyA9ICdmYWlsdXJlcyc7XG4gIC8qKiBPcHRpb25hbCBjdXN0b20gY2xhc3MgZm9yIHRoZSBwaWxsIGJhY2tncm91bmQgKi9cbiAgQElucHV0KCkgcGlsbENsYXNzOiBzdHJpbmcgPSAnY3FhLWJnLVsjRjE1RjVGXSBjcWEtdGV4dC1bI0ZBRkFGQV0nO1xuICAvKiogUm9vdCBjYXVzZSB0ZXh0OyB3aGVuIGVtcHR5LCBzaG93IGEgZGVmYXVsdCBtZXNzYWdlICovXG4gIEBJbnB1dCgpIHJvb3RDYXVzZT86IHN0cmluZztcbiAgLyoqIFJvb3QgY2F1c2UgbGFiZWwgKGxlZnQgcGFydCwgZW1waGFzaXplZCkgKi9cbiAgQElucHV0KCkgcm9vdENhdXNlTGFiZWw6IHN0cmluZyA9ICdSb290IGNhdXNlJztcbiAgLyoqIElmIGZhbHNlLCBoaWRlIHRoZSByb290IGNhdXNlIHJvdyAqL1xuICBASW5wdXQoKSBzaG93Um9vdENhdXNlOiBib29sZWFuID0gdHJ1ZTtcbiAgLyoqIExhc3QgZmFpbGVkIHRleHQgKGUuZy4sIFwiMiBob3VycyBhZ29cIikgKi9cbiAgQElucHV0KCkgbGFzdEZhaWxlZD86IHN0cmluZztcbiAgLyoqIExhYmVsIGZvciB0aW1lc3RhbXAgKi9cbiAgQElucHV0KCkgbGFzdEZhaWxlZExhYmVsOiBzdHJpbmcgPSAnTGFzdCBmYWlsZWQnO1xuICAvKiogT3B0aW9uYWwgZXh0cmEgY2xhc3MgZm9yIHRoZSBvdXRlciBjYXJkICovXG4gIEBJbnB1dCgpIGNhcmRDbGFzczogc3RyaW5nID0gJyc7XG4gIC8qKiBMZWZ0IGJvcmRlciBhY2NlbnQgY2xhc3MgKi9cbiAgQElucHV0KCkgbGVmdEFjY2VudENsYXNzOiBzdHJpbmcgPSAnY3FhLWJvcmRlci1sLVs0cHhdJztcbiAgLyoqIE9wdGlvbmFsIHRhZ3MgdG8gcmVuZGVyIHVuZGVyIHRoZSB0aXRsZSAqL1xuICBASW5wdXQoKSB0YWdzOiBzdHJpbmdbXSA9IFtdO1xuICAvKiogRW1pdHRlZCB3aGVuIHRoZSBjYXJkIGlzIGNsaWNrZWQgKi9cbiAgQE91dHB1dCgpIGNhcmRDbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICBnZXQgcm9vdENhdXNlRGlzcGxheSgpOiBzdHJpbmcge1xuICAgIGlmICghdGhpcy5yb290Q2F1c2UgfHwgIXRoaXMucm9vdENhdXNlLnRyaW0oKS5sZW5ndGgpIHtcbiAgICAgIHJldHVybiAnTm8gcm9vdCBjYXVzZSBhdmFpbGFibGUnO1xuICAgIH1cbiAgICAvLyBUcmltIGFuZCByZXR1cm4gdGhlIHJvb3QgY2F1c2UgdGV4dFxuICAgIHJldHVybiB0aGlzLnJvb3RDYXVzZS50cmltKCk7XG4gIH1cblxuICBvbkNhcmRDbGljaygpOiB2b2lkIHtcbiAgICB0aGlzLmNhcmRDbGljay5lbWl0KCk7XG4gIH1cbn1cblxuXG4iLCI8ZGl2IGlkPVwiY3FhLXVpLXJvb3RcIj5cbiAgPGRpdiBjbGFzcz1cImNxYS13LWZ1bGwgY3FhLWJnLVsjRkVGMkYyNDBdIGNxYS1ib3JkZXIgY3FhLWJvcmRlci1zb2xpZCBjcWEtYm9yZGVyLVsjRTVFN0VCXSBjcWEtYm9yZGVyLWwtWyNFRjQ0NDRdIGNxYS1yb3VuZGVkLVsxMHB4XSBjcWEtcC1bMTBweF0gY3FhLXBsLVsyMHB4XSBjcWEtY3Vyc29yLXBvaW50ZXIgY3FhLXRyYW5zaXRpb24tc2hhZG93IGNxYS1kdXJhdGlvbi0yMDAgaG92ZXI6Y3FhLXNoYWRvdy1tZFwiXG4gICAgW25nQ2xhc3NdPVwiW2xlZnRBY2NlbnRDbGFzcywgY2FyZENsYXNzXVwiXG4gICAgKGNsaWNrKT1cIm9uQ2FyZENsaWNrKClcIj5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1nYXAtMlwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1zdGFydCBjcWEtanVzdGlmeS1iZXR3ZWVuIGNxYS1nYXAtMiBjcWEtZmxleC13cmFwXCI+XG4gICAgICAgIDwhLS0gVGl0bGUgLS0+XG4gICAgICAgIDxoMyBjbGFzcz1cImNxYS10ZXh0LVsxNHB4XSBjcWEtbGVhZGluZy1bMTdweF0gY3FhLWZvbnQtc2VtaWJvbGQgY3FhLXRleHQtWyMxQTFBMUFdXCI+e3sgdGl0bGUgfX08L2gzPlxuXG4gICAgICAgIDwhLS0gRmFpbHVyZXMgcGlsbCAtLT5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtcHgtWzExcHhdIGNxYS1weS1bM3B4XSBjcWEtcm91bmRlZC1mdWxsIGNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10cmFja2luZy1bMC4zcHhdXCJcbiAgICAgICAgICBbbmdDbGFzc109XCJwaWxsQ2xhc3NcIj5cbiAgICAgICAgICB7eyBmYWlsdXJlcyB8IG51bWJlciB9fSB7eyBmYWlsdXJlc0xhYmVsIH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvZGl2PlxuXG4gICAgICA8IS0tIFRhZ3MgLS0+XG4gICAgICA8ZGl2ICpuZ0lmPVwidGFncz8ubGVuZ3RoXCIgY2xhc3M9XCJjcWEtZmxleCBjcWEtZmxleC13cmFwIGNxYS1nYXAtMlwiPlxuICAgICAgICA8c3BhblxuICAgICAgICAgICpuZ0Zvcj1cImxldCB0YWcgb2YgdGFnc1wiXG4gICAgICAgICAgY2xhc3M9XCJjcWEtaW5saW5lLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTEgY3FhLWJvcmRlci1zb2xpZCBjcWEtcm91bmRlZC1mdWxsIGNxYS1iZy13aGl0ZSBjcWEtYm9yZGVyIGNxYS1ib3JkZXItWyNFNUU3RUJdIGNxYS10ZXh0LVsjMUYxRjI0XSBjcWEtdGV4dC1bMTFweF0gY3FhLWxlYWRpbmctWzE0cHhdIGNxYS1mb250LXNlbWlib2xkIGNxYS1weC1bMTBweF0gY3FhLXB5LVs0cHhdXCI+XG4gICAgICAgICAge3sgdGFnIH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWp1c3RpZnktYmV0d2VlbiBjcWEtZmxleC13cmFwIGNxYS1tdC0yXCI+XG4gICAgICA8IS0tIFJvb3QgY2F1c2UgLS0+XG4gICAgICA8ZGl2ICpuZ0lmPVwic2hvd1Jvb3RDYXVzZVwiIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1sZWFkaW5nLVsxNXB4XSBjcWEtdGV4dC1bI0YxNUY1Rl0gY3FhLWZsZXgtMSBjcWEtbWluLXctMCBjcWEtbXItMiBjcWEtdHJ1bmNhdGVcIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtZm9udC1zZW1pYm9sZFwiPnt7IHJvb3RDYXVzZUxhYmVsIH19OiA8L3NwYW4+e3sgcm9vdENhdXNlRGlzcGxheSB9fVxuICAgICAgPC9kaXY+XG5cbiAgICAgIDwhLS0gVGltZXN0YW1wIC0tPlxuICAgICAgPGRpdiAqbmdJZj1cImxhc3RGYWlsZWRcIlxuICAgICAgICBjbGFzcz1cImNxYS1weS1bM3B4XSBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMSBjcWEtdGV4dC1bMTBweF0gY3FhLWxlYWRpbmctWzE1cHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1kaWFsb2ctbXV0ZWRcIj5cbiAgICAgICAgPHN2ZyB3aWR0aD1cIjEyXCIgaGVpZ2h0PVwiMTJcIiB2aWV3Qm94PVwiMCAwIDEyIDEyXCIgZmlsbD1cIm5vbmVcIiB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+PHBhdGggZD1cIk02IDExQzguNzYxNDIgMTEgMTEgOC43NjE0MiAxMSA2QzExIDMuMjM4NTggOC43NjE0MiAxIDYgMUMzLjIzODU4IDEgMSAzLjIzODU4IDEgNkMxIDguNzYxNDIgMy4yMzg1OCAxMSA2IDExWlwiIHN0cm9rZT1cIiM2QjcyODBcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+PHBhdGggZD1cIk02IDNWNkw4IDdcIiBzdHJva2U9XCIjNkI3MjgwXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPjwvc3ZnPlxuICAgICAgICA8c3Bhbj57eyBsYXN0RmFpbGVkTGFiZWwgfX06IHt7IGxhc3RGYWlsZWQgfX08L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2Rhc2hib2FyZHMvZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC9mYWlsZWQtdGVzdC1jYXNlcy1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvZGFzaGJvYXJkcy9mYWlsZWQtdGVzdC1jYXNlcy1jYXJkL2ZhaWxlZC10ZXN0LWNhc2VzLWNhcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQVFoRyxNQUFNLE9BQU8sNEJBQTRCO0lBTnpDO1FBT0UsbUNBQW1DO1FBQzFCLFVBQUssR0FBVyxrQkFBa0IsQ0FBQztRQUM1QyxnREFBZ0Q7UUFDdkMsYUFBUSxHQUFXLENBQUMsQ0FBQztRQUM5QixvQ0FBb0M7UUFDM0Isa0JBQWEsR0FBVyxVQUFVLENBQUM7UUFDNUMsb0RBQW9EO1FBQzNDLGNBQVMsR0FBVyxxQ0FBcUMsQ0FBQztRQUduRSwrQ0FBK0M7UUFDdEMsbUJBQWMsR0FBVyxZQUFZLENBQUM7UUFDL0Msd0NBQXdDO1FBQy9CLGtCQUFhLEdBQVksSUFBSSxDQUFDO1FBR3ZDLDBCQUEwQjtRQUNqQixvQkFBZSxHQUFXLGFBQWEsQ0FBQztRQUNqRCw4Q0FBOEM7UUFDckMsY0FBUyxHQUFXLEVBQUUsQ0FBQztRQUNoQywrQkFBK0I7UUFDdEIsb0JBQWUsR0FBVyxvQkFBb0IsQ0FBQztRQUN4RCw4Q0FBOEM7UUFDckMsU0FBSSxHQUFhLEVBQUUsQ0FBQztRQUM3Qix1Q0FBdUM7UUFDN0IsY0FBUyxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7S0ErQ2hEO0lBN0NDLElBQUksZ0JBQWdCO1FBQ2xCLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsQ0FBQyxNQUFNLEVBQUU7WUFDcEQsT0FBTyx5QkFBeUIsQ0FBQztTQUNsQztRQUNELHNDQUFzQztRQUN0QyxPQUFPLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDL0IsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3hCLENBQUM7SUFFRCxXQUFXLENBQUMsS0FBWTtRQUN0QixLQUFLLENBQUMsZUFBZSxFQUFFLENBQUMsQ0FBQyxpQ0FBaUM7UUFFMUQsSUFBSSxTQUFTLENBQUMsU0FBUyxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDckMsU0FBUyxDQUFDLFNBQVMsQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFO2dCQUN0RCxPQUFPLENBQUMsS0FBSyxDQUFDLHVCQUF1QixFQUFFLEdBQUcsQ0FBQyxDQUFDO2dCQUM1Qyw4QkFBOEI7Z0JBQzlCLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDM0MsQ0FBQyxDQUFDLENBQUM7U0FDSjthQUFNO1lBQ0wsOENBQThDO1lBQzlDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDMUM7SUFDSCxDQUFDO0lBRU8sdUJBQXVCLENBQUMsSUFBWTtRQUMxQyxNQUFNLFFBQVEsR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQ3BELFFBQVEsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDO1FBQ3RCLFFBQVEsQ0FBQyxLQUFLLENBQUMsUUFBUSxHQUFHLE9BQU8sQ0FBQztRQUNsQyxRQUFRLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxXQUFXLENBQUM7UUFDbEMsUUFBUSxDQUFDLEtBQUssQ0FBQyxHQUFHLEdBQUcsV0FBVyxDQUFDO1FBQ2pDLFFBQVEsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBQ3BDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUNqQixRQUFRLENBQUMsTUFBTSxFQUFFLENBQUM7UUFFbEIsSUFBSTtZQUNGLFFBQVEsQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLENBQUM7U0FDOUI7UUFBQyxPQUFPLEdBQUcsRUFBRTtZQUNaLE9BQU8sQ0FBQyxLQUFLLENBQUMsdUJBQXVCLEVBQUUsR0FBRyxDQUFDLENBQUM7U0FDN0M7Z0JBQVM7WUFDUixRQUFRLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUNyQztJQUNILENBQUM7O3lIQXhFVSw0QkFBNEI7NkdBQTVCLDRCQUE0QixtYkNSekMsaW9HQW1ETTsyRkQzQ08sNEJBQTRCO2tCQU54QyxTQUFTOytCQUNFLDRCQUE0QixtQkFHckIsdUJBQXVCLENBQUMsTUFBTTs4QkFJdEMsS0FBSztzQkFBYixLQUFLO2dCQUVHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBRUcsYUFBYTtzQkFBckIsS0FBSztnQkFFRyxTQUFTO3NCQUFqQixLQUFLO2dCQUVHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBRUcsY0FBYztzQkFBdEIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUcsZUFBZTtzQkFBdkIsS0FBSztnQkFFRyxTQUFTO3NCQUFqQixLQUFLO2dCQUVHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBRUcsSUFBSTtzQkFBWixLQUFLO2dCQUVJLFNBQVM7c0JBQWxCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3FhLWZhaWxlZC10ZXN0LWNhc2VzLWNhcmQnLFxuICB0ZW1wbGF0ZVVybDogJy4vZmFpbGVkLXRlc3QtY2FzZXMtY2FyZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogW10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBGYWlsZWRUZXN0Q2FzZXNDYXJkQ29tcG9uZW50IHtcbiAgLyoqIEUuZy4sIFwiQy02MjogVXBsb2FkIENvbnRlbnRcIiAqL1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJ0ZhaWxlZCBUZXN0IENhc2UnO1xuICAvKiogTnVtYmVyIG9mIGZhaWx1cmVzIHRvIGRpc3BsYXkgaW4gdGhlIHBpbGwgKi9cbiAgQElucHV0KCkgZmFpbHVyZXM6IG51bWJlciA9IDA7XG4gIC8qKiBQaWxsIGxhYmVsIChlLmcuLCBcImZhaWx1cmVzXCIpICovXG4gIEBJbnB1dCgpIGZhaWx1cmVzTGFiZWw6IHN0cmluZyA9ICdmYWlsdXJlcyc7XG4gIC8qKiBPcHRpb25hbCBjdXN0b20gY2xhc3MgZm9yIHRoZSBwaWxsIGJhY2tncm91bmQgKi9cbiAgQElucHV0KCkgcGlsbENsYXNzOiBzdHJpbmcgPSAnY3FhLWJnLVsjRjE1RjVGXSBjcWEtdGV4dC1bI0ZBRkFGQV0nO1xuICAvKiogUm9vdCBjYXVzZSB0ZXh0OyB3aGVuIGVtcHR5LCBzaG93IGEgZGVmYXVsdCBtZXNzYWdlICovXG4gIEBJbnB1dCgpIHJvb3RDYXVzZT86IHN0cmluZztcbiAgLyoqIFJvb3QgY2F1c2UgbGFiZWwgKGxlZnQgcGFydCwgZW1waGFzaXplZCkgKi9cbiAgQElucHV0KCkgcm9vdENhdXNlTGFiZWw6IHN0cmluZyA9ICdSb290IGNhdXNlJztcbiAgLyoqIElmIGZhbHNlLCBoaWRlIHRoZSByb290IGNhdXNlIHJvdyAqL1xuICBASW5wdXQoKSBzaG93Um9vdENhdXNlOiBib29sZWFuID0gdHJ1ZTtcbiAgLyoqIExhc3QgZmFpbGVkIHRleHQgKGUuZy4sIFwiMiBob3VycyBhZ29cIikgKi9cbiAgQElucHV0KCkgbGFzdEZhaWxlZD86IHN0cmluZztcbiAgLyoqIExhYmVsIGZvciB0aW1lc3RhbXAgKi9cbiAgQElucHV0KCkgbGFzdEZhaWxlZExhYmVsOiBzdHJpbmcgPSAnTGFzdCBmYWlsZWQnO1xuICAvKiogT3B0aW9uYWwgZXh0cmEgY2xhc3MgZm9yIHRoZSBvdXRlciBjYXJkICovXG4gIEBJbnB1dCgpIGNhcmRDbGFzczogc3RyaW5nID0gJyc7XG4gIC8qKiBMZWZ0IGJvcmRlciBhY2NlbnQgY2xhc3MgKi9cbiAgQElucHV0KCkgbGVmdEFjY2VudENsYXNzOiBzdHJpbmcgPSAnY3FhLWJvcmRlci1sLVs0cHhdJztcbiAgLyoqIE9wdGlvbmFsIHRhZ3MgdG8gcmVuZGVyIHVuZGVyIHRoZSB0aXRsZSAqL1xuICBASW5wdXQoKSB0YWdzOiBzdHJpbmdbXSA9IFtdO1xuICAvKiogRW1pdHRlZCB3aGVuIHRoZSBjYXJkIGlzIGNsaWNrZWQgKi9cbiAgQE91dHB1dCgpIGNhcmRDbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICBnZXQgcm9vdENhdXNlRGlzcGxheSgpOiBzdHJpbmcge1xuICAgIGlmICghdGhpcy5yb290Q2F1c2UgfHwgIXRoaXMucm9vdENhdXNlLnRyaW0oKS5sZW5ndGgpIHtcbiAgICAgIHJldHVybiAnTm8gcm9vdCBjYXVzZSBhdmFpbGFibGUnO1xuICAgIH1cbiAgICAvLyBUcmltIGFuZCByZXR1cm4gdGhlIHJvb3QgY2F1c2UgdGV4dFxuICAgIHJldHVybiB0aGlzLnJvb3RDYXVzZS50cmltKCk7XG4gIH1cblxuICBvbkNhcmRDbGljaygpOiB2b2lkIHtcbiAgICB0aGlzLmNhcmRDbGljay5lbWl0KCk7XG4gIH1cblxuICBvbkNvcHlUaXRsZShldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTsgLy8gUHJldmVudCBjYXJkIGNsaWNrIGZyb20gZmlyaW5nXG4gICAgXG4gICAgaWYgKG5hdmlnYXRvci5jbGlwYm9hcmQgJiYgdGhpcy50aXRsZSkge1xuICAgICAgbmF2aWdhdG9yLmNsaXBib2FyZC53cml0ZVRleHQodGhpcy50aXRsZSkuY2F0Y2goKGVycikgPT4ge1xuICAgICAgICBjb25zb2xlLmVycm9yKCdGYWlsZWQgdG8gY29weSB0aXRsZTonLCBlcnIpO1xuICAgICAgICAvLyBGYWxsYmFjayBmb3Igb2xkZXIgYnJvd3NlcnNcbiAgICAgICAgdGhpcy5mYWxsYmFja0NvcHlUb0NsaXBib2FyZCh0aGlzLnRpdGxlKTtcbiAgICAgIH0pO1xuICAgIH0gZWxzZSB7XG4gICAgICAvLyBGYWxsYmFjayBmb3IgYnJvd3NlcnMgd2l0aG91dCBjbGlwYm9hcmQgQVBJXG4gICAgICB0aGlzLmZhbGxiYWNrQ29weVRvQ2xpcGJvYXJkKHRoaXMudGl0bGUpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgZmFsbGJhY2tDb3B5VG9DbGlwYm9hcmQodGV4dDogc3RyaW5nKTogdm9pZCB7XG4gICAgY29uc3QgdGV4dEFyZWEgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCd0ZXh0YXJlYScpO1xuICAgIHRleHRBcmVhLnZhbHVlID0gdGV4dDtcbiAgICB0ZXh0QXJlYS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG4gICAgdGV4dEFyZWEuc3R5bGUubGVmdCA9ICctOTk5OTk5cHgnO1xuICAgIHRleHRBcmVhLnN0eWxlLnRvcCA9ICctOTk5OTk5cHgnO1xuICAgIGRvY3VtZW50LmJvZHkuYXBwZW5kQ2hpbGQodGV4dEFyZWEpO1xuICAgIHRleHRBcmVhLmZvY3VzKCk7XG4gICAgdGV4dEFyZWEuc2VsZWN0KCk7XG4gICAgXG4gICAgdHJ5IHtcbiAgICAgIGRvY3VtZW50LmV4ZWNDb21tYW5kKCdjb3B5Jyk7XG4gICAgfSBjYXRjaCAoZXJyKSB7XG4gICAgICBjb25zb2xlLmVycm9yKCdGYWxsYmFjayBjb3B5IGZhaWxlZDonLCBlcnIpO1xuICAgIH0gZmluYWxseSB7XG4gICAgICBkb2N1bWVudC5ib2R5LnJlbW92ZUNoaWxkKHRleHRBcmVhKTtcbiAgICB9XG4gIH1cbn1cblxuXG4iLCI8ZGl2IGlkPVwiY3FhLXVpLXJvb3RcIj5cbiAgPGRpdiBjbGFzcz1cImNxYS13LWZ1bGwgY3FhLWJnLVsjRkVGMkYyNDBdIGNxYS1ib3JkZXIgY3FhLWJvcmRlci1zb2xpZCBjcWEtYm9yZGVyLVsjRTVFN0VCXSBjcWEtYm9yZGVyLWwtWyNFRjQ0NDRdIGNxYS1yb3VuZGVkLVsxMHB4XSBjcWEtcC1bMTBweF0gY3FhLXBsLVsyMHB4XSBjcWEtY3Vyc29yLXBvaW50ZXIgY3FhLXRyYW5zaXRpb24tc2hhZG93IGNxYS1kdXJhdGlvbi0yMDAgaG92ZXI6Y3FhLXNoYWRvdy1tZFwiXG4gICAgW25nQ2xhc3NdPVwiW2xlZnRBY2NlbnRDbGFzcywgY2FyZENsYXNzXVwiXG4gICAgKGNsaWNrKT1cIm9uQ2FyZENsaWNrKClcIj5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1nYXAtMlwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1zdGFydCBjcWEtanVzdGlmeS1iZXR3ZWVuIGNxYS1nYXAtMiBjcWEtZmxleC13cmFwXCI+XG4gICAgICAgIDwhLS0gVGl0bGUgd2l0aCBDb3B5IEJ1dHRvbiAtLT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0yIGNxYS1mbGV4LTEgY3FhLW1pbi13LTBcIj5cbiAgICAgICAgICA8aDMgY2xhc3M9XCJjcWEtdGV4dC1bMTRweF0gY3FhLWxlYWRpbmctWzE3cHhdIGNxYS1mb250LXNlbWlib2xkIGNxYS10ZXh0LVsjMUExQTFBXSBjcWEtdHJ1bmNhdGVcIj57eyB0aXRsZSB9fTwvaDM+XG4gICAgICAgICAgPGJ1dHRvblxuICAgICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgICBjbGFzcz1cImNxYS1pbmxpbmUtZmxleCBjcWEtY3Vyc29yLXBvaW50ZXIgY3FhLW91dGxpbmUtbm9uZSBjcWEtYmctdHJhbnNwYXJlbnQgY3FhLWJvcmRlci1ub25lIGNxYS1wLTEgY3FhLWl0ZW1zLWNlbnRlciBjcWEtanVzdGlmeS1jZW50ZXIgY3FhLW1pbi13LVsyMHB4XSBjcWEtbWluLWgtWzIwcHhdIGNxYS1mbGV4LXNocmluay0wIGNxYS10ZXh0LVsjNkI3MjgwXSBob3ZlcjpjcWEtdGV4dC1bIzFBMUExQV0gY3FhLXRyYW5zaXRpb24tY29sb3JzXCJcbiAgICAgICAgICAgIChjbGljayk9XCJvbkNvcHlUaXRsZSgkZXZlbnQpXCJcbiAgICAgICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiJ0NvcHkgdGl0bGUnXCJcbiAgICAgICAgICAgIHRpdGxlPVwiQ29weSB0aXRsZVwiXG4gICAgICAgICAgPlxuICAgICAgICAgICAgPG1hdC1pY29uIGNsYXNzPVwiY3FhLXctNCBjcWEtaC00IGNxYS10ZXh0LVsxNnB4XSBjcWEtbGVhZGluZy1bMTZweF1cIj5jb250ZW50X2NvcHk8L21hdC1pY29uPlxuICAgICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8IS0tIEZhaWx1cmVzIHBpbGwgLS0+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiY3FhLXB4LVsxMXB4XSBjcWEtcHktWzNweF0gY3FhLXJvdW5kZWQtZnVsbCBjcWEtdGV4dC1bMTJweF0gY3FhLWxlYWRpbmctWzE2cHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdHJhY2tpbmctWzAuM3B4XVwiXG4gICAgICAgICAgW25nQ2xhc3NdPVwicGlsbENsYXNzXCI+XG4gICAgICAgICAge3sgZmFpbHVyZXMgfCBudW1iZXIgfX0ge3sgZmFpbHVyZXNMYWJlbCB9fVxuICAgICAgICA8L3NwYW4+XG4gICAgICA8L2Rpdj5cblxuICAgICAgPCEtLSBUYWdzIC0tPlxuICAgICAgPGRpdiAqbmdJZj1cInRhZ3M/Lmxlbmd0aFwiIGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtd3JhcCBjcWEtZ2FwLTJcIj5cbiAgICAgICAgPHNwYW5cbiAgICAgICAgICAqbmdGb3I9XCJsZXQgdGFnIG9mIHRhZ3NcIlxuICAgICAgICAgIGNsYXNzPVwiY3FhLWlubGluZS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0xIGNxYS1ib3JkZXItc29saWQgY3FhLXJvdW5kZWQtZnVsbCBjcWEtYmctd2hpdGUgY3FhLWJvcmRlciBjcWEtYm9yZGVyLVsjRTVFN0VCXSBjcWEtdGV4dC1bIzFGMUYyNF0gY3FhLXRleHQtWzExcHhdIGNxYS1sZWFkaW5nLVsxNHB4XSBjcWEtZm9udC1zZW1pYm9sZCBjcWEtcHgtWzEwcHhdIGNxYS1weS1bNHB4XVwiPlxuICAgICAgICAgIHt7IHRhZyB9fVxuICAgICAgICA8L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuICAgIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWJldHdlZW4gY3FhLWZsZXgtd3JhcCBjcWEtbXQtMlwiPlxuICAgICAgPCEtLSBSb290IGNhdXNlIC0tPlxuICAgICAgPGRpdiAqbmdJZj1cInNob3dSb290Q2F1c2VcIiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTVweF0gY3FhLXRleHQtWyNGMTVGNUZdIGNxYS1mbGV4LTEgY3FhLW1pbi13LTAgY3FhLW1yLTIgY3FhLXRydW5jYXRlXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiY3FhLWZvbnQtc2VtaWJvbGRcIj57eyByb290Q2F1c2VMYWJlbCB9fTogPC9zcGFuPnt7IHJvb3RDYXVzZURpc3BsYXkgfX1cbiAgICAgIDwvZGl2PlxuXG4gICAgICA8IS0tIFRpbWVzdGFtcCAtLT5cbiAgICAgIDxkaXYgKm5nSWY9XCJsYXN0RmFpbGVkXCJcbiAgICAgICAgY2xhc3M9XCJjcWEtcHktWzNweF0gY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTEgY3FhLXRleHQtWzEwcHhdIGNxYS1sZWFkaW5nLVsxNXB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtZGlhbG9nLW11dGVkXCI+XG4gICAgICAgIDxzdmcgd2lkdGg9XCIxMlwiIGhlaWdodD1cIjEyXCIgdmlld0JveD1cIjAgMCAxMiAxMlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPjxwYXRoIGQ9XCJNNiAxMUM4Ljc2MTQyIDExIDExIDguNzYxNDIgMTEgNkMxMSAzLjIzODU4IDguNzYxNDIgMSA2IDFDMy4yMzg1OCAxIDEgMy4yMzg1OCAxIDZDMSA4Ljc2MTQyIDMuMjM4NTggMTEgNiAxMVpcIiBzdHJva2U9XCIjNkI3MjgwXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPjxwYXRoIGQ9XCJNNiAzVjZMOCA3XCIgc3Ryb2tlPVwiIzZCNzI4MFwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiLz48L3N2Zz5cbiAgICAgICAgPHNwYW4+e3sgbGFzdEZhaWxlZExhYmVsIH19OiB7eyBsYXN0RmFpbGVkIH19PC9zcGFuPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+Il19

package/esm2020/lib/selected-filters/selected-filters.component.mjs

@@ -5,20 +5,34 @@ export class SelectedFiltersComponent {
     constructor() {
         this.filterApplied = false;
         this.chips = [];
+        /** Optional defaults that cannot be removed by the user */
+        this.defaultChips = [];
+        /** Allows consumers to override styling for default chips */
+        this.defaultChipClass = 'cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]';
         this.removeChip = new EventEmitter();
         this.clearAll = new EventEmitter();
         this.onClearAll = new EventEmitter();
     }
+    get hasSelectedChips() {
+        return Array.isArray(this.chips) && this.chips.length > 0;
+    }
+    get hasAnyChips() {
+        return this.hasSelectedChips || (Array.isArray(this.defaultChips) && this.defaultChips.length > 0);
+    }
 }
 SelectedFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SelectedFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectedFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: { filterApplied: "filterApplied", chips: "chips" }, outputs: { removeChip: "removeChip", clearAll: "clearAll", onClearAll: "onClearAll" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && (chips?.length || 0)\">\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\" >\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SelectedFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: { filterApplied: "filterApplied", chips: "chips", defaultChips: "defaultChips", defaultChipClass: "defaultChipClass" }, outputs: { removeChip: "removeChip", clearAll: "clearAll", onClearAll: "onClearAll" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <!-- Hidden element to ensure Tailwind detects default chip classes -->\n  <div class=\"cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE] cqa-hidden\"></div>\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && hasAnyChips\">\n    <!-- Default (non-removable) chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-text-[#4B5563] cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]\"\n      [ngClass]=\"defaultChipClass\"\n      *ngFor=\"let chip of defaultChips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium\">{{ chip.label || chip.key }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n    </div>\n\n    <!-- User-selected chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      *ngIf=\"hasSelectedChips\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SelectedFiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-selected-filters', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && (chips?.length || 0)\">\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\" >\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", styles: [] }]
+            args: [{ selector: 'cqa-selected-filters', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <!-- Hidden element to ensure Tailwind detects default chip classes -->\n  <div class=\"cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE] cqa-hidden\"></div>\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && hasAnyChips\">\n    <!-- Default (non-removable) chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-text-[#4B5563] cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]\"\n      [ngClass]=\"defaultChipClass\"\n      *ngFor=\"let chip of defaultChips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium\">{{ chip.label || chip.key }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n    </div>\n\n    <!-- User-selected chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      *ngIf=\"hasSelectedChips\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", styles: [] }]
         }], propDecorators: { filterApplied: [{
                 type: Input
             }], chips: [{
                 type: Input
+            }], defaultChips: [{
+                type: Input
+            }], defaultChipClass: [{
+                type: Input
             }], removeChip: [{
                 type: Output
             }], clearAll: [{
@@ -26,4 +40,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
             }], onClearAll: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL3NlbGVjdGVkLWZpbHRlcnMvc2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL3NlbGVjdGVkLWZpbHRlcnMvc2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFnQmhHLE1BQU0sT0FBTyx3QkFBd0I7SUFOckM7UUFPVyxrQkFBYSxHQUFHLEtBQUssQ0FBQztRQUN0QixVQUFLLEdBQXlCLEVBQUUsQ0FBQztRQUVoQyxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQXNCLENBQUM7UUFDcEQsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7UUFDcEMsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7S0FDakQ7O3FIQVBZLHdCQUF3Qjt5R0FBeEIsd0JBQXdCLCtNQ2hCckMsZ2dEQTBCTTsyRkRWTyx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0Usc0JBQXNCLG1CQUdmLHVCQUF1QixDQUFDLE1BQU07OEJBR3RDLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUVJLFVBQVU7c0JBQW5CLE1BQU07Z0JBQ0csUUFBUTtzQkFBakIsTUFBTTtnQkFDRyxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgU2VsZWN0ZWRGaWx0ZXJDaGlwIHtcbiAga2V5Pzogc3RyaW5nO1xuICBsYWJlbD86IHN0cmluZztcbiAgdGV4dDogc3RyaW5nO1xuICBmdWxsVGV4dD86IHN0cmluZztcbiAgaGFzTW9yZT86IGJvb2xlYW47XG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NxYS1zZWxlY3RlZC1maWx0ZXJzJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3NlbGVjdGVkLWZpbHRlcnMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFtdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU2VsZWN0ZWRGaWx0ZXJzQ29tcG9uZW50IHtcbiAgQElucHV0KCkgZmlsdGVyQXBwbGllZCA9IGZhbHNlO1xuICBASW5wdXQoKSBjaGlwczogU2VsZWN0ZWRGaWx0ZXJDaGlwW10gPSBbXTtcblxuICBAT3V0cHV0KCkgcmVtb3ZlQ2hpcCA9IG5ldyBFdmVudEVtaXR0ZXI8U2VsZWN0ZWRGaWx0ZXJDaGlwPigpO1xuICBAT3V0cHV0KCkgY2xlYXJBbGwgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIEBPdXRwdXQoKSBvbkNsZWFyQWxsID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xufVxuXG5cbiIsIjxkaXYgaWQ9XCJjcWEtdWktcm9vdFwiPlxuICA8ZGl2IGNsYXNzPVwiY3FhLXctZnVsbCBjcWEtZmxleCBjcWEtZmxleC13cmFwIGNxYS1qdXN0aWZ5LWVuZCBjcWEtZ2FwLTIgY3FhLW1iLTNcIlxuICAgICpuZ0lmPVwiZmlsdGVyQXBwbGllZCAmJiAoY2hpcHM/Lmxlbmd0aCB8fCAwKVwiPlxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwiY3FhLWlubGluZS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0yIGNxYS1weC0yIGNxYS1weS0xIGNxYS1yb3VuZGVkLWZ1bGwgY3FhLWJvcmRlciBjcWEtYm9yZGVyLXN1Y2Nlc3MtMTAwIGNxYS1iZy1wcmltYXJ5LXN1cmZhY2VcIlxuICAgICAgKm5nRm9yPVwibGV0IGNoaXAgb2YgY2hpcHNcIiA+XG4gICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LXByaW1hcnlcIj57eyBjaGlwLmxhYmVsIHx8IGNoaXAua2V5XG4gICAgICAgIH19Ojwvc3Bhbj5cbiAgICAgIDxzcGFuIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1sZWFkaW5nLVsxNnB4XVwiPnt7IGNoaXAudGV4dCB9fTwvc3Bhbj5cbiAgICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiXG4gICAgICAgIGNsYXNzPVwiY3FhLW1sLTEgY3FhLWlubGluZS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWp1c3RpZnktY2VudGVyIGNxYS1yb3VuZGVkLWZ1bGwgY3FhLWJvcmRlciBjcWEtYm9yZGVyLXRyYW5zcGFyZW50IGhvdmVyOmNxYS1iZy1bI0VFRjJGRl1cIlxuICAgICAgICAoY2xpY2spPVwicmVtb3ZlQ2hpcC5lbWl0KGNoaXApXCIgYXJpYS1sYWJlbD1cIlJlbW92ZSBmaWx0ZXJcIj5cbiAgICAgICAgPHN2ZyB3aWR0aD1cIjE0XCIgaGVpZ2h0PVwiMTRcIiB2aWV3Qm94PVwiMCAwIDEyIDExXCIgZmlsbD1cIm5vbmVcIiB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgPHBhdGggZD1cIk04LjYyNSAyLjg3NUwzLjM3NSA4LjEyNVwiIHN0cm9rZT1cIiMzRjQzRUVcIiBzdHJva2Utd2lkdGg9XCIwLjg3NVwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIlxuICAgICAgICAgICAgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIiAvPlxuICAgICAgICAgIDxwYXRoIGQ9XCJNMy4zNzUgMi44NzVMOC42MjUgOC4xMjVcIiBzdHJva2U9XCIjM0Y0M0VFXCIgc3Ryb2tlLXdpZHRoPVwiMC44NzVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCJcbiAgICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgPC9zdmc+XG4gICAgICA8L2J1dHRvbj5cbiAgICA8L2Rpdj5cblxuICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1sZWFkaW5nLVsxNnB4XSBjcWEtdGV4dC1ncmV5LTMwMCBob3ZlcjpjcWEtdW5kZXJsaW5lXCJcbiAgICAgIChjbGljayk9XCJjbGVhckFsbC5lbWl0KCk7IG9uQ2xlYXJBbGwuZW1pdCgpXCI+XG4gICAgICBDbGVhciBBbGxcbiAgICA8L2J1dHRvbj5cbiAgPC9kaXY+XG48L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL3NlbGVjdGVkLWZpbHRlcnMvc2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL3NlbGVjdGVkLWZpbHRlcnMvc2VsZWN0ZWQtZmlsdGVycy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFnQmhHLE1BQU0sT0FBTyx3QkFBd0I7SUFOckM7UUFPVyxrQkFBYSxHQUFHLEtBQUssQ0FBQztRQUN0QixVQUFLLEdBQXlCLEVBQUUsQ0FBQztRQUMxQywyREFBMkQ7UUFDbEQsaUJBQVksR0FBeUIsRUFBRSxDQUFDO1FBQ2pELDZEQUE2RDtRQUNwRCxxQkFBZ0IsR0FBRyx1Q0FBdUMsQ0FBQztRQUUxRCxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQXNCLENBQUM7UUFDcEQsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7UUFDcEMsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7S0FTakQ7SUFQQyxJQUFJLGdCQUFnQjtRQUNsQixPQUFPLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQztJQUM1RCxDQUFDO0lBRUQsSUFBSSxXQUFXO1FBQ2IsT0FBTyxJQUFJLENBQUMsZ0JBQWdCLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQUMsQ0FBQztJQUNyRyxDQUFDOztxSEFsQlUsd0JBQXdCO3lHQUF4Qix3QkFBd0IsbVJDaEJyQyx3c0VBdUNNOzJGRHZCTyx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0Usc0JBQXNCLG1CQUdmLHVCQUF1QixDQUFDLE1BQU07OEJBR3RDLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUVHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBRUcsZ0JBQWdCO3NCQUF4QixLQUFLO2dCQUVJLFVBQVU7c0JBQW5CLE1BQU07Z0JBQ0csUUFBUTtzQkFBakIsTUFBTTtnQkFDRyxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgU2VsZWN0ZWRGaWx0ZXJDaGlwIHtcbiAga2V5Pzogc3RyaW5nO1xuICBsYWJlbD86IHN0cmluZztcbiAgdGV4dDogc3RyaW5nO1xuICBmdWxsVGV4dD86IHN0cmluZztcbiAgaGFzTW9yZT86IGJvb2xlYW47XG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NxYS1zZWxlY3RlZC1maWx0ZXJzJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3NlbGVjdGVkLWZpbHRlcnMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFtdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU2VsZWN0ZWRGaWx0ZXJzQ29tcG9uZW50IHtcbiAgQElucHV0KCkgZmlsdGVyQXBwbGllZCA9IGZhbHNlO1xuICBASW5wdXQoKSBjaGlwczogU2VsZWN0ZWRGaWx0ZXJDaGlwW10gPSBbXTtcbiAgLyoqIE9wdGlvbmFsIGRlZmF1bHRzIHRoYXQgY2Fubm90IGJlIHJlbW92ZWQgYnkgdGhlIHVzZXIgKi9cbiAgQElucHV0KCkgZGVmYXVsdENoaXBzOiBTZWxlY3RlZEZpbHRlckNoaXBbXSA9IFtdO1xuICAvKiogQWxsb3dzIGNvbnN1bWVycyB0byBvdmVycmlkZSBzdHlsaW5nIGZvciBkZWZhdWx0IGNoaXBzICovXG4gIEBJbnB1dCgpIGRlZmF1bHRDaGlwQ2xhc3MgPSAnY3FhLWJvcmRlci1bI0NCRDVGNV0gY3FhLWJnLVsjRjRGNkZFXSc7XG5cbiAgQE91dHB1dCgpIHJlbW92ZUNoaXAgPSBuZXcgRXZlbnRFbWl0dGVyPFNlbGVjdGVkRmlsdGVyQ2hpcD4oKTtcbiAgQE91dHB1dCgpIGNsZWFyQWxsID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuICBAT3V0cHV0KCkgb25DbGVhckFsbCA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICBnZXQgaGFzU2VsZWN0ZWRDaGlwcygpOiBib29sZWFuIHtcbiAgICByZXR1cm4gQXJyYXkuaXNBcnJheSh0aGlzLmNoaXBzKSAmJiB0aGlzLmNoaXBzLmxlbmd0aCA+IDA7XG4gIH1cblxuICBnZXQgaGFzQW55Q2hpcHMoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuaGFzU2VsZWN0ZWRDaGlwcyB8fCAoQXJyYXkuaXNBcnJheSh0aGlzLmRlZmF1bHRDaGlwcykgJiYgdGhpcy5kZWZhdWx0Q2hpcHMubGVuZ3RoID4gMCk7XG4gIH1cbn1cblxuXG4iLCI8ZGl2IGlkPVwiY3FhLXVpLXJvb3RcIj5cbiAgPCEtLSBIaWRkZW4gZWxlbWVudCB0byBlbnN1cmUgVGFpbHdpbmQgZGV0ZWN0cyBkZWZhdWx0IGNoaXAgY2xhc3NlcyAtLT5cbiAgPGRpdiBjbGFzcz1cImNxYS1ib3JkZXItWyNDQkQ1RjVdIGNxYS1iZy1bI0Y0RjZGRV0gY3FhLWhpZGRlblwiPjwvZGl2PlxuICA8ZGl2IGNsYXNzPVwiY3FhLXctZnVsbCBjcWEtZmxleCBjcWEtZmxleC13cmFwIGNxYS1qdXN0aWZ5LWVuZCBjcWEtZ2FwLTIgY3FhLW1iLTNcIlxuICAgICpuZ0lmPVwiZmlsdGVyQXBwbGllZCAmJiBoYXNBbnlDaGlwc1wiPlxuICAgIDwhLS0gRGVmYXVsdCAobm9uLXJlbW92YWJsZSkgY2hpcHMgLS0+XG4gICAgPGRpdlxuICAgICAgY2xhc3M9XCJjcWEtaW5saW5lLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTIgY3FhLXB4LTIgY3FhLXB5LTEgY3FhLXJvdW5kZWQtZnVsbCBjcWEtYm9yZGVyIGNxYS10ZXh0LVsjNEI1NTYzXSBjcWEtYm9yZGVyLVsjQ0JENUY1XSBjcWEtYmctWyNGNEY2RkVdXCJcbiAgICAgIFtuZ0NsYXNzXT1cImRlZmF1bHRDaGlwQ2xhc3NcIlxuICAgICAgKm5nRm9yPVwibGV0IGNoaXAgb2YgZGVmYXVsdENoaXBzXCI+XG4gICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLWZvbnQtbWVkaXVtXCI+e3sgY2hpcC5sYWJlbCB8fCBjaGlwLmtleSB9fTo8L3NwYW4+XG4gICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF1cIj57eyBjaGlwLnRleHQgfX08L3NwYW4+XG4gICAgPC9kaXY+XG5cbiAgICA8IS0tIFVzZXItc2VsZWN0ZWQgY2hpcHMgLS0+XG4gICAgPGRpdlxuICAgICAgY2xhc3M9XCJjcWEtaW5saW5lLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTIgY3FhLXB4LTIgY3FhLXB5LTEgY3FhLXJvdW5kZWQtZnVsbCBjcWEtYm9yZGVyIGNxYS1ib3JkZXItc3VjY2Vzcy0xMDAgY3FhLWJnLXByaW1hcnktc3VyZmFjZVwiXG4gICAgICAqbmdGb3I9XCJsZXQgY2hpcCBvZiBjaGlwc1wiPlxuICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTJweF0gY3FhLWxlYWRpbmctWzE2cHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1wcmltYXJ5XCI+e3sgY2hpcC5sYWJlbCB8fCBjaGlwLmtleVxuICAgICAgICB9fTo8L3NwYW4+XG4gICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF1cIj57eyBjaGlwLnRleHQgfX08L3NwYW4+XG4gICAgICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIlxuICAgICAgICBjbGFzcz1cImNxYS1tbC0xIGNxYS1pbmxpbmUtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWNlbnRlciBjcWEtcm91bmRlZC1mdWxsIGNxYS1ib3JkZXIgY3FhLWJvcmRlci10cmFuc3BhcmVudCBob3ZlcjpjcWEtYmctWyNFRUYyRkZdXCJcbiAgICAgICAgKGNsaWNrKT1cInJlbW92ZUNoaXAuZW1pdChjaGlwKVwiIGFyaWEtbGFiZWw9XCJSZW1vdmUgZmlsdGVyXCI+XG4gICAgICAgIDxzdmcgd2lkdGg9XCIxNFwiIGhlaWdodD1cIjE0XCIgdmlld0JveD1cIjAgMCAxMiAxMVwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgICAgIDxwYXRoIGQ9XCJNOC42MjUgMi44NzVMMy4zNzUgOC4xMjVcIiBzdHJva2U9XCIjM0Y0M0VFXCIgc3Ryb2tlLXdpZHRoPVwiMC44NzVcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCJcbiAgICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIgLz5cbiAgICAgICAgICA8cGF0aCBkPVwiTTMuMzc1IDIuODc1TDguNjI1IDguMTI1XCIgc3Ryb2tlPVwiIzNGNDNFRVwiIHN0cm9rZS13aWR0aD1cIjAuODc1XCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiXG4gICAgICAgICAgICBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiIC8+XG4gICAgICAgIDwvc3ZnPlxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG5cbiAgICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIiBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtbGVhZGluZy1bMTZweF0gY3FhLXRleHQtZ3JleS0zMDAgaG92ZXI6Y3FhLXVuZGVybGluZVwiXG4gICAgICAqbmdJZj1cImhhc1NlbGVjdGVkQ2hpcHNcIlxuICAgICAgKGNsaWNrKT1cImNsZWFyQWxsLmVtaXQoKTsgb25DbGVhckFsbC5lbWl0KClcIj5cbiAgICAgIENsZWFyIEFsbFxuICAgIDwvYnV0dG9uPlxuICA8L2Rpdj5cbjwvZGl2PiJdfQ==

package/esm2020/lib/templates/table-template.component.mjs

@@ -341,7 +341,7 @@ export class TableTemplateComponent {
     }
 }
 TableTemplateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TableTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableTemplateComponent, selector: "cqa-table-template", inputs: { searchPlaceholder: "searchPlaceholder", searchValue: "searchValue", showClear: "showClear", showSearchBar: "showSearchBar", filterConfig: "filterConfig", showFilterPanel: "showFilterPanel", showFilterButton: "showFilterButton", otherButtonLabel: "otherButtonLabel", otherButtonVariant: "otherButtonVariant", showOtherButton: "showOtherButton", showActionButton: "showActionButton", showSettingsButton: "showSettingsButton", showAutoRefreshButton: "showAutoRefreshButton", data: "data", isEmptyState: "isEmptyState", emptyStateConfig: "emptyStateConfig", actions: "actions", chips: "chips", filterApplied: "filterApplied", columns: "columns", selectedAutoRefreshInterval: "selectedAutoRefreshInterval", pageIndex: "pageIndex", pageSize: "pageSize", isTableLoading: "isTableLoading", isTableDataLoading: "isTableDataLoading" }, outputs: { onSearchChange: "onSearchChange", onApplyFilterClick: "onApplyFilterClick", onResetFilterClick: "onResetFilterClick", onClearAll: "onClearAll", onReload: "onReload", onAutoRefreshClick: "onAutoRefreshClick" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", components: [{ type: i1.SearchBarComponent, selector: "cqa-search-bar", inputs: ["placeholder", "value", "disabled", "showClear", "ariaLabel", "autoFocus", "size", "fullWidth"], outputs: ["valueChange", "search", "cleared"] }, { type: i2.ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }, { type: i3.ColumnVisibilityComponent, selector: "cqa-column-visibility", inputs: ["isStepGroup", "columns", "columnVisibility", "selectedAutoRefreshInterval"], outputs: ["columnVisibilityChange", "autoRefreshChange"] }, { type: i4.SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: ["filterApplied", "chips"], outputs: ["removeChip", "clearAll", "onClearAll"] }, { type: i5.DynamicFilterComponent, selector: "cqa-dynamic-filter", inputs: ["config", "model", "showFilterPanel", "buttonLayout"], outputs: ["filtersApplied", "filtersChanged", "resetAction", "onApplyFilterClick", "onResetFilterClick"] }, { type: i6.DynamicTableComponent, selector: "app-dynamic-table", inputs: ["data", "columns", "emptyState", "gridTemplateColumns", "screenWidth", "enableSelectAll", "enableLocalSort", "isTableLoading", "isTableDataLoading"], outputs: ["sortChange"] }, { type: i7.EmptyStateComponent, selector: "cqa-empty-state", inputs: ["preset", "imageUrl", "title", "description", "actions"], outputs: ["actionClick"] }, { type: i8.PaginationComponent, selector: "cqa-pagination", inputs: ["totalElements", "totalPages", "pageIndex", "pageSize", "pageItemCount", "pageSizeOptions"], outputs: ["pageIndexChange", "pageSizeChange", "paginate"] }, { type: i9.TableActionToolbarComponent, selector: "cqa-table-action-toolbar", inputs: ["selectedItems", "actions"], outputs: ["actionClick"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TableTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableTemplateComponent, selector: "cqa-table-template", inputs: { searchPlaceholder: "searchPlaceholder", searchValue: "searchValue", showClear: "showClear", showSearchBar: "showSearchBar", filterConfig: "filterConfig", showFilterPanel: "showFilterPanel", showFilterButton: "showFilterButton", otherButtonLabel: "otherButtonLabel", otherButtonVariant: "otherButtonVariant", showOtherButton: "showOtherButton", showActionButton: "showActionButton", showSettingsButton: "showSettingsButton", showAutoRefreshButton: "showAutoRefreshButton", data: "data", isEmptyState: "isEmptyState", emptyStateConfig: "emptyStateConfig", actions: "actions", chips: "chips", filterApplied: "filterApplied", columns: "columns", selectedAutoRefreshInterval: "selectedAutoRefreshInterval", pageIndex: "pageIndex", pageSize: "pageSize", isTableLoading: "isTableLoading", isTableDataLoading: "isTableDataLoading" }, outputs: { onSearchChange: "onSearchChange", onApplyFilterClick: "onApplyFilterClick", onResetFilterClick: "onResetFilterClick", onClearAll: "onClearAll", onReload: "onReload", onAutoRefreshClick: "onAutoRefreshClick" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", components: [{ type: i1.SearchBarComponent, selector: "cqa-search-bar", inputs: ["placeholder", "value", "disabled", "showClear", "ariaLabel", "autoFocus", "size", "fullWidth"], outputs: ["valueChange", "search", "cleared"] }, { type: i2.ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }, { type: i3.ColumnVisibilityComponent, selector: "cqa-column-visibility", inputs: ["isStepGroup", "columns", "columnVisibility", "selectedAutoRefreshInterval"], outputs: ["columnVisibilityChange", "autoRefreshChange"] }, { type: i4.SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: ["filterApplied", "chips", "defaultChips", "defaultChipClass"], outputs: ["removeChip", "clearAll", "onClearAll"] }, { type: i5.DynamicFilterComponent, selector: "cqa-dynamic-filter", inputs: ["config", "model", "showFilterPanel", "buttonLayout"], outputs: ["filtersApplied", "filtersChanged", "resetAction", "onApplyFilterClick", "onResetFilterClick"] }, { type: i6.DynamicTableComponent, selector: "app-dynamic-table", inputs: ["data", "columns", "emptyState", "gridTemplateColumns", "screenWidth", "enableSelectAll", "enableLocalSort", "isTableLoading", "isTableDataLoading"], outputs: ["sortChange"] }, { type: i7.EmptyStateComponent, selector: "cqa-empty-state", inputs: ["preset", "imageUrl", "title", "description", "actions"], outputs: ["actionClick"] }, { type: i8.PaginationComponent, selector: "cqa-pagination", inputs: ["totalElements", "totalPages", "pageIndex", "pageSize", "pageItemCount", "pageSizeOptions"], outputs: ["pageIndexChange", "pageSizeChange", "paginate"] }, { type: i9.TableActionToolbarComponent, selector: "cqa-table-action-toolbar", inputs: ["selectedItems", "actions"], outputs: ["actionClick"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableTemplateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cqa-table-template', template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", styles: [] }]

package/fesm2015/cqa-lib-cqa-ui.mjs

@@ -2690,12 +2690,45 @@ class FailedTestCasesCardComponent {
     onCardClick() {
         this.cardClick.emit();
     }
+    onCopyTitle(event) {
+        event.stopPropagation(); // Prevent card click from firing
+        if (navigator.clipboard && this.title) {
+            navigator.clipboard.writeText(this.title).catch((err) => {
+                console.error('Failed to copy title:', err);
+                // Fallback for older browsers
+                this.fallbackCopyToClipboard(this.title);
+            });
+        }
+        else {
+            // Fallback for browsers without clipboard API
+            this.fallbackCopyToClipboard(this.title);
+        }
+    }
+    fallbackCopyToClipboard(text) {
+        const textArea = document.createElement('textarea');
+        textArea.value = text;
+        textArea.style.position = 'fixed';
+        textArea.style.left = '-999999px';
+        textArea.style.top = '-999999px';
+        document.body.appendChild(textArea);
+        textArea.focus();
+        textArea.select();
+        try {
+            document.execCommand('copy');
+        }
+        catch (err) {
+            console.error('Fallback copy failed:', err);
+        }
+        finally {
+            document.body.removeChild(textArea);
+        }
+    }
 }
 FailedTestCasesCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass", tags: "tags" }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title -->\n        <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "number": i2.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass", tags: "tags" }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title with Copy Button -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-1 cqa-min-w-0\">\n          <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A] cqa-truncate\">{{ title }}</h3>\n          <button\n            type=\"button\"\n            class=\"cqa-inline-flex cqa-cursor-pointer cqa-outline-none cqa-bg-transparent cqa-border-none cqa-p-1 cqa-items-center cqa-justify-center cqa-min-w-[20px] cqa-min-h-[20px] cqa-flex-shrink-0 cqa-text-[#6B7280] hover:cqa-text-[#1A1A1A] cqa-transition-colors\"\n            (click)=\"onCopyTitle($event)\"\n            [attr.aria-label]=\"'Copy title'\"\n            title=\"Copy title\"\n          >\n            <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">content_copy</mat-icon>\n          </button>\n        </div>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "number": i2.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title -->\n        <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", styles: [] }]
+            args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-border-l-[#EF4444] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px] cqa-cursor-pointer cqa-transition-shadow cqa-duration-200 hover:cqa-shadow-md\"\n    [ngClass]=\"[leftAccentClass, cardClass]\"\n    (click)=\"onCardClick()\">\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n      <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n        <!-- Title with Copy Button -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-1 cqa-min-w-0\">\n          <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A] cqa-truncate\">{{ title }}</h3>\n          <button\n            type=\"button\"\n            class=\"cqa-inline-flex cqa-cursor-pointer cqa-outline-none cqa-bg-transparent cqa-border-none cqa-p-1 cqa-items-center cqa-justify-center cqa-min-w-[20px] cqa-min-h-[20px] cqa-flex-shrink-0 cqa-text-[#6B7280] hover:cqa-text-[#1A1A1A] cqa-transition-colors\"\n            (click)=\"onCopyTitle($event)\"\n            [attr.aria-label]=\"'Copy title'\"\n            title=\"Copy title\"\n          >\n            <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">content_copy</mat-icon>\n          </button>\n        </div>\n\n        <!-- Failures pill -->\n        <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n          [ngClass]=\"pillClass\">\n          {{ failures | number }} {{ failuresLabel }}\n        </span>\n      </div>\n\n      <!-- Tags -->\n      <div *ngIf=\"tags?.length\" class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n        <span\n          *ngFor=\"let tag of tags\"\n          class=\"cqa-inline-flex cqa-items-center cqa-gap-1 cqa-border-solid cqa-rounded-full cqa-bg-white cqa-border cqa-border-[#E5E7EB] cqa-text-[#1F1F24] cqa-text-[11px] cqa-leading-[14px] cqa-font-semibold cqa-px-[10px] cqa-py-[4px]\">\n          {{ tag }}\n        </span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n      <!-- Root cause -->\n      <div *ngIf=\"showRootCause\" class=\"cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F] cqa-flex-1 cqa-min-w-0 cqa-mr-2 cqa-truncate\">\n        <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n      </div>\n\n      <!-- Timestamp -->\n      <div *ngIf=\"lastFailed\"\n        class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n        <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n      </div>\n    </div>\n  </div>\n</div>", styles: [] }]
         }], propDecorators: { title: [{
                 type: Input
             }], failures: [{
@@ -2728,20 +2761,34 @@ class SelectedFiltersComponent {
     constructor() {
         this.filterApplied = false;
         this.chips = [];
+        /** Optional defaults that cannot be removed by the user */
+        this.defaultChips = [];
+        /** Allows consumers to override styling for default chips */
+        this.defaultChipClass = 'cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]';
         this.removeChip = new EventEmitter();
         this.clearAll = new EventEmitter();
         this.onClearAll = new EventEmitter();
     }
+    get hasSelectedChips() {
+        return Array.isArray(this.chips) && this.chips.length > 0;
+    }
+    get hasAnyChips() {
+        return this.hasSelectedChips || (Array.isArray(this.defaultChips) && this.defaultChips.length > 0);
+    }
 }
 SelectedFiltersComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SelectedFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectedFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: { filterApplied: "filterApplied", chips: "chips" }, outputs: { removeChip: "removeChip", clearAll: "clearAll", onClearAll: "onClearAll" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && (chips?.length || 0)\">\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\" >\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SelectedFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: { filterApplied: "filterApplied", chips: "chips", defaultChips: "defaultChips", defaultChipClass: "defaultChipClass" }, outputs: { removeChip: "removeChip", clearAll: "clearAll", onClearAll: "onClearAll" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <!-- Hidden element to ensure Tailwind detects default chip classes -->\n  <div class=\"cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE] cqa-hidden\"></div>\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && hasAnyChips\">\n    <!-- Default (non-removable) chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-text-[#4B5563] cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]\"\n      [ngClass]=\"defaultChipClass\"\n      *ngFor=\"let chip of defaultChips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium\">{{ chip.label || chip.key }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n    </div>\n\n    <!-- User-selected chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      *ngIf=\"hasSelectedChips\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SelectedFiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-selected-filters', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && (chips?.length || 0)\">\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\" >\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", styles: [] }]
+            args: [{ selector: 'cqa-selected-filters', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n  <!-- Hidden element to ensure Tailwind detects default chip classes -->\n  <div class=\"cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE] cqa-hidden\"></div>\n  <div class=\"cqa-w-full cqa-flex cqa-flex-wrap cqa-justify-end cqa-gap-2 cqa-mb-3\"\n    *ngIf=\"filterApplied && hasAnyChips\">\n    <!-- Default (non-removable) chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-text-[#4B5563] cqa-border-[#CBD5F5] cqa-bg-[#F4F6FE]\"\n      [ngClass]=\"defaultChipClass\"\n      *ngFor=\"let chip of defaultChips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium\">{{ chip.label || chip.key }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n    </div>\n\n    <!-- User-selected chips -->\n    <div\n      class=\"cqa-inline-flex cqa-items-center cqa-gap-2 cqa-px-2 cqa-py-1 cqa-rounded-full cqa-border cqa-border-success-100 cqa-bg-primary-surface\"\n      *ngFor=\"let chip of chips\">\n      <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-text-primary\">{{ chip.label || chip.key\n        }}:</span>\n      <span class=\"cqa-text-[12px] cqa-leading-[16px]\">{{ chip.text }}</span>\n      <button type=\"button\"\n        class=\"cqa-ml-1 cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-full cqa-border cqa-border-transparent hover:cqa-bg-[#EEF2FF]\"\n        (click)=\"removeChip.emit(chip)\" aria-label=\"Remove filter\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 12 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8.625 2.875L3.375 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n          <path d=\"M3.375 2.875L8.625 8.125\" stroke=\"#3F43EE\" stroke-width=\"0.875\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </button>\n    </div>\n\n    <button type=\"button\" class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-grey-300 hover:cqa-underline\"\n      *ngIf=\"hasSelectedChips\"\n      (click)=\"clearAll.emit(); onClearAll.emit()\">\n      Clear All\n    </button>\n  </div>\n</div>", styles: [] }]
         }], propDecorators: { filterApplied: [{
                 type: Input
             }], chips: [{
                 type: Input
+            }], defaultChips: [{
+                type: Input
+            }], defaultChipClass: [{
+                type: Input
             }], removeChip: [{
                 type: Output
             }], clearAll: [{
@@ -3943,7 +3990,7 @@ class TableTemplateComponent {
     }
 }
 TableTemplateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TableTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableTemplateComponent, selector: "cqa-table-template", inputs: { searchPlaceholder: "searchPlaceholder", searchValue: "searchValue", showClear: "showClear", showSearchBar: "showSearchBar", filterConfig: "filterConfig", showFilterPanel: "showFilterPanel", showFilterButton: "showFilterButton", otherButtonLabel: "otherButtonLabel", otherButtonVariant: "otherButtonVariant", showOtherButton: "showOtherButton", showActionButton: "showActionButton", showSettingsButton: "showSettingsButton", showAutoRefreshButton: "showAutoRefreshButton", data: "data", isEmptyState: "isEmptyState", emptyStateConfig: "emptyStateConfig", actions: "actions", chips: "chips", filterApplied: "filterApplied", columns: "columns", selectedAutoRefreshInterval: "selectedAutoRefreshInterval", pageIndex: "pageIndex", pageSize: "pageSize", isTableLoading: "isTableLoading", isTableDataLoading: "isTableDataLoading" }, outputs: { onSearchChange: "onSearchChange", onApplyFilterClick: "onApplyFilterClick", onResetFilterClick: "onResetFilterClick", onClearAll: "onClearAll", onReload: "onReload", onAutoRefreshClick: "onAutoRefreshClick" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", components: [{ type: SearchBarComponent, selector: "cqa-search-bar", inputs: ["placeholder", "value", "disabled", "showClear", "ariaLabel", "autoFocus", "size", "fullWidth"], outputs: ["valueChange", "search", "cleared"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }, { type: ColumnVisibilityComponent, selector: "cqa-column-visibility", inputs: ["isStepGroup", "columns", "columnVisibility", "selectedAutoRefreshInterval"], outputs: ["columnVisibilityChange", "autoRefreshChange"] }, { type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: ["filterApplied", "chips"], outputs: ["removeChip", "clearAll", "onClearAll"] }, { type: DynamicFilterComponent, selector: "cqa-dynamic-filter", inputs: ["config", "model", "showFilterPanel", "buttonLayout"], outputs: ["filtersApplied", "filtersChanged", "resetAction", "onApplyFilterClick", "onResetFilterClick"] }, { type: DynamicTableComponent, selector: "app-dynamic-table", inputs: ["data", "columns", "emptyState", "gridTemplateColumns", "screenWidth", "enableSelectAll", "enableLocalSort", "isTableLoading", "isTableDataLoading"], outputs: ["sortChange"] }, { type: EmptyStateComponent, selector: "cqa-empty-state", inputs: ["preset", "imageUrl", "title", "description", "actions"], outputs: ["actionClick"] }, { type: PaginationComponent, selector: "cqa-pagination", inputs: ["totalElements", "totalPages", "pageIndex", "pageSize", "pageItemCount", "pageSizeOptions"], outputs: ["pageIndexChange", "pageSizeChange", "paginate"] }, { type: TableActionToolbarComponent, selector: "cqa-table-action-toolbar", inputs: ["selectedItems", "actions"], outputs: ["actionClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TableTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableTemplateComponent, selector: "cqa-table-template", inputs: { searchPlaceholder: "searchPlaceholder", searchValue: "searchValue", showClear: "showClear", showSearchBar: "showSearchBar", filterConfig: "filterConfig", showFilterPanel: "showFilterPanel", showFilterButton: "showFilterButton", otherButtonLabel: "otherButtonLabel", otherButtonVariant: "otherButtonVariant", showOtherButton: "showOtherButton", showActionButton: "showActionButton", showSettingsButton: "showSettingsButton", showAutoRefreshButton: "showAutoRefreshButton", data: "data", isEmptyState: "isEmptyState", emptyStateConfig: "emptyStateConfig", actions: "actions", chips: "chips", filterApplied: "filterApplied", columns: "columns", selectedAutoRefreshInterval: "selectedAutoRefreshInterval", pageIndex: "pageIndex", pageSize: "pageSize", isTableLoading: "isTableLoading", isTableDataLoading: "isTableDataLoading" }, outputs: { onSearchChange: "onSearchChange", onApplyFilterClick: "onApplyFilterClick", onResetFilterClick: "onResetFilterClick", onClearAll: "onClearAll", onReload: "onReload", onAutoRefreshClick: "onAutoRefreshClick" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", components: [{ type: SearchBarComponent, selector: "cqa-search-bar", inputs: ["placeholder", "value", "disabled", "showClear", "ariaLabel", "autoFocus", "size", "fullWidth"], outputs: ["valueChange", "search", "cleared"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }, { type: ColumnVisibilityComponent, selector: "cqa-column-visibility", inputs: ["isStepGroup", "columns", "columnVisibility", "selectedAutoRefreshInterval"], outputs: ["columnVisibilityChange", "autoRefreshChange"] }, { type: SelectedFiltersComponent, selector: "cqa-selected-filters", inputs: ["filterApplied", "chips", "defaultChips", "defaultChipClass"], outputs: ["removeChip", "clearAll", "onClearAll"] }, { type: DynamicFilterComponent, selector: "cqa-dynamic-filter", inputs: ["config", "model", "showFilterPanel", "buttonLayout"], outputs: ["filtersApplied", "filtersChanged", "resetAction", "onApplyFilterClick", "onResetFilterClick"] }, { type: DynamicTableComponent, selector: "app-dynamic-table", inputs: ["data", "columns", "emptyState", "gridTemplateColumns", "screenWidth", "enableSelectAll", "enableLocalSort", "isTableLoading", "isTableDataLoading"], outputs: ["sortChange"] }, { type: EmptyStateComponent, selector: "cqa-empty-state", inputs: ["preset", "imageUrl", "title", "description", "actions"], outputs: ["actionClick"] }, { type: PaginationComponent, selector: "cqa-pagination", inputs: ["totalElements", "totalPages", "pageIndex", "pageSize", "pageItemCount", "pageSizeOptions"], outputs: ["pageIndexChange", "pageSizeChange", "paginate"] }, { type: TableActionToolbarComponent, selector: "cqa-table-action-toolbar", inputs: ["selectedItems", "actions"], outputs: ["actionClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableTemplateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cqa-table-template', template: "<div id=\"cqa-ui-root\">\n  <div class=\"cqa-w-full cqa-flex cqa-flex-col cqa-relative\">\n    <div class=\"cqa-w-full cqa-flex cqa-items-center cqa-justify-between cqa-gap-3 cqa-flex-wrap cqa-mb-3\">\n      <cqa-search-bar\n        *ngIf=\"showSearchBar\"\n        [placeholder]=\"searchPlaceholder\"\n        [value]=\"searchValue\"\n        [showClear]=\"showClear\"\n        (valueChange)=\"valueChange($event)\"\n        (search)=\"search($event)\"\n        (cleared)=\"cleared()\"\n      ></cqa-search-bar>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-flex-wrap\">\n        <cqa-button\n          *ngIf=\"showFilterButton\"\n          variant=\"grey-solid\"\n          icon=\"add\"\n          [text]=\"'Filter'\"\n          (clicked)=\"toggleFilter()\"\n        >\n          <span>Filter</span>\n        </cqa-button>\n        <cqa-column-visibility\n          *ngIf=\"showSettingsButton\"\n          [columns]=\"visibilityColumns\"\n          [columnVisibility]=\"columnVisibility\"\n          [selectedAutoRefreshInterval]=\"selectedAutoRefreshInterval\"\n          (columnVisibilityChange)=\"onColumnVisibilityChange($event)\"\n          (autoRefreshChange)=\"onAutoRefreshChange($event)\"\n        ></cqa-column-visibility>\n        <cqa-button *ngIf=\"showAutoRefreshButton\" variant=\"grey-solid\" icon=\"refresh\" (clicked)=\"handleRefreshClick()\"></cqa-button>\n        <cqa-button *ngIf=\"showOtherButton\" [variant]=\"otherButtonVariant\" [text]=\"otherButtonLabel\"></cqa-button>\n      </div>\n    </div>\n\n    <cqa-selected-filters \n      *ngIf=\"showFilterPanel\"\n      [filterApplied]=\"filterApplied\"\n      [chips]=\"chips\"\n      (removeChip)=\"onRemoveChip($event)\"\n      (clearAll)=\"onClearAllChips()\"\n      (onClearAll)=\"onClearAll.emit()\"\n    >\n    </cqa-selected-filters>\n\n    <cqa-dynamic-filter\n      *ngIf=\"showFilterPanel\"\n      [config]=\"filterConfig\"\n      [showFilterPanel]=\"showFilterPanel\"\n      (filtersChanged)=\"onFiltersChanged($event)\"\n      (filtersApplied)=\"onFiltersApplied($event)\"\n      (onApplyFilterClick)=\"onApplyFilterClick.emit($event)\"\n      (onResetFilterClick)=\"handleResetFilterClick()\"\n    >\n    </cqa-dynamic-filter>\n\n    <div class=\"cqa-rounded-[7px] cqa-overflow-hidden cqa-border-t cqa-border-l cqa-border-r cqa-border-grey-200 cqa-relative\">\n      <ng-container *ngIf=\"!isEmptyState && pagedRows && pagedRows.length > 0; else storyEmptyTpl\">\n        <app-dynamic-table\n          [columns]=\"computedColumns\"\n          [data]=\"pagedRows\"\n          [isTableLoading]=\"isTableLoading\"\n          [isTableDataLoading]=\"isTableDataLoading\">\n          <ng-template #emptyTableTpl>\n            <div class=\"cqa-flex cqa-flex-col cqa-items-center cqa-justify-center cqa-py-8\">\n              <img src=\"/assets/illustrations/empty-state.svg\" alt=\"No data\" class=\"cqa-w-32 cqa-h-32 cqa-mb-4\" />\n              <h3 class=\"cqa-text-lg cqa-font-semibold cqa-mb-2\">No test cases</h3>\n              <p class=\"cqa-text-sm cqa-text-neutral-500 cqa-mb-4\">Try adjusting filters or create a new test case.</p>\n              <cqa-button variant=\"filled\" (clicked)=\"toggleFilter()\">Show Filters</cqa-button>\n            </div>\n          </ng-template>\n        </app-dynamic-table>\n      </ng-container>\n\n      <ng-template #storyEmptyTpl>\n        <div class=\"cqa-p-6 cqa-flex cqa-flex-col cqa-items-center cqa-justify-center\">\n          <cqa-empty-state\n            *ngIf=\"isEmptyState\"\n            [title]=\"emptyStateConfig.title\"\n            [description]=\"emptyStateConfig.description\"\n            [imageUrl]=\"emptyStateConfig.imageUrl\"\n            [actions]=\"emptyStateConfig.actions\"\n            (actionClick)=\"onEmptyAction($event)\"\n          >\n          </cqa-empty-state>\n        </div>\n      </ng-template>\n\n    </div>\n\n    <cqa-pagination\n      [totalElements]=\"filteredRows.length\"\n      [pageIndex]=\"pageIndex\"\n      [pageSize]=\"pageSize\"\n      [pageItemCount]=\"pagedRows.length\"\n      (paginate)=\"onPaginate($event)\"\n      (pageSizeChange)=\"onPageSizeChange($event)\"\n    >\n    </cqa-pagination>\n\n    <div *ngIf=\"anyRowSelected\" class=\"cqa-absolute cqa-bottom-[18.75px] cqa-left-[50%] cqa-translate-x-[-50%] cqa-w-full lg:cqa-max-w-[68%] cqa-sm:max-w-[75%] cqa-max-w-[90%] cqa-z-[1]\" >\n      <cqa-table-action-toolbar\n        [selectedItems]=\"currentSelectedItems\"\n        [actions]=\"actions\"\n        (actionClick)=\"actionClick($event)\"\n      ></cqa-table-action-toolbar>\n    </div>\n    \n  </div>\n</div>\n\n", styles: [] }]