@cqa-lib/cqa-ui 1.1.483 → 1.1.485

package/esm2020/lib/step-builder/advanced-variables-form/advanced-variables-form.component.mjs

@@ -2,8 +2,8 @@ import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from
 import { FormArray, FormGroup, FormControl } from '@angular/forms';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/material/slide-toggle";
-import * as i2 from "../../custom-input/custom-input.component";
-import * as i3 from "@angular/material/icon";
+import * as i2 from "@angular/material/icon";
+import * as i3 from "../../custom-input/custom-input.component";
 import * as i4 from "@angular/common";
 export class AdvancedVariablesFormComponent {
     constructor() {
@@ -150,10 +150,10 @@ export class AdvancedVariablesFormComponent {
     }
 }
 AdvancedVariablesFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AdvancedVariablesFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AdvancedVariablesFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AdvancedVariablesFormComponent, selector: "cqa-advanced-variables-form", inputs: { advancedVariables: "advancedVariables", advancedVariableForm: "advancedVariableForm" }, outputs: { variableBooleanChange: "variableBooleanChange", variableValueChange: "variableValueChange" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1 capitalize-first\">\n          {{ variable.label }}\n        </label>\n        <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n          <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input \n                [placeholder]=\"'Enter locator'\" \n                [value]=\"control.value\" \n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <div *ngIf=\"formArray.length > 1\" class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", components: [{ type: i1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: i2.CustomInputComponent, selector: "cqa-custom-input", inputs: ["inputId", "label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+AdvancedVariablesFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AdvancedVariablesFormComponent, selector: "cqa-advanced-variables-form", inputs: { advancedVariables: "advancedVariables", advancedVariableForm: "advancedVariableForm" }, outputs: { variableBooleanChange: "variableBooleanChange", variableValueChange: "variableValueChange" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n          <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n              {{ variable.label }}\n            </label>\n            <!-- Empty-state add button: no rows exist yet, so the usual per-row add icon isn't rendered.\n                 Placing the add button next to the label is the only way to get the first entry back. -->\n            <div\n              *ngIf=\"formArray.length === 0\"\n              class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\"\n              (click)=\"addStrListItem(variable, i)\">\n              <mat-icon style=\"display: flex; align-items: center; justify-content: center; font-size: 20px;\">add</mat-icon>\n            </div>\n          </div>\n          <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input\n                [placeholder]=\"'Enter locator'\"\n                [value]=\"control.value\"\n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <!-- Delete icon is always available so the user can remove ANY row, including the last one. -->\n              <div class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", components: [{ type: i1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3.CustomInputComponent, selector: "cqa-custom-input", inputs: ["inputId", "label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AdvancedVariablesFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-advanced-variables-form', host: { class: 'cqa-ui-root' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1 capitalize-first\">\n          {{ variable.label }}\n        </label>\n        <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n          <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input \n                [placeholder]=\"'Enter locator'\" \n                [value]=\"control.value\" \n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <div *ngIf=\"formArray.length > 1\" class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", styles: [] }]
+            args: [{ selector: 'cqa-advanced-variables-form', host: { class: 'cqa-ui-root' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n          <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n              {{ variable.label }}\n            </label>\n            <!-- Empty-state add button: no rows exist yet, so the usual per-row add icon isn't rendered.\n                 Placing the add button next to the label is the only way to get the first entry back. -->\n            <div\n              *ngIf=\"formArray.length === 0\"\n              class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\"\n              (click)=\"addStrListItem(variable, i)\">\n              <mat-icon style=\"display: flex; align-items: center; justify-content: center; font-size: 20px;\">add</mat-icon>\n            </div>\n          </div>\n          <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input\n                [placeholder]=\"'Enter locator'\"\n                [value]=\"control.value\"\n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <!-- Delete icon is always available so the user can remove ANY row, including the last one. -->\n              <div class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", styles: [] }]
         }], propDecorators: { advancedVariables: [{
                 type: Input
             }], advancedVariableForm: [{
@@ -163,4 +163,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
             }], variableValueChange: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0vYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0vYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBNEIsdUJBQXVCLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUgsT0FBTyxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQWdCbkUsTUFBTSxPQUFPLDhCQUE4QjtJQVAzQztRQVFXLHNCQUFpQixHQUF1QixFQUFFLENBQUM7UUFDM0MseUJBQW9CLEdBQWMsSUFBSSxTQUFTLENBQUMsRUFBRSxDQUFDLENBQUM7UUFFbkQsMEJBQXFCLEdBQUcsSUFBSSxZQUFZLEVBQW9DLENBQUM7UUFDN0Usd0JBQW1CLEdBQUcsSUFBSSxZQUFZLEVBQWdDLENBQUM7S0FzSmxGO0lBcEpDLFdBQVcsQ0FBQyxPQUFzQjtRQUNoQywyQkFBMkI7UUFDM0IsSUFBSSxPQUFPLENBQUMsbUJBQW1CLENBQUMsSUFBSSxPQUFPLENBQUMsc0JBQXNCLENBQUMsRUFBRTtZQUNuRSxzQ0FBc0M7U0FDdkM7SUFDSCxDQUFDO0lBRUQ7O09BRUc7SUFDSCxjQUFjLENBQUMsS0FBYTtRQUMxQixJQUFJLElBQUksQ0FBQyxvQkFBb0IsSUFBSSxLQUFLLElBQUksQ0FBQyxJQUFJLEtBQUssR0FBRyxJQUFJLENBQUMsb0JBQW9CLENB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cG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkNoYW5nZXMsIFNpbXBsZUNoYW5nZXMsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQXJyYXksIEZvcm1Hcm91cCwgRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQWR2YW5jZWRWYXJpYWJsZSB7XG4gIG5hbWU6IHN0cmluZztcbiAgbGFiZWw6IHN0cmluZztcbiAgdmFsdWU6IGJvb2xlYW4gfCBzdHJpbmdbXTtcbiAgdHlwZT86IHN0cmluZztcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3FhLWFkdmFuY2VkLXZhcmlhYmxlcy1mb3JtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2FkdmFuY2VkLXZhcmlhYmxlcy1mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbXSxcbiAgaG9zdDogeyBjbGFzczogJ2NxYS11aS1yb290JyB9LFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBBZHZhbmNlZFZhcmlhYmxlc0Zvcm1Db21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBASW5wdXQoKSBhZHZhbmNlZFZhcmlhYmxlczogQWR2YW5jZWRWYXJpYWJsZVtdID0gW107XG4gIEBJbnB1dCgpIGFkdmFuY2VkVmFyaWFibGVGb3JtOiBGb3JtQXJyYXkgPSBuZXcgRm9ybUFycmF5KFtdKTtcbiAgXG4gIEBPdXRwdXQoKSB2YXJpYWJsZUJvb2xlYW5DaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHsgbmFtZTogc3RyaW5nOyB2YWx1ZTogYm9vbGVhbiB9PigpO1xuICBAT3V0cHV0KCkgdmFyaWFibGVWYWx1ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8eyBuYW1lOiBzdHJpbmc7IHZhbHVlOiBhbnkgfT4oKTtcblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgLy8gSGFuZGxlIGNoYW5nZXMgaWYgbmVlZGVkXG4gICAgaWYgKGNoYW5nZXNbJ2FkdmFuY2VkVmFyaWFibGVzJ10gfHwgY2hhbmdlc1snYWR2YW5jZWRWYXJpYWJsZUZvcm0nXSkge1xuICAgICAgLy8gRm9ybSBpcyBtYW5hZ2VkIGJ5IHBhcmVudCBjb21wb25lbnRcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogR2V0IHRoZSBGb3JtR3JvdXAgYXQgYSBzcGVjaWZpYyBpbmRleFxuICAgKi9cbiAgZ2V0Rm9ybUdyb3VwQXQoaW5kZXg6IG51bWJlcik6IEZvcm1Hcm91cCB8IG51bGwge1xuICAgIGlmICh0aGlzLmFkdmFuY2VkVmFyaWFibGVGb3JtICYmIGluZGV4ID49IDAgJiYgaW5kZXggPCB0aGlzLmFkdmFuY2VkVmFyaWFibGVGb3JtLmxlbmd0aCkge1xuICAgICAgY29uc3QgY29udHJvbCA9IHRoaXMuYWR2YW5jZWRWYXJpYWJsZUZvcm0uYXQoaW5kZXgpO1xuICAgICAgcmV0dXJuIGNvbnRyb2wgaW5zdGFuY2VvZiBGb3JtR3JvdXAgPyBjb250cm9sIDogbnVsbDtcbiAgICB9XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cblxuICAvKipcbiAgICogR2V0IHRoZSB2YWx1ZSBmcm9tIGZvcm0gb3IgdmFyaWFibGVcbiAgICovXG4gIGdldEJvb2xlYW5WYWx1ZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IGJvb2xlYW4ge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlID0gZm9ybUdyb3VwLmdldCgndmFsdWUnKT8udmFsdWU7XG4gICAgICByZXR1cm4gdmFsdWUgIT09IG51bGwgJiYgdmFsdWUgIT09IHVuZGVmaW5lZCA/IHZhbHVlIDogKHZhcmlhYmxlLnZhbHVlIGFzIGJvb2xlYW4pIHx8IGZhbHNlO1xuICAgIH1cbiAgICByZXR1cm4gKHZhcmlhYmxlLnZhbHVlIGFzIGJvb2xlYW4pIHx8IGZhbHNlO1xuICB9XG5cbiAgLyoqXG4gICAqIEdldCB0aGUgdmFsdWUgZnJvbSBmb3JtIG9yIHZhcmlhYmxlIChmb3Igbm9uLWJvb2xlYW4gdHlwZXMpXG4gICAqL1xuICBnZXRWYWx1ZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IGFueSB7XG4gICAgY29uc3QgZm9ybUdyb3VwID0gdGhpcy5nZXRGb3JtR3JvdXBBdChpbmRleCk7XG4gICAgaWYgKGZvcm1Hcm91cCkge1xuICAgICAgY29uc3QgdmFsdWUgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpPy52YWx1ZTtcbiAgICAgIHJldHVybiB2YWx1ZSAhPT0gbnVsbCAmJiB2YWx1ZSAhPT0gdW5kZWZpbmVkID8gdmFsdWUgOiB2YXJpYWJsZS52YWx1ZTtcbiAgICB9XG4gICAgcmV0dXJuIHZhcmlhYmxlLnZhbHVlO1xuICB9XG5cbiAgLyoqXG4gICAqIENoZWNrIGlmIHZhcmlhYmxlIGlzIGJvb2xlYW4gdHlwZVxuICAgKi9cbiAgaXNCb29sZWFuVHlwZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB2YXJpYWJsZS50eXBlICE9PSAnc3RyX2xpc3QnICYmIHR5cGVvZiB2YXJpYWJsZS52YWx1ZSA9PT0gJ2Jvb2xlYW4nO1xuICB9XG5cbiAgLyoqXG4gICAqIENoZWNrIGlmIHZhcmlhYmxlIGlzIHN0cl9saXN0IHR5cGVcbiAgICovXG4gIGlzU3RyTGlzdFR5cGUodmFyaWFibGU6IEFkdmFuY2VkVmFyaWFibGUpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdmFyaWFibGUudHlwZSA9PT0gJ3N0cl9saXN0JztcbiAgfVxuXG4gIC8qKlxuICAgKiBIYW5kbGUgYm9vbGVhbiB2YWx1ZSBjaGFuZ2VcbiAgICovXG4gIG9uVmFyaWFibGVCb29sZWFuQ2hhbmdlKHZhcmlhYmxlTmFtZTogc3RyaW5nLCB2YWx1ZTogYm9vbGVhbik6IHZvaWQge1xuICAgIHRoaXMudmFyaWFibGVCb29sZWFuQ2hhbmdlLmVtaXQoeyBuYW1lOiB2YXJpYWJsZU5hbWUsIHZhbHVlIH0pO1xuICB9XG5cbiAgLyoqXG4gICAqIEhhbmRsZSB2YWx1ZSBjaGFuZ2UgZm9yIG5vbi1ib29sZWFuIHR5cGVzXG4gICAqL1xuICBvblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGVOYW1lOiBzdHJpbmcsIHZhbHVlOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLnZhcmlhYmxlVmFsdWVDaGFuZ2UuZW1pdCh7IG5hbWU6IHZhcmlhYmxlTmFtZSwgdmFsdWUgfSk7XG4gIH1cblxuICAvKipcbiAgICogSGFuZGxlIGFkZGluZyBhIG5ldyBpdGVtIHRvIHN0cl9saXN0XG4gICAqL1xuICBhZGRTdHJMaXN0SXRlbSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IHZvaWQge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlQ29udHJvbCA9IGZvcm1Hcm91cC5nZXQoJ3ZhbHVlJyk7XG4gICAgICBpZiAodmFsdWVDb250cm9sIGluc3RhbmNlb2YgRm9ybUFycmF5KSB7XG4gICAgICAgIHZhbHVlQ29udHJvbC5wdXNoKG5ldyBGb3JtQ29udHJvbCgnJykpO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlXG4gICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgdGhpcy5vblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGUubmFtZSwgY3VycmVudFZhbHVlKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGNvbnNvbGUuZXJyb3IoJ0V4cGVjdGVkIEZvcm1BcnJheSBmb3Igc3RyX2xpc3QgdmFyaWFibGUsIGdvdDonLCB2YWx1ZUNvbnRyb2wpO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBIYW5kbGUgcmVtb3ZpbmcgYW4gaXRlbSBmcm9tIHN0cl9saXN0XG4gICAqL1xuICByZW1vdmVTdHJMaXN0SXRlbSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlciwgaXRlbUluZGV4OiBudW1iZXIpOiB2b2lkIHtcbiAgICBjb25zdCBmb3JtR3JvdXAgPSB0aGlzLmdldEZvcm1Hcm91cEF0KGluZGV4KTtcbiAgICBpZiAoZm9ybUdyb3VwKSB7XG4gICAgICBjb25zdCB2YWx1ZUNvbnRyb2wgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpO1xuICAgICAgaWYgKHZhbHVlQ29udHJvbCBpbnN0YW5jZW9mIEZvcm1BcnJheSAmJiBpdGVtSW5kZXggPj0gMCAmJiBpdGVtSW5kZXggPCB2YWx1ZUNvbnRyb2wubGVuZ3RoKSB7XG4gICAgICAgIHZhbHVlQ29udHJvbC5yZW1vdmVBdChpdGVtSW5kZXgpO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlXG4gICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgdGhpcy5vblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGUubmFtZSwgY3VycmVudFZhbHVlKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogSGFuZGxlIHN0cl9saXN0IGl0ZW0gdmFsdWUgY2hhbmdlXG4gICAqL1xuICBvblN0ckxpc3RJdGVtQ2hhbmdlKHZhcmlhYmxlOiBBZHZhbmNlZFZhcmlhYmxlLCBpbmRleDogbnVtYmVyLCBpdGVtSW5kZXg6IG51bWJlciwgdmFsdWU6IHN0cmluZyk6IHZvaWQge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlQ29udHJvbCA9IGZvcm1Hcm91cC5nZXQoJ3ZhbHVlJyk7XG4gICAgICBpZiAodmFsdWVDb250cm9sIGluc3RhbmNlb2YgRm9ybUFycmF5ICYmIGl0ZW1JbmRleCA+PSAwICYmIGl0ZW1JbmRleCA8IHZhbHVlQ29udHJvbC5sZW5ndGgpIHtcbiAgICAgICAgLy8gVXNlIGVtaXRFdmVudDogZmFsc2UgdG8gcHJldmVudCB0cmlnZ2VyaW5nIGNoYW5nZSBkZXRlY3Rpb24gdGhhdCBjYXVzZXMgZm9jdXMgbG9zc1xuICAgICAgICB2YWx1ZUNvbnRyb2wuYXQoaXRlbUluZGV4KS5zZXRWYWx1ZSh2YWx1ZSwgeyBlbWl0RXZlbnQ6IGZhbHNlIH0pO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlIGFmdGVyIGEgc2hvcnQgZGVsYXkgdG8gYXZvaWQgZm9jdXMgaXNzdWVzXG4gICAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgICB0aGlzLm9uVmFyaWFibGVWYWx1ZUNoYW5nZSh2YXJpYWJsZS5uYW1lLCBjdXJyZW50VmFsdWUpO1xuICAgICAgICB9LCAwKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogR2V0IEZvcm1BcnJheSBmb3Igc3RyX2xpc3QgdmFyaWFibGVcbiAgICovXG4gIGdldFN0ckxpc3RGb3JtQXJyYXkodmFyaWFibGU6IEFkdmFuY2VkVmFyaWFibGUsIGluZGV4OiBudW1iZXIpOiBGb3JtQXJyYXkgfCBudWxsIHtcbiAgICBjb25zdCBmb3JtR3JvdXAgPSB0aGlzLmdldEZvcm1Hcm91cEF0KGluZGV4KTtcbiAgICBpZiAoZm9ybUdyb3VwKSB7XG4gICAgICBjb25zdCBmb3JtQXJyYXkgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpO1xuICAgICAgcmV0dXJuIGZvcm1BcnJheSBpbnN0YW5jZW9mIEZvcm1BcnJheSA/IGZvcm1BcnJheSA6IG51bGw7XG4gICAgfVxuICAgIHJldHVybiBudWxsO1xuICB9XG5cbiAgLyoqXG4gICAqIFRyYWNrIGJ5IGZ1bmN0aW9uIGZvciBuZ0ZvclxuICAgKi9cbiAgdHJhY2tCeVZhcmlhYmxlKGluZGV4OiBudW1iZXIsIHZhcmlhYmxlOiBBZHZhbmNlZFZhcmlhYmxlKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdmFyaWFibGUubmFtZSB8fCBpbmRleC50b1N0cmluZygpO1xuICB9XG5cbiAgLyoqXG4gICAqIFRyYWNrIGJ5IGZ1bmN0aW9uIGZvciBmb3JtIGNvbnRyb2xzIGluIHN0cl9saXN0XG4gICAqL1xuICB0cmFja0J5Q29udHJvbChpbmRleDogbnVtYmVyLCBjb250cm9sOiBhbnkpOiBhbnkge1xuICAgIHJldHVybiBjb250cm9sIHx8IGluZGV4O1xuICB9XG59XG5cbiIsIjxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZ2FwLXgtNiBjcWEtZ2FwLXktNCBjcWEtZmxleC13cmFwIGFkdmFuY2VkLXZhcmlhYmxlcy1mb3JtIGNxYS1tYi00XCI+XG4gIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHZhcmlhYmxlIG9mIGFkdmFuY2VkVmFyaWFibGVzOyBsZXQgaSA9IGluZGV4OyB0cmFja0J5OiB0cmFja0J5VmFyaWFibGVcIj5cbiAgICA8IS0tIEJvb2xlYW4gdmFyaWFibGVzIHdpdGggbWF0LXNsaWRlLXRvZ2dsZSAtLT5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaXNCb29sZWFuVHlwZSh2YXJpYWJsZSlcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMlwiIHN0eWxlPVwid2lkdGg6IDEwMCVcIj5cbiAgICAgICAgPG1hdC1zbGlkZS10b2dnbGUgXG4gICAgICAgICAgW2NoZWNrZWRdPVwiZ2V0Qm9vbGVhblZhbHVlKHZhcmlhYmxlLCBpKVwiXG4gICAgICAgICAgKGNoYW5nZSk9XCJvblZhcmlhYmxlQm9vbGVhbkNoYW5nZSh2YXJpYWJsZS5uYW1lLCAkZXZlbnQuY2hlY2tlZClcIiBcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIj5cbiAgICAgICAgPC9tYXQtc2xpZGUtdG9nZ2xlPlxuICAgICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtdGV4dC1zbSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtZ3JheS03MDAgY2FwaXRhbGl6ZS1maXJzdFwiPlxuICAgICAgICAgIHt7IHZhcmlhYmxlLmxhYmVsIH19XG4gICAgICAgIDwvbGFiZWw+XG4gICAgICA8L2Rpdj5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gc3RyX2xpc3QgdmFyaWFibGVzIHdpdGggZHluYW1pYyBsaXN0IC0tPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc1N0ckxpc3RUeXBlKHZhcmlhYmxlKVwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtdy1mdWxsXCI+XG4gICAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS10ZXh0LXNtIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1ncmF5LTcwMCBjcWEtbWItMSBjYXBpdGFsaXplLWZpcnN0XCI+XG4gICAgICAgICAge3sgdmFyaWFibGUubGFiZWwgfX1cbiAgICAgICAgPC9sYWJlbD5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtZ2FwLTJcIj5cbiAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZ2V0U3RyTGlzdEZvcm1BcnJheSh2YXJpYWJsZSwgaSkgYXMgZm9ybUFycmF5XCI+XG4gICAgICAgICAgICA8ZGl2ICpuZ0Zvcj1cImxldCBjb250cm9sIG9mIGZvcm1BcnJheS5jb250cm9sczsgbGV0IGl0ZW1JbmRleCA9IGluZGV4OyB0cmFja0J5OiB0cmFja0J5Q29udHJvbFwiIGNsYXNzPVwiY3FhLWZsZXggY3FhLWdhcC0yIGNxYS1pdGVtcy1jZW50ZXJcIj5cbiAgICAgICAgICAgICAgPGNxYS1jdXN0b20taW5wdXQgXG4gICAgICAgICAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidFbnRlciBsb2NhdG9yJ1wiIFxuICAgICAgICAgICAgICAgIFt2YWx1ZV09XCJjb250cm9sLnZhbHVlXCIgXG4gICAgICAgICAgICAgICAgW2Z1bGxXaWR0aF09XCJ0cnVlXCJcbiAgICAgICAgICAgICAgICAodmFsdWVDaGFuZ2UpPVwib25TdHJMaXN0SXRlbUNoYW5nZSh2YXJpYWJsZSwgaSwgaXRlbUluZGV4LCAkZXZlbnQpXCI+XG4gICAgICAgICAgICAgIDwvY3FhLWN1c3RvbS1pbnB1dD5cbiAgICAgICAgICAgICAgPGRpdiAqbmdJZj1cImZvcm1BcnJheS5sZW5ndGggPiAxXCIgY2xhc3M9XCJjcWEtY3Vyc29yLXBvaW50ZXIgY3FhLXRleHQtcmVkLTYwMCBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWNlbnRlclwiIChjbGljayk9XCJyZW1vdmVTdHJMaXN0SXRlbSh2YXJpYWJsZSwgaSwgaXRlbUluZGV4KVwiPlxuICAgICAgICAgICAgICAgIDxtYXQtaWNvbiBzdHlsZT1cImZvbnQtc2l6ZTogMjRweDtcIj5kZWxldGU8L21hdC1pY29uPlxuICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgPGRpdiAqbmdJZj1cIml0ZW1JbmRleCA9PT0gZm9ybUFycmF5Lmxlbmd0aCAtIDFcIiBjbGFzcz1cImNxYS1jdXJzb3ItcG9pbnRlciBjcWEtdGV4dC1ibHVlLTYwMCBjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWNlbnRlclwiIChjbGljayk9XCJhZGRTdHJMaXN0SXRlbSh2YXJpYWJsZSwgaSlcIj5cbiAgICAgICAgICAgICAgICA8bWF0LWljb24gc3R5bGU9XCJmb250LXNpemU6IDI0cHg7XCI+YWRkPC9tYXQtaWNvbj5cbiAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgPC9uZy1jb250YWluZXI+XG48L2Rpdj5cblxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0vYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0vYWR2YW5jZWQtdmFyaWFibGVzLWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBNEIsdUJBQXVCLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUgsT0FBTyxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQWdCbkUsTUFBTSxPQUFPLDhCQUE4QjtJQVAzQztRQVFXLHNCQUFpQixHQUF1QixFQUFFLENBQUM7UUFDM0MseUJBQW9CLEdBQWMsSUFBSSxTQUFTLENBQUMsRUFBRSxDQUFDLENBQUM7UUFFbkQsMEJBQXFCLEdBQUcsSUFBSSxZQUFZLEVBQW9DLENBQUM7UUFDN0Usd0JBQW1CLEdBQUcsSUFBSSxZQUFZLEVBQWdDLENBQUM7S0FzSmxGO0lBcEpDLFdBQVcsQ0FBQyxPQUFzQjtRQUNoQywyQkFBMkI7UUFDM0IsSUFBSSxPQUFPLENBQUMsbUJBQW1CLENBQUMsSUFBSSxPQUFPLENBQUMsc0JBQXNCLENBQUMsRUFBRTtZQUNuRSxzQ0FBc0M7U0FDdkM7SUFDSCxDQUFDO0lBRUQ7O09BRUc7SUFDSCxjQUFjLENBQUMsS0FBYTtRQUMxQixJQUFJLElBQUksQ0FBQyxvQkFBb0IsSUFBSSxLQUFLLElBQUksQ0FBQyxJQUFJLEtBQUssR0FBRyxJQUFJLENBQUMsb0JBQW9CLENB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cG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkNoYW5nZXMsIFNpbXBsZUNoYW5nZXMsIENoYW5nZURldGVjdGlvblN0cmF0ZWd5IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQXJyYXksIEZvcm1Hcm91cCwgRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQWR2YW5jZWRWYXJpYWJsZSB7XG4gIG5hbWU6IHN0cmluZztcbiAgbGFiZWw6IHN0cmluZztcbiAgdmFsdWU6IGJvb2xlYW4gfCBzdHJpbmdbXTtcbiAgdHlwZT86IHN0cmluZztcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY3FhLWFkdmFuY2VkLXZhcmlhYmxlcy1mb3JtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2FkdmFuY2VkLXZhcmlhYmxlcy1mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbXSxcbiAgaG9zdDogeyBjbGFzczogJ2NxYS11aS1yb290JyB9LFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBBZHZhbmNlZFZhcmlhYmxlc0Zvcm1Db21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBASW5wdXQoKSBhZHZhbmNlZFZhcmlhYmxlczogQWR2YW5jZWRWYXJpYWJsZVtdID0gW107XG4gIEBJbnB1dCgpIGFkdmFuY2VkVmFyaWFibGVGb3JtOiBGb3JtQXJyYXkgPSBuZXcgRm9ybUFycmF5KFtdKTtcbiAgXG4gIEBPdXRwdXQoKSB2YXJpYWJsZUJvb2xlYW5DaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHsgbmFtZTogc3RyaW5nOyB2YWx1ZTogYm9vbGVhbiB9PigpO1xuICBAT3V0cHV0KCkgdmFyaWFibGVWYWx1ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8eyBuYW1lOiBzdHJpbmc7IHZhbHVlOiBhbnkgfT4oKTtcblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgLy8gSGFuZGxlIGNoYW5nZXMgaWYgbmVlZGVkXG4gICAgaWYgKGNoYW5nZXNbJ2FkdmFuY2VkVmFyaWFibGVzJ10gfHwgY2hhbmdlc1snYWR2YW5jZWRWYXJpYWJsZUZvcm0nXSkge1xuICAgICAgLy8gRm9ybSBpcyBtYW5hZ2VkIGJ5IHBhcmVudCBjb21wb25lbnRcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogR2V0IHRoZSBGb3JtR3JvdXAgYXQgYSBzcGVjaWZpYyBpbmRleFxuICAgKi9cbiAgZ2V0Rm9ybUdyb3VwQXQoaW5kZXg6IG51bWJlcik6IEZvcm1Hcm91cCB8IG51bGwge1xuICAgIGlmICh0aGlzLmFkdmFuY2VkVmFyaWFibGVGb3JtICYmIGluZGV4ID49IDAgJiYgaW5kZXggPCB0aGlzLmFkdmFuY2VkVmFyaWFibGVGb3JtLmxlbmd0aCkge1xuICAgICAgY29uc3QgY29udHJvbCA9IHRoaXMuYWR2YW5jZWRWYXJpYWJsZUZvcm0uYXQoaW5kZXgpO1xuICAgICAgcmV0dXJuIGNvbnRyb2wgaW5zdGFuY2VvZiBGb3JtR3JvdXAgPyBjb250cm9sIDogbnVsbDtcbiAgICB9XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cblxuICAvKipcbiAgICogR2V0IHRoZSB2YWx1ZSBmcm9tIGZvcm0gb3IgdmFyaWFibGVcbiAgICovXG4gIGdldEJvb2xlYW5WYWx1ZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IGJvb2xlYW4ge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlID0gZm9ybUdyb3VwLmdldCgndmFsdWUnKT8udmFsdWU7XG4gICAgICByZXR1cm4gdmFsdWUgIT09IG51bGwgJiYgdmFsdWUgIT09IHVuZGVmaW5lZCA/IHZhbHVlIDogKHZhcmlhYmxlLnZhbHVlIGFzIGJvb2xlYW4pIHx8IGZhbHNlO1xuICAgIH1cbiAgICByZXR1cm4gKHZhcmlhYmxlLnZhbHVlIGFzIGJvb2xlYW4pIHx8IGZhbHNlO1xuICB9XG5cbiAgLyoqXG4gICAqIEdldCB0aGUgdmFsdWUgZnJvbSBmb3JtIG9yIHZhcmlhYmxlIChmb3Igbm9uLWJvb2xlYW4gdHlwZXMpXG4gICAqL1xuICBnZXRWYWx1ZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IGFueSB7XG4gICAgY29uc3QgZm9ybUdyb3VwID0gdGhpcy5nZXRGb3JtR3JvdXBBdChpbmRleCk7XG4gICAgaWYgKGZvcm1Hcm91cCkge1xuICAgICAgY29uc3QgdmFsdWUgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpPy52YWx1ZTtcbiAgICAgIHJldHVybiB2YWx1ZSAhPT0gbnVsbCAmJiB2YWx1ZSAhPT0gdW5kZWZpbmVkID8gdmFsdWUgOiB2YXJpYWJsZS52YWx1ZTtcbiAgICB9XG4gICAgcmV0dXJuIHZhcmlhYmxlLnZhbHVlO1xuICB9XG5cbiAgLyoqXG4gICAqIENoZWNrIGlmIHZhcmlhYmxlIGlzIGJvb2xlYW4gdHlwZVxuICAgKi9cbiAgaXNCb29sZWFuVHlwZSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB2YXJpYWJsZS50eXBlICE9PSAnc3RyX2xpc3QnICYmIHR5cGVvZiB2YXJpYWJsZS52YWx1ZSA9PT0gJ2Jvb2xlYW4nO1xuICB9XG5cbiAgLyoqXG4gICAqIENoZWNrIGlmIHZhcmlhYmxlIGlzIHN0cl9saXN0IHR5cGVcbiAgICovXG4gIGlzU3RyTGlzdFR5cGUodmFyaWFibGU6IEFkdmFuY2VkVmFyaWFibGUpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdmFyaWFibGUudHlwZSA9PT0gJ3N0cl9saXN0JztcbiAgfVxuXG4gIC8qKlxuICAgKiBIYW5kbGUgYm9vbGVhbiB2YWx1ZSBjaGFuZ2VcbiAgICovXG4gIG9uVmFyaWFibGVCb29sZWFuQ2hhbmdlKHZhcmlhYmxlTmFtZTogc3RyaW5nLCB2YWx1ZTogYm9vbGVhbik6IHZvaWQge1xuICAgIHRoaXMudmFyaWFibGVCb29sZWFuQ2hhbmdlLmVtaXQoeyBuYW1lOiB2YXJpYWJsZU5hbWUsIHZhbHVlIH0pO1xuICB9XG5cbiAgLyoqXG4gICAqIEhhbmRsZSB2YWx1ZSBjaGFuZ2UgZm9yIG5vbi1ib29sZWFuIHR5cGVzXG4gICAqL1xuICBvblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGVOYW1lOiBzdHJpbmcsIHZhbHVlOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLnZhcmlhYmxlVmFsdWVDaGFuZ2UuZW1pdCh7IG5hbWU6IHZhcmlhYmxlTmFtZSwgdmFsdWUgfSk7XG4gIH1cblxuICAvKipcbiAgICogSGFuZGxlIGFkZGluZyBhIG5ldyBpdGVtIHRvIHN0cl9saXN0XG4gICAqL1xuICBhZGRTdHJMaXN0SXRlbSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlcik6IHZvaWQge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlQ29udHJvbCA9IGZvcm1Hcm91cC5nZXQoJ3ZhbHVlJyk7XG4gICAgICBpZiAodmFsdWVDb250cm9sIGluc3RhbmNlb2YgRm9ybUFycmF5KSB7XG4gICAgICAgIHZhbHVlQ29udHJvbC5wdXNoKG5ldyBGb3JtQ29udHJvbCgnJykpO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlXG4gICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgdGhpcy5vblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGUubmFtZSwgY3VycmVudFZhbHVlKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGNvbnNvbGUuZXJyb3IoJ0V4cGVjdGVkIEZvcm1BcnJheSBmb3Igc3RyX2xpc3QgdmFyaWFibGUsIGdvdDonLCB2YWx1ZUNvbnRyb2wpO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBIYW5kbGUgcmVtb3ZpbmcgYW4gaXRlbSBmcm9tIHN0cl9saXN0XG4gICAqL1xuICByZW1vdmVTdHJMaXN0SXRlbSh2YXJpYWJsZTogQWR2YW5jZWRWYXJpYWJsZSwgaW5kZXg6IG51bWJlciwgaXRlbUluZGV4OiBudW1iZXIpOiB2b2lkIHtcbiAgICBjb25zdCBmb3JtR3JvdXAgPSB0aGlzLmdldEZvcm1Hcm91cEF0KGluZGV4KTtcbiAgICBpZiAoZm9ybUdyb3VwKSB7XG4gICAgICBjb25zdCB2YWx1ZUNvbnRyb2wgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpO1xuICAgICAgaWYgKHZhbHVlQ29udHJvbCBpbnN0YW5jZW9mIEZvcm1BcnJheSAmJiBpdGVtSW5kZXggPj0gMCAmJiBpdGVtSW5kZXggPCB2YWx1ZUNvbnRyb2wubGVuZ3RoKSB7XG4gICAgICAgIHZhbHVlQ29udHJvbC5yZW1vdmVBdChpdGVtSW5kZXgpO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlXG4gICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgdGhpcy5vblZhcmlhYmxlVmFsdWVDaGFuZ2UodmFyaWFibGUubmFtZSwgY3VycmVudFZhbHVlKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogSGFuZGxlIHN0cl9saXN0IGl0ZW0gdmFsdWUgY2hhbmdlXG4gICAqL1xuICBvblN0ckxpc3RJdGVtQ2hhbmdlKHZhcmlhYmxlOiBBZHZhbmNlZFZhcmlhYmxlLCBpbmRleDogbnVtYmVyLCBpdGVtSW5kZXg6IG51bWJlciwgdmFsdWU6IHN0cmluZyk6IHZvaWQge1xuICAgIGNvbnN0IGZvcm1Hcm91cCA9IHRoaXMuZ2V0Rm9ybUdyb3VwQXQoaW5kZXgpO1xuICAgIGlmIChmb3JtR3JvdXApIHtcbiAgICAgIGNvbnN0IHZhbHVlQ29udHJvbCA9IGZvcm1Hcm91cC5nZXQoJ3ZhbHVlJyk7XG4gICAgICBpZiAodmFsdWVDb250cm9sIGluc3RhbmNlb2YgRm9ybUFycmF5ICYmIGl0ZW1JbmRleCA+PSAwICYmIGl0ZW1JbmRleCA8IHZhbHVlQ29udHJvbC5sZW5ndGgpIHtcbiAgICAgICAgLy8gVXNlIGVtaXRFdmVudDogZmFsc2UgdG8gcHJldmVudCB0cmlnZ2VyaW5nIGNoYW5nZSBkZXRlY3Rpb24gdGhhdCBjYXVzZXMgZm9jdXMgbG9zc1xuICAgICAgICB2YWx1ZUNvbnRyb2wuYXQoaXRlbUluZGV4KS5zZXRWYWx1ZSh2YWx1ZSwgeyBlbWl0RXZlbnQ6IGZhbHNlIH0pO1xuICAgICAgICAvLyBFbWl0IHRoZSB1cGRhdGVkIHZhbHVlIGFmdGVyIGEgc2hvcnQgZGVsYXkgdG8gYXZvaWQgZm9jdXMgaXNzdWVzXG4gICAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGNvbnN0IGN1cnJlbnRWYWx1ZSA9IHZhbHVlQ29udHJvbC52YWx1ZTtcbiAgICAgICAgICB0aGlzLm9uVmFyaWFibGVWYWx1ZUNoYW5nZSh2YXJpYWJsZS5uYW1lLCBjdXJyZW50VmFsdWUpO1xuICAgICAgICB9LCAwKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogR2V0IEZvcm1BcnJheSBmb3Igc3RyX2xpc3QgdmFyaWFibGVcbiAgICovXG4gIGdldFN0ckxpc3RGb3JtQXJyYXkodmFyaWFibGU6IEFkdmFuY2VkVmFyaWFibGUsIGluZGV4OiBudW1iZXIpOiBGb3JtQXJyYXkgfCBudWxsIHtcbiAgICBjb25zdCBmb3JtR3JvdXAgPSB0aGlzLmdldEZvcm1Hcm91cEF0KGluZGV4KTtcbiAgICBpZiAoZm9ybUdyb3VwKSB7XG4gICAgICBjb25zdCBmb3JtQXJyYXkgPSBmb3JtR3JvdXAuZ2V0KCd2YWx1ZScpO1xuICAgICAgcmV0dXJuIGZvcm1BcnJheSBpbnN0YW5jZW9mIEZvcm1BcnJheSA/IGZvcm1BcnJheSA6IG51bGw7XG4gICAgfVxuICAgIHJldHVybiBudWxsO1xuICB9XG5cbiAgLyoqXG4gICAqIFRyYWNrIGJ5IGZ1bmN0aW9uIGZvciBuZ0ZvclxuICAgKi9cbiAgdHJhY2tCeVZhcmlhYmxlKGluZGV4OiBudW1iZXIsIHZhcmlhYmxlOiBBZHZhbmNlZFZhcmlhYmxlKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdmFyaWFibGUubmFtZSB8fCBpbmRleC50b1N0cmluZygpO1xuICB9XG5cbiAgLyoqXG4gICAqIFRyYWNrIGJ5IGZ1bmN0aW9uIGZvciBmb3JtIGNvbnRyb2xzIGluIHN0cl9saXN0XG4gICAqL1xuICB0cmFja0J5Q29udHJvbChpbmRleDogbnVtYmVyLCBjb250cm9sOiBhbnkpOiBhbnkge1xuICAgIHJldHVybiBjb250cm9sIHx8IGluZGV4O1xuICB9XG59XG5cbiIsIjxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZ2FwLXgtNiBjcWEtZ2FwLXktNCBjcWEtZmxleC13cmFwIGFkdmFuY2VkLXZhcmlhYmxlcy1mb3JtIGNxYS1tYi00XCI+XG4gIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHZhcmlhYmxlIG9mIGFkdmFuY2VkVmFyaWFibGVzOyBsZXQgaSA9IGluZGV4OyB0cmFja0J5OiB0cmFja0J5VmFyaWFibGVcIj5cbiAgICA8IS0tIEJvb2xlYW4gdmFyaWFibGVzIHdpdGggbWF0LXNsaWRlLXRvZ2dsZSAtLT5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaXNCb29sZWFuVHlwZSh2YXJpYWJsZSlcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1nYXAtMlwiIHN0eWxlPVwid2lkdGg6IDEwMCVcIj5cbiAgICAgICAgPG1hdC1zbGlkZS10b2dnbGUgXG4gICAgICAgICAgW2NoZWNrZWRdPVwiZ2V0Qm9vbGVhblZhbHVlKHZhcmlhYmxlLCBpKVwiXG4gICAgICAgICAgKGNoYW5nZSk9XCJvblZhcmlhYmxlQm9vbGVhbkNoYW5nZSh2YXJpYWJsZS5uYW1lLCAkZXZlbnQuY2hlY2tlZClcIiBcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIj5cbiAgICAgICAgPC9tYXQtc2xpZGUtdG9nZ2xlPlxuICAgICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtdGV4dC1zbSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtZ3JheS03MDAgY2FwaXRhbGl6ZS1maXJzdFwiPlxuICAgICAgICAgIHt7IHZhcmlhYmxlLmxhYmVsIH19XG4gICAgICAgIDwvbGFiZWw+XG4gICAgICA8L2Rpdj5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gc3RyX2xpc3QgdmFyaWFibGVzIHdpdGggZHluYW1pYyBsaXN0IC0tPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc1N0ckxpc3RUeXBlKHZhcmlhYmxlKVwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtdy1mdWxsXCI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJnZXRTdHJMaXN0Rm9ybUFycmF5KHZhcmlhYmxlLCBpKSBhcyBmb3JtQXJyYXlcIj5cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTIgY3FhLW1iLTFcIj5cbiAgICAgICAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS10ZXh0LXNtIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1ncmF5LTcwMCBjYXBpdGFsaXplLWZpcnN0XCI+XG4gICAgICAgICAgICAgIHt7IHZhcmlhYmxlLmxhYmVsIH19XG4gICAgICAgICAgICA8L2xhYmVsPlxuICAgICAgICAgICAgPCEtLSBFbXB0eS1zdGF0ZSBhZGQgYnV0dG9uOiBubyByb3dzIGV4aXN0IHlldCwgc28gdGhlIHVzdWFsIHBlci1yb3cgYWRkIGljb24gaXNuJ3QgcmVuZGVyZWQuXG4gICAgICAgICAgICAgICAgIFBsYWNpbmcgdGhlIGFkZCBidXR0b24gbmV4dCB0byB0aGUgbGFiZWwgaXMgdGhlIG9ubHkgd2F5IHRvIGdldCB0aGUgZmlyc3QgZW50cnkgYmFjay4gLS0+XG4gICAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAgICpuZ0lmPVwiZm9ybUFycmF5Lmxlbmd0aCA9PT0gMFwiXG4gICAgICAgICAgICAgIGNsYXNzPVwiY3FhLWN1cnNvci1wb2ludGVyIGNxYS10ZXh0LWJsdWUtNjAwIGNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWp1c3RpZnktY2VudGVyXCJcbiAgICAgICAgICAgICAgKGNsaWNrKT1cImFkZFN0ckxpc3RJdGVtKHZhcmlhYmxlLCBpKVwiPlxuICAgICAgICAgICAgICA8bWF0LWljb24gc3R5bGU9XCJkaXNwbGF5OiBmbGV4OyBhbGlnbi1pdGVtczogY2VudGVyOyBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsgZm9udC1zaXplOiAyMHB4O1wiPmFkZDwvbWF0LWljb24+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1nYXAtMlwiPlxuICAgICAgICAgICAgPGRpdiAqbmdGb3I9XCJsZXQgY29udHJvbCBvZiBmb3JtQXJyYXkuY29udHJvbHM7IGxldCBpdGVtSW5kZXggPSBpbmRleDsgdHJhY2tCeTogdHJhY2tCeUNvbnRyb2xcIiBjbGFzcz1cImNxYS1mbGV4IGNxYS1nYXAtMiBjcWEtaXRlbXMtY2VudGVyXCI+XG4gICAgICAgICAgICAgIDxjcWEtY3VzdG9tLWlucHV0XG4gICAgICAgICAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidFbnRlciBsb2NhdG9yJ1wiXG4gICAgICAgICAgICAgICAgW3ZhbHVlXT1cImNvbnRyb2wudmFsdWVcIlxuICAgICAgICAgICAgICAgIFtmdWxsV2lkdGhdPVwidHJ1ZVwiXG4gICAgICAgICAgICAgICAgKHZhbHVlQ2hhbmdlKT1cIm9uU3RyTGlzdEl0ZW1DaGFuZ2UodmFyaWFibGUsIGksIGl0ZW1JbmRleCwgJGV2ZW50KVwiPlxuICAgICAgICAgICAgICA8L2NxYS1jdXN0b20taW5wdXQ+XG4gICAgICAgICAgICAgIDwhLS0gRGVsZXRlIGljb24gaXMgYWx3YXlzIGF2YWlsYWJsZSBzbyB0aGUgdXNlciBjYW4gcmVtb3ZlIEFOWSByb3csIGluY2x1ZGluZyB0aGUgbGFzdCBvbmUuIC0tPlxuICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWN1cnNvci1wb2ludGVyIGNxYS10ZXh0LXJlZC02MDAgY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtanVzdGlmeS1jZW50ZXJcIiAoY2xpY2spPVwicmVtb3ZlU3RyTGlzdEl0ZW0odmFyaWFibGUsIGksIGl0ZW1JbmRleClcIj5cbiAgICAgICAgICAgICAgICA8bWF0LWljb24gc3R5bGU9XCJmb250LXNpemU6IDI0cHg7XCI+ZGVsZXRlPC9tYXQtaWNvbj5cbiAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgIDxkaXYgKm5nSWY9XCJpdGVtSW5kZXggPT09IGZvcm1BcnJheS5sZW5ndGggLSAxXCIgY2xhc3M9XCJjcWEtY3Vyc29yLXBvaW50ZXIgY3FhLXRleHQtYmx1ZS02MDAgY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtanVzdGlmeS1jZW50ZXJcIiAoY2xpY2spPVwiYWRkU3RyTGlzdEl0ZW0odmFyaWFibGUsIGkpXCI+XG4gICAgICAgICAgICAgICAgPG1hdC1pY29uIHN0eWxlPVwiZm9udC1zaXplOiAyNHB4O1wiPmFkZDwvbWF0LWljb24+XG4gICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG4gICAgPC9uZy1jb250YWluZXI+XG4gIDwvbmctY29udGFpbmVyPlxuPC9kaXY+XG5cbiJdfQ==

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

@@ -2049,6 +2049,32 @@ class DynamicSelectFieldComponent {
         }
         return String(controlValue);
     }
+    /** Resolved option for single-select trigger (icon + label). */
+    get singleSelectedOption() {
+        var _a, _b, _c;
+        const key = (_a = this.config) === null || _a === void 0 ? void 0 : _a.key;
+        if (!key || !this.form || this.isMultiple)
+            return null;
+        const controlValue = (_b = this.form.get(key)) === null || _b === void 0 ? void 0 : _b.value;
+        if (controlValue === null || controlValue === undefined || controlValue === '')
+            return null;
+        const matched = (((_c = this.config) === null || _c === void 0 ? void 0 : _c.options) || []).find((opt) => this.getOptionValue(opt) === controlValue || String(this.getOptionValue(opt)) === String(controlValue));
+        return matched !== null && matched !== void 0 ? matched : null;
+    }
+    /**
+     * Maps API testType strings to icon variants. Unknown non-empty values use 'other'.
+     */
+    testTypeIconKind(opt) {
+        const raw = opt === null || opt === void 0 ? void 0 : opt.testType;
+        if (raw == null || String(raw).trim() === '')
+            return null;
+        const u = String(raw).trim().toUpperCase();
+        if (u === 'MOBILE')
+            return 'mobile';
+        if (u === 'BROWSER' || u === 'WEB')
+            return 'web';
+        return 'other';
+    }
     get isDisabled() {
         var _a;
         return this.toBoolean((_a = this.config) === null || _a === void 0 ? void 0 : _a.disabled);
@@ -2839,10 +2865,10 @@ class DynamicSelectFieldComponent {
     }
 }
 DynamicSelectFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DynamicSelectFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DynamicSelectFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: { form: "form", config: "config" }, outputs: { selectionChange: "selectionChange", selectClick: "selectClick", searchChange: "searchChange", loadMore: "loadMore", addCustomValue: "addCustomValue" }, host: { listeners: { "document:click": "handleDocumentClick($event)" } }, viewQueries: [{ propertyName: "selectRef", first: true, predicate: ["selectRef"], descendants: true }, { propertyName: "hostEl", first: true, predicate: ["host"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\">\n  <ng-container [formGroup]=\"form\">\n    <label *ngIf=\"config.label\"\n      class=\"form-label cqa-text-[#374151] cqa-text-[14px] cqa-font-medium cqa-block cqa-leading-[1.4] cqa-mb-2\">{{\n      config.label }}</label>\n    <mat-form-field #host class=\"mat-select-custom cqa-w-full\" appearance=\"fill\">\n      <mat-select #selectRef=\"matSelect\" [placeholder]=\"displayPlaceholder\" [multiple]=\"isMultiple\"\n        disableOptionCentering [panelClass]=\"panelClass\" [formControlName]=\"config.key\"\n        (openedChange)=\"onSelectOpenedChange($event, selectRef)\" (selectionChange)=\"onSelectionChange($event, selectRef)\"\n        (keydown)=\"onSelectKeydown($event)\">\n        <mat-select-trigger *ngIf=\"!isMultiple && singleSelectedDisplayLabel\">\n          <span [innerHTML]=\"singleSelectedDisplayLabel\"></span>\n        </mat-select-trigger>\n\n        <mat-option *ngIf=\"config.searchable\" class=\"ts-select-search\" disabled>\n          <input class=\"ts-select-search-input cqa-text-black-100\" type=\"text\" [value]=\"searchTextByKey[config.key] || ''\"\n            (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\"\n            (keydown)=\"onSearchInputKeydown($event)\" (input)=\"onSearch(config.key, $any($event.target).value)\"\n            placeholder=\"Search...\" />\n        </mat-option>\n        \n        <mat-option [ngClass]=\"{'checkmark': config.optionStyle === 'checkmark','checkbox': config.optionStyle !== 'checkmark','mat-selected': allSelected}\" [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngIf=\"isMultiple && config.showSelectAll\" [value]=\"SELECT_ALL_VALUE\">\n          <ng-container *ngIf=\"useCheckboxStyle; else selectAllDefaultTpl\">\n            <span class=\"cqa-flex cqa-items-center\">\n              <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                [ngStyle]=\"allSelected ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                <svg *ngIf=\"allSelected\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n              <span class=\"cqa-min-w-0\">{{ config.selectAllLabel || 'All' }}</span>\n            </span>\n          </ng-container>\n          <ng-template #selectAllDefaultTpl>\n            {{ config.selectAllLabel || 'All' }}\n          </ng-template>\n        </mat-option>\n\n        <mat-option *ngIf=\"showAddCustomOption\" [value]=\"addCustomSentinelValue\" class=\"cqa-text-primary\">\n          New\n        </mat-option>\n\n        <mat-option [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngFor=\"let opt of filteredOptions(config)\" [value]=\"getOptionValue(opt)\">\n          <ng-container *ngIf=\"config.isCompareRuns\">   \n            <ng-container *ngIf=\"useCheckboxStyle; else compareRunsDefaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"hasHighlighting\"\n                    [style.color]=\"opt.statusColor || null\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <ng-container *ngIf=\"!hasHighlighting\">\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else checkboxDefaultLabel\">\n                      <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                      <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                    </span>\n                    <ng-template #checkboxDefaultLabel>\n                      <span\n                        class=\"cqa-min-w-0 cqa-compare-runs\"\n                        [style.color]=\"opt.statusColor || null\">\n                        {{ opt.name ?? opt.label ?? opt.value }}\n                      </span>\n                    </ng-template>\n                  </ng-container>\n                </span>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #compareRunsDefaultOptionTpl>\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span\n                  class=\"cqa-min-w-0 cqa-compare-runs\"\n                  *ngIf=\"hasHighlighting\"\n                  [style.color]=\"opt.statusColor || null\"\n                  [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <ng-container *ngIf=\"!hasHighlighting\">\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else defaultLabel\">\n                    <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                    <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                  </span>\n                  <ng-template #defaultLabel>\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      [style.color]=\"opt.statusColor || null\">\n                      {{ opt.name ?? opt.label ?? opt.value }}\n                    </span>\n                  </ng-template>\n                </ng-container>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-template>\n          </ng-container>\n          <ng-container *ngIf=\"!config.isCompareRuns\">\n            <ng-container *ngIf=\"useCheckboxStyle; else defaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center\">\n                <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                  [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                  <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                </span>\n                <!-- When displayLabelAsInnerHtml is true, render label as raw HTML -->\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"config?.displayLabelAsInnerHtml\"\n                      [innerHTML]=\"opt.label ?? opt.name ?? opt.value\">\n                </span>\n                <!-- Otherwise use normal/highlighted text rendering -->\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\"\n                      [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\">\n                </span>\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                  {{ opt.name ?? opt.label ?? opt.value }}\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #defaultOptionTpl>\n              <!-- When displayLabelAsInnerHtml is true, render label as raw HTML -->\n              <span *ngIf=\"config?.displayLabelAsInnerHtml\"\n                    [innerHTML]=\"opt.label ?? opt.name ?? opt.value\">\n              </span>\n              <!-- Otherwise use normal/highlighted text rendering -->\n              <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\">\n              </span>\n              <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                {{ opt.name ?? opt.label ?? opt.value }}\n              </span>\n            </ng-template>\n          </ng-container>\n        </mat-option>\n        \n        <!-- No results state (only when not loading and no options) -->\n        <mat-option disabled *ngIf=\"!(config?.options?.length || 0) && !(config?.isLoading || loadingMore)\">\n          No results\n        </mat-option>\n        <!-- Infinite scroll sentinel (serverSearch or explicit hasMore) -->\n        <mat-option disabled class=\"load-more-sentinel\" *ngIf=\"config?.hasMore\">\n          <span *ngIf=\"loadingMore || config?.isLoading\">Loading...</span>\n          <span *ngIf=\"!loadingMore && !config?.isLoading\">Scroll to load more\u2026</span>\n        </mat-option>\n      </mat-select>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n        <!-- Inline spinner shown when loading more (infinite scroll) or when config.isLoading is true -->\n        <svg *ngIf=\"loadingMore || config?.isLoading\" width=\"16\" height=\"16\" viewBox=\"0 0 50 50\" aria-label=\"loading\"\n             xmlns=\"http://www.w3.org/2000/svg\">\n          <circle cx=\"25\" cy=\"25\" r=\"20\" stroke=\"#E5E7EB\" stroke-width=\"6\" fill=\"none\"/>\n          <path d=\"M45 25a20 20 0 0 0-20-20\" stroke=\"#4F46E5\" stroke-width=\"6\" fill=\"none\" stroke-linecap=\"round\">\n            <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\"\n                              dur=\"0.8s\" repeatCount=\"indefinite\"/>\n          </path>\n        </svg>\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M4 6L8 10L12 6\" stroke=\"#0A0A0A\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </div>\n    </mat-form-field>\n  </ng-container>\n</div>", components: [{ type: i10.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.MatSelectTrigger, selector: "mat-select-trigger" }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DynamicSelectFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: { form: "form", config: "config" }, outputs: { selectionChange: "selectionChange", selectClick: "selectClick", searchChange: "searchChange", loadMore: "loadMore", addCustomValue: "addCustomValue" }, host: { listeners: { "document:click": "handleDocumentClick($event)" } }, viewQueries: [{ propertyName: "selectRef", first: true, predicate: ["selectRef"], descendants: true }, { propertyName: "hostEl", first: true, predicate: ["host"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\">\n  <ng-container [formGroup]=\"form\">\n    <label *ngIf=\"config.label\"\n      class=\"form-label cqa-text-[#374151] cqa-text-[14px] cqa-font-medium cqa-block cqa-leading-[1.4] cqa-mb-2\">{{\n      config.label }}</label>\n    <mat-form-field #host class=\"mat-select-custom cqa-w-full\" appearance=\"fill\">\n      <mat-select #selectRef=\"matSelect\" [placeholder]=\"displayPlaceholder\" [multiple]=\"isMultiple\"\n        disableOptionCentering [panelClass]=\"panelClass\" [formControlName]=\"config.key\"\n        (openedChange)=\"onSelectOpenedChange($event, selectRef)\" (selectionChange)=\"onSelectionChange($event, selectRef)\"\n        (keydown)=\"onSelectKeydown($event)\">\n        <mat-select-trigger *ngIf=\"!isMultiple && singleSelectedDisplayLabel\">\n          <span class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n            <ng-container *ngIf=\"config?.showTestTypeIcon\">\n              <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(singleSelectedOption) }\"></ng-container>\n            </ng-container>\n            <span class=\"cqa-min-w-0\" [innerHTML]=\"singleSelectedDisplayLabel\"></span>\n          </span>\n        </mat-select-trigger>\n\n        <mat-option *ngIf=\"config.searchable\" class=\"ts-select-search\" disabled>\n          <input class=\"ts-select-search-input cqa-text-black-100\" type=\"text\" [value]=\"searchTextByKey[config.key] || ''\"\n            (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\"\n            (keydown)=\"onSearchInputKeydown($event)\" (input)=\"onSearch(config.key, $any($event.target).value)\"\n            placeholder=\"Search...\" />\n        </mat-option>\n        \n        <mat-option [ngClass]=\"{'checkmark': config.optionStyle === 'checkmark','checkbox': config.optionStyle !== 'checkmark','mat-selected': allSelected}\" [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngIf=\"isMultiple && config.showSelectAll\" [value]=\"SELECT_ALL_VALUE\">\n          <ng-container *ngIf=\"useCheckboxStyle; else selectAllDefaultTpl\">\n            <span class=\"cqa-flex cqa-items-center\">\n              <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                [ngStyle]=\"allSelected ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                <svg *ngIf=\"allSelected\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n              <span class=\"cqa-min-w-0\">{{ config.selectAllLabel || 'All' }}</span>\n            </span>\n          </ng-container>\n          <ng-template #selectAllDefaultTpl>\n            {{ config.selectAllLabel || 'All' }}\n          </ng-template>\n        </mat-option>\n\n        <mat-option *ngIf=\"showAddCustomOption\" [value]=\"addCustomSentinelValue\" class=\"cqa-text-primary\">\n          New\n        </mat-option>\n\n        <mat-option [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngFor=\"let opt of filteredOptions(config)\" [value]=\"getOptionValue(opt)\">\n          <ng-container *ngIf=\"config.isCompareRuns\">   \n            <ng-container *ngIf=\"useCheckboxStyle; else compareRunsDefaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"hasHighlighting\"\n                    [style.color]=\"opt.statusColor || null\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <ng-container *ngIf=\"!hasHighlighting\">\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else checkboxDefaultLabel\">\n                      <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                      <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                    </span>\n                    <ng-template #checkboxDefaultLabel>\n                      <span\n                        class=\"cqa-min-w-0 cqa-compare-runs\"\n                        [style.color]=\"opt.statusColor || null\">\n                        {{ opt.name ?? opt.label ?? opt.value }}\n                      </span>\n                    </ng-template>\n                  </ng-container>\n                </span>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #compareRunsDefaultOptionTpl>\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span\n                  class=\"cqa-min-w-0 cqa-compare-runs\"\n                  *ngIf=\"hasHighlighting\"\n                  [style.color]=\"opt.statusColor || null\"\n                  [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <ng-container *ngIf=\"!hasHighlighting\">\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else defaultLabel\">\n                    <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                    <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                  </span>\n                  <ng-template #defaultLabel>\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      [style.color]=\"opt.statusColor || null\">\n                      {{ opt.name ?? opt.label ?? opt.value }}\n                    </span>\n                  </ng-template>\n                </ng-container>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-template>\n          </ng-container>\n          <ng-container *ngIf=\"!config.isCompareRuns\">\n            <ng-container *ngIf=\"useCheckboxStyle; else defaultOptionTpl\">\n              <ng-container *ngIf=\"config?.showTestTypeIcon; else checkboxNoIconTpl\">\n                <span class=\"cqa-flex cqa-items-center cqa-gap-1 cqa-min-w-0\">\n                  <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(opt) }\"></ng-container>\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-container>\n              <ng-template #checkboxNoIconTpl>\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-template>\n            </ng-container>\n            <ng-template #defaultOptionTpl>\n              <ng-container *ngIf=\"config?.showTestTypeIcon; else defaultNoIconTpl\">\n                <span class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n                  <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(opt) }\"></ng-container>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-container>\n              <ng-template #defaultNoIconTpl>\n                <span *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                  {{ opt.name ?? opt.label ?? opt.value }}\n                </span>\n              </ng-template>\n            </ng-template>\n          </ng-container>\n        </mat-option>\n        \n        <!-- No results state (only when not loading and no options) -->\n        <mat-option disabled *ngIf=\"!(config?.options?.length || 0) && !(config?.isLoading || loadingMore)\">\n          No results\n        </mat-option>\n        <!-- Infinite scroll sentinel (serverSearch or explicit hasMore) -->\n        <mat-option disabled class=\"load-more-sentinel\" *ngIf=\"config?.hasMore\">\n          <span *ngIf=\"loadingMore || config?.isLoading\">Loading...</span>\n          <span *ngIf=\"!loadingMore && !config?.isLoading\">Scroll to load more\u2026</span>\n        </mat-option>\n      </mat-select>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n        <!-- Inline spinner shown when loading more (infinite scroll) or when config.isLoading is true -->\n        <svg *ngIf=\"loadingMore || config?.isLoading\" width=\"16\" height=\"16\" viewBox=\"0 0 50 50\" aria-label=\"loading\"\n             xmlns=\"http://www.w3.org/2000/svg\">\n          <circle cx=\"25\" cy=\"25\" r=\"20\" stroke=\"#E5E7EB\" stroke-width=\"6\" fill=\"none\"/>\n          <path d=\"M45 25a20 20 0 0 0-20-20\" stroke=\"#4F46E5\" stroke-width=\"6\" fill=\"none\" stroke-linecap=\"round\">\n            <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\"\n                              dur=\"0.8s\" repeatCount=\"indefinite\"/>\n          </path>\n        </svg>\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M4 6L8 10L12 6\" stroke=\"#0A0A0A\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </div>\n      </mat-form-field>\n  </ng-container>\n\n  <ng-template #optionTestTypeIconTpl let-kind=\"kind\">\n    <span *ngIf=\"kind === 'mobile'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n        <path d=\"M6 5a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-14\"/>\n        <path d=\"M11 4h2\"/>\n        <path d=\"M12 17v.01\"/>\n      </svg>\n    </span>\n    <span *ngIf=\"kind === 'web'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n        <path d=\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"/>\n        <path d=\"M3.6 9h16.8\"/>\n        <path d=\"M3.6 15h16.8\"/>\n        <path d=\"M11.5 3a17 17 0 0 0 0 18\"/>\n        <path d=\"M12.5 3a17 17 0 0 1 0 18\"/>\n      </svg>\n    </span>\n    <span *ngIf=\"kind === 'other'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6.5h16v11H4z\" stroke=\"#9CA3AF\" stroke-width=\"1.5\" stroke-linejoin=\"round\"/>\n        <path d=\"M8 6.5V5h8v1.5\" stroke=\"#9CA3AF\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </span>\n  </ng-template>\n</div>", components: [{ type: i10.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.MatSelectTrigger, selector: "mat-select-trigger" }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DynamicSelectFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-dynamic-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-ui-root\">\n  <ng-container [formGroup]=\"form\">\n    <label *ngIf=\"config.label\"\n      class=\"form-label cqa-text-[#374151] cqa-text-[14px] cqa-font-medium cqa-block cqa-leading-[1.4] cqa-mb-2\">{{\n      config.label }}</label>\n    <mat-form-field #host class=\"mat-select-custom cqa-w-full\" appearance=\"fill\">\n      <mat-select #selectRef=\"matSelect\" [placeholder]=\"displayPlaceholder\" [multiple]=\"isMultiple\"\n        disableOptionCentering [panelClass]=\"panelClass\" [formControlName]=\"config.key\"\n        (openedChange)=\"onSelectOpenedChange($event, selectRef)\" (selectionChange)=\"onSelectionChange($event, selectRef)\"\n        (keydown)=\"onSelectKeydown($event)\">\n        <mat-select-trigger *ngIf=\"!isMultiple && singleSelectedDisplayLabel\">\n          <span [innerHTML]=\"singleSelectedDisplayLabel\"></span>\n        </mat-select-trigger>\n\n        <mat-option *ngIf=\"config.searchable\" class=\"ts-select-search\" disabled>\n          <input class=\"ts-select-search-input cqa-text-black-100\" type=\"text\" [value]=\"searchTextByKey[config.key] || ''\"\n            (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\"\n            (keydown)=\"onSearchInputKeydown($event)\" (input)=\"onSearch(config.key, $any($event.target).value)\"\n            placeholder=\"Search...\" />\n        </mat-option>\n        \n        <mat-option [ngClass]=\"{'checkmark': config.optionStyle === 'checkmark','checkbox': config.optionStyle !== 'checkmark','mat-selected': allSelected}\" [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngIf=\"isMultiple && config.showSelectAll\" [value]=\"SELECT_ALL_VALUE\">\n          <ng-container *ngIf=\"useCheckboxStyle; else selectAllDefaultTpl\">\n            <span class=\"cqa-flex cqa-items-center\">\n              <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                [ngStyle]=\"allSelected ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                <svg *ngIf=\"allSelected\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n              <span class=\"cqa-min-w-0\">{{ config.selectAllLabel || 'All' }}</span>\n            </span>\n          </ng-container>\n          <ng-template #selectAllDefaultTpl>\n            {{ config.selectAllLabel || 'All' }}\n          </ng-template>\n        </mat-option>\n\n        <mat-option *ngIf=\"showAddCustomOption\" [value]=\"addCustomSentinelValue\" class=\"cqa-text-primary\">\n          New\n        </mat-option>\n\n        <mat-option [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngFor=\"let opt of filteredOptions(config)\" [value]=\"getOptionValue(opt)\">\n          <ng-container *ngIf=\"config.isCompareRuns\">   \n            <ng-container *ngIf=\"useCheckboxStyle; else compareRunsDefaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"hasHighlighting\"\n                    [style.color]=\"opt.statusColor || null\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <ng-container *ngIf=\"!hasHighlighting\">\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else checkboxDefaultLabel\">\n                      <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                      <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                    </span>\n                    <ng-template #checkboxDefaultLabel>\n                      <span\n                        class=\"cqa-min-w-0 cqa-compare-runs\"\n                        [style.color]=\"opt.statusColor || null\">\n                        {{ opt.name ?? opt.label ?? opt.value }}\n                      </span>\n                    </ng-template>\n                  </ng-container>\n                </span>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #compareRunsDefaultOptionTpl>\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span\n                  class=\"cqa-min-w-0 cqa-compare-runs\"\n                  *ngIf=\"hasHighlighting\"\n                  [style.color]=\"opt.statusColor || null\"\n                  [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <ng-container *ngIf=\"!hasHighlighting\">\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else defaultLabel\">\n                    <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                    <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                  </span>\n                  <ng-template #defaultLabel>\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      [style.color]=\"opt.statusColor || null\">\n                      {{ opt.name ?? opt.label ?? opt.value }}\n                    </span>\n                  </ng-template>\n                </ng-container>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-template>\n          </ng-container>\n          <ng-container *ngIf=\"!config.isCompareRuns\">\n            <ng-container *ngIf=\"useCheckboxStyle; else defaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center\">\n                <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                  [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                  <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                </span>\n                <!-- When displayLabelAsInnerHtml is true, render label as raw HTML -->\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"config?.displayLabelAsInnerHtml\"\n                      [innerHTML]=\"opt.label ?? opt.name ?? opt.value\">\n                </span>\n                <!-- Otherwise use normal/highlighted text rendering -->\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\"\n                      [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\">\n                </span>\n                <span class=\"cqa-min-w-0\"\n                      *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                  {{ opt.name ?? opt.label ?? opt.value }}\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #defaultOptionTpl>\n              <!-- When displayLabelAsInnerHtml is true, render label as raw HTML -->\n              <span *ngIf=\"config?.displayLabelAsInnerHtml\"\n                    [innerHTML]=\"opt.label ?? opt.name ?? opt.value\">\n              </span>\n              <!-- Otherwise use normal/highlighted text rendering -->\n              <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\">\n              </span>\n              <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                {{ opt.name ?? opt.label ?? opt.value }}\n              </span>\n            </ng-template>\n          </ng-container>\n        </mat-option>\n        \n        <!-- No results state (only when not loading and no options) -->\n        <mat-option disabled *ngIf=\"!(config?.options?.length || 0) && !(config?.isLoading || loadingMore)\">\n          No results\n        </mat-option>\n        <!-- Infinite scroll sentinel (serverSearch or explicit hasMore) -->\n        <mat-option disabled class=\"load-more-sentinel\" *ngIf=\"config?.hasMore\">\n          <span *ngIf=\"loadingMore || config?.isLoading\">Loading...</span>\n          <span *ngIf=\"!loadingMore && !config?.isLoading\">Scroll to load more\u2026</span>\n        </mat-option>\n      </mat-select>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n        <!-- Inline spinner shown when loading more (infinite scroll) or when config.isLoading is true -->\n        <svg *ngIf=\"loadingMore || config?.isLoading\" width=\"16\" height=\"16\" viewBox=\"0 0 50 50\" aria-label=\"loading\"\n             xmlns=\"http://www.w3.org/2000/svg\">\n          <circle cx=\"25\" cy=\"25\" r=\"20\" stroke=\"#E5E7EB\" stroke-width=\"6\" fill=\"none\"/>\n          <path d=\"M45 25a20 20 0 0 0-20-20\" stroke=\"#4F46E5\" stroke-width=\"6\" fill=\"none\" stroke-linecap=\"round\">\n            <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\"\n                              dur=\"0.8s\" repeatCount=\"indefinite\"/>\n          </path>\n        </svg>\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M4 6L8 10L12 6\" stroke=\"#0A0A0A\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </div>\n    </mat-form-field>\n  </ng-container>\n</div>" }]
+            args: [{ selector: 'cqa-dynamic-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-ui-root\">\n  <ng-container [formGroup]=\"form\">\n    <label *ngIf=\"config.label\"\n      class=\"form-label cqa-text-[#374151] cqa-text-[14px] cqa-font-medium cqa-block cqa-leading-[1.4] cqa-mb-2\">{{\n      config.label }}</label>\n    <mat-form-field #host class=\"mat-select-custom cqa-w-full\" appearance=\"fill\">\n      <mat-select #selectRef=\"matSelect\" [placeholder]=\"displayPlaceholder\" [multiple]=\"isMultiple\"\n        disableOptionCentering [panelClass]=\"panelClass\" [formControlName]=\"config.key\"\n        (openedChange)=\"onSelectOpenedChange($event, selectRef)\" (selectionChange)=\"onSelectionChange($event, selectRef)\"\n        (keydown)=\"onSelectKeydown($event)\">\n        <mat-select-trigger *ngIf=\"!isMultiple && singleSelectedDisplayLabel\">\n          <span class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n            <ng-container *ngIf=\"config?.showTestTypeIcon\">\n              <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(singleSelectedOption) }\"></ng-container>\n            </ng-container>\n            <span class=\"cqa-min-w-0\" [innerHTML]=\"singleSelectedDisplayLabel\"></span>\n          </span>\n        </mat-select-trigger>\n\n        <mat-option *ngIf=\"config.searchable\" class=\"ts-select-search\" disabled>\n          <input class=\"ts-select-search-input cqa-text-black-100\" type=\"text\" [value]=\"searchTextByKey[config.key] || ''\"\n            (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\"\n            (keydown)=\"onSearchInputKeydown($event)\" (input)=\"onSearch(config.key, $any($event.target).value)\"\n            placeholder=\"Search...\" />\n        </mat-option>\n        \n        <mat-option [ngClass]=\"{'checkmark': config.optionStyle === 'checkmark','checkbox': config.optionStyle !== 'checkmark','mat-selected': allSelected}\" [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngIf=\"isMultiple && config.showSelectAll\" [value]=\"SELECT_ALL_VALUE\">\n          <ng-container *ngIf=\"useCheckboxStyle; else selectAllDefaultTpl\">\n            <span class=\"cqa-flex cqa-items-center\">\n              <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                [ngStyle]=\"allSelected ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                <svg *ngIf=\"allSelected\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n              <span class=\"cqa-min-w-0\">{{ config.selectAllLabel || 'All' }}</span>\n            </span>\n          </ng-container>\n          <ng-template #selectAllDefaultTpl>\n            {{ config.selectAllLabel || 'All' }}\n          </ng-template>\n        </mat-option>\n\n        <mat-option *ngIf=\"showAddCustomOption\" [value]=\"addCustomSentinelValue\" class=\"cqa-text-primary\">\n          New\n        </mat-option>\n\n        <mat-option [class]=\"config.optionStyle == 'checkmark' ? 'checkmark' : 'checkbox'\" *ngFor=\"let opt of filteredOptions(config)\" [value]=\"getOptionValue(opt)\">\n          <ng-container *ngIf=\"config.isCompareRuns\">   \n            <ng-container *ngIf=\"useCheckboxStyle; else compareRunsDefaultOptionTpl\">\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"hasHighlighting\"\n                    [style.color]=\"opt.statusColor || null\"\n                    [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <ng-container *ngIf=\"!hasHighlighting\">\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else checkboxDefaultLabel\">\n                      <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                      <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                    </span>\n                    <ng-template #checkboxDefaultLabel>\n                      <span\n                        class=\"cqa-min-w-0 cqa-compare-runs\"\n                        [style.color]=\"opt.statusColor || null\">\n                        {{ opt.name ?? opt.label ?? opt.value }}\n                      </span>\n                    </ng-template>\n                  </ng-container>\n                </span>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-container>\n            <ng-template #compareRunsDefaultOptionTpl>\n              <span class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-compare-runs-item\">\n                <span\n                  class=\"cqa-min-w-0 cqa-compare-runs\"\n                  *ngIf=\"hasHighlighting\"\n                  [style.color]=\"opt.statusColor || null\"\n                  [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <ng-container *ngIf=\"!hasHighlighting\">\n                  <span\n                    class=\"cqa-min-w-0 cqa-compare-runs\"\n                    *ngIf=\"opt.runNumberLabel && opt.runDateLabel; else defaultLabel\">\n                    <span [style.color]=\"opt.statusColor || null\">{{ opt.runNumberLabel }}</span>\n                    <span class=\"cqa-text-[#6B7280]\"> {{ opt.runDateLabel }}&nbsp;</span>\n                  </span>\n                  <ng-template #defaultLabel>\n                    <span\n                      class=\"cqa-min-w-0 cqa-compare-runs\"\n                      [style.color]=\"opt.statusColor || null\">\n                      {{ opt.name ?? opt.label ?? opt.value }}\n                    </span>\n                  </ng-template>\n                </ng-container>\n                <span\n                  *ngIf=\"opt.durationFormatted\"\n                  class=\"cqa-flex cqa-items-center cqa-justify-start cqa-gap-1 cqa-text-[12px] cqa-text-[#6B7280] cqa-flex-shrink-0 cqa-whitespace-nowrap cqa-max-w-[80px]\" \n                  [ngClass]=\"{\n                    'cqa-min-w-[82px]': opt?.hasHourRun,\n                    'cqa-min-w-[66px]': !opt?.hasHourRun && opt?.hasMinuteRun,\n                    'cqa-min-w-[40px]': !opt?.hasHourRun && !opt?.hasMinuteRun\n                  }\">\n                  <svg class=\"cqa-min-w-[12px] cqa-max-w-[12px]\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <circle cx=\"6\" cy=\"6\" r=\"4.5\" stroke=\"#9CA3AF\" stroke-width=\"1\"/>\n                    <path d=\"M6 3.5V6L7.5 7\" stroke=\"#4B5563\" stroke-width=\"1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                  <span>{{ opt.durationFormatted }}</span>\n                </span>\n              </span>\n            </ng-template>\n          </ng-container>\n          <ng-container *ngIf=\"!config.isCompareRuns\">\n            <ng-container *ngIf=\"useCheckboxStyle; else defaultOptionTpl\">\n              <ng-container *ngIf=\"config?.showTestTypeIcon; else checkboxNoIconTpl\">\n                <span class=\"cqa-flex cqa-items-center cqa-gap-1 cqa-min-w-0\">\n                  <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(opt) }\"></ng-container>\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-container>\n              <ng-template #checkboxNoIconTpl>\n                <span class=\"cqa-flex cqa-items-center\">\n                  <span class=\"cqa-w-4 cqa-h-4 cqa-flex-shrink-0 cqa-rounded-[4px] cqa-border cqa-border-[#D1D5DB] cqa-mr-2 cqa-flex cqa-items-center cqa-justify-center cqa-border-solid\"\n                    [ngStyle]=\"isOptionSelected(opt) ? {'background-color':'#4F46E5','border-color':'#4F46E5'} : {}\">\n                    <svg *ngIf=\"isOptionSelected(opt)\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path d=\"M10 3L4.5 8.5L2 6\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    </svg>\n                  </span>\n                  <span *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-template>\n            </ng-container>\n            <ng-template #defaultOptionTpl>\n              <ng-container *ngIf=\"config?.showTestTypeIcon; else defaultNoIconTpl\">\n                <span class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n                  <ng-container *ngTemplateOutlet=\"optionTestTypeIconTpl; context: { kind: testTypeIconKind(opt) }\"></ng-container>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                  <span class=\"cqa-min-w-0\" *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                    {{ opt.name ?? opt.label ?? opt.value }}\n                  </span>\n                </span>\n              </ng-container>\n              <ng-template #defaultNoIconTpl>\n                <span *ngIf=\"config?.displayLabelAsInnerHtml\" [innerHTML]=\"opt.label ?? opt.name ?? opt.value\"></span>\n                <span *ngIf=\"!config?.displayLabelAsInnerHtml && hasHighlighting\" [innerHTML]=\"highlightText(opt.name ?? opt.label ?? opt.value)\"></span>\n                <span *ngIf=\"!config?.displayLabelAsInnerHtml && !hasHighlighting\">\n                  {{ opt.name ?? opt.label ?? opt.value }}\n                </span>\n              </ng-template>\n            </ng-template>\n          </ng-container>\n        </mat-option>\n        \n        <!-- No results state (only when not loading and no options) -->\n        <mat-option disabled *ngIf=\"!(config?.options?.length || 0) && !(config?.isLoading || loadingMore)\">\n          No results\n        </mat-option>\n        <!-- Infinite scroll sentinel (serverSearch or explicit hasMore) -->\n        <mat-option disabled class=\"load-more-sentinel\" *ngIf=\"config?.hasMore\">\n          <span *ngIf=\"loadingMore || config?.isLoading\">Loading...</span>\n          <span *ngIf=\"!loadingMore && !config?.isLoading\">Scroll to load more\u2026</span>\n        </mat-option>\n      </mat-select>\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n        <!-- Inline spinner shown when loading more (infinite scroll) or when config.isLoading is true -->\n        <svg *ngIf=\"loadingMore || config?.isLoading\" width=\"16\" height=\"16\" viewBox=\"0 0 50 50\" aria-label=\"loading\"\n             xmlns=\"http://www.w3.org/2000/svg\">\n          <circle cx=\"25\" cy=\"25\" r=\"20\" stroke=\"#E5E7EB\" stroke-width=\"6\" fill=\"none\"/>\n          <path d=\"M45 25a20 20 0 0 0-20-20\" stroke=\"#4F46E5\" stroke-width=\"6\" fill=\"none\" stroke-linecap=\"round\">\n            <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\"\n                              dur=\"0.8s\" repeatCount=\"indefinite\"/>\n          </path>\n        </svg>\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M4 6L8 10L12 6\" stroke=\"#0A0A0A\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n            stroke-linejoin=\"round\" />\n        </svg>\n      </div>\n      </mat-form-field>\n  </ng-container>\n\n  <ng-template #optionTestTypeIconTpl let-kind=\"kind\">\n    <span *ngIf=\"kind === 'mobile'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n        <path d=\"M6 5a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-14\"/>\n        <path d=\"M11 4h2\"/>\n        <path d=\"M12 17v.01\"/>\n      </svg>\n    </span>\n    <span *ngIf=\"kind === 'web'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n        <path d=\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"/>\n        <path d=\"M3.6 9h16.8\"/>\n        <path d=\"M3.6 15h16.8\"/>\n        <path d=\"M11.5 3a17 17 0 0 0 0 18\"/>\n        <path d=\"M12.5 3a17 17 0 0 1 0 18\"/>\n      </svg>\n    </span>\n    <span *ngIf=\"kind === 'other'\" class=\"cqa-inline-flex cqa-flex-shrink-0 cqa-items-center\" aria-hidden=\"true\">\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path d=\"M4 6.5h16v11H4z\" stroke=\"#9CA3AF\" stroke-width=\"1.5\" stroke-linejoin=\"round\"/>\n        <path d=\"M8 6.5V5h8v1.5\" stroke=\"#9CA3AF\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n      </svg>\n    </span>\n  </ng-template>\n</div>" }]
         }], propDecorators: { form: [{
                 type: Input
             }], config: [{
@@ -29515,10 +29541,10 @@ class AdvancedVariablesFormComponent {
     }
 }
 AdvancedVariablesFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AdvancedVariablesFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AdvancedVariablesFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AdvancedVariablesFormComponent, selector: "cqa-advanced-variables-form", inputs: { advancedVariables: "advancedVariables", advancedVariableForm: "advancedVariableForm" }, outputs: { variableBooleanChange: "variableBooleanChange", variableValueChange: "variableValueChange" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1 capitalize-first\">\n          {{ variable.label }}\n        </label>\n        <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n          <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input \n                [placeholder]=\"'Enter locator'\" \n                [value]=\"control.value\" \n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <div *ngIf=\"formArray.length > 1\" class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", components: [{ type: i3$4.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: CustomInputComponent, selector: "cqa-custom-input", inputs: ["inputId", "label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+AdvancedVariablesFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AdvancedVariablesFormComponent, selector: "cqa-advanced-variables-form", inputs: { advancedVariables: "advancedVariables", advancedVariableForm: "advancedVariableForm" }, outputs: { variableBooleanChange: "variableBooleanChange", variableValueChange: "variableValueChange" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n          <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n              {{ variable.label }}\n            </label>\n            <!-- Empty-state add button: no rows exist yet, so the usual per-row add icon isn't rendered.\n                 Placing the add button next to the label is the only way to get the first entry back. -->\n            <div\n              *ngIf=\"formArray.length === 0\"\n              class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\"\n              (click)=\"addStrListItem(variable, i)\">\n              <mat-icon style=\"display: flex; align-items: center; justify-content: center; font-size: 20px;\">add</mat-icon>\n            </div>\n          </div>\n          <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input\n                [placeholder]=\"'Enter locator'\"\n                [value]=\"control.value\"\n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <!-- Delete icon is always available so the user can remove ANY row, including the last one. -->\n              <div class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", components: [{ type: i3$4.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: CustomInputComponent, selector: "cqa-custom-input", inputs: ["inputId", "label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AdvancedVariablesFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-advanced-variables-form', host: { class: 'cqa-ui-root' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1 capitalize-first\">\n          {{ variable.label }}\n        </label>\n        <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n          <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input \n                [placeholder]=\"'Enter locator'\" \n                [value]=\"control.value\" \n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <div *ngIf=\"formArray.length > 1\" class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", styles: [] }]
+            args: [{ selector: 'cqa-advanced-variables-form', host: { class: 'cqa-ui-root' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cqa-flex cqa-gap-x-6 cqa-gap-y-4 cqa-flex-wrap advanced-variables-form cqa-mb-4\">\n  <ng-container *ngFor=\"let variable of advancedVariables; let i = index; trackBy: trackByVariable\">\n    <!-- Boolean variables with mat-slide-toggle -->\n    <ng-container *ngIf=\"isBooleanType(variable)\">\n      <div class=\"cqa-flex cqa-items-center cqa-gap-2\" style=\"width: 100%\">\n        <mat-slide-toggle \n          [checked]=\"getBooleanValue(variable, i)\"\n          (change)=\"onVariableBooleanChange(variable.name, $event.checked)\" \n          color=\"primary\">\n        </mat-slide-toggle>\n        <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n          {{ variable.label }}\n        </label>\n      </div>\n    </ng-container>\n\n    <!-- str_list variables with dynamic list -->\n    <ng-container *ngIf=\"isStrListType(variable)\">\n      <div class=\"cqa-flex cqa-flex-col cqa-w-full\">\n        <ng-container *ngIf=\"getStrListFormArray(variable, i) as formArray\">\n          <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 capitalize-first\">\n              {{ variable.label }}\n            </label>\n            <!-- Empty-state add button: no rows exist yet, so the usual per-row add icon isn't rendered.\n                 Placing the add button next to the label is the only way to get the first entry back. -->\n            <div\n              *ngIf=\"formArray.length === 0\"\n              class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\"\n              (click)=\"addStrListItem(variable, i)\">\n              <mat-icon style=\"display: flex; align-items: center; justify-content: center; font-size: 20px;\">add</mat-icon>\n            </div>\n          </div>\n          <div class=\"cqa-flex cqa-flex-col cqa-gap-2\">\n            <div *ngFor=\"let control of formArray.controls; let itemIndex = index; trackBy: trackByControl\" class=\"cqa-flex cqa-gap-2 cqa-items-center\">\n              <cqa-custom-input\n                [placeholder]=\"'Enter locator'\"\n                [value]=\"control.value\"\n                [fullWidth]=\"true\"\n                (valueChange)=\"onStrListItemChange(variable, i, itemIndex, $event)\">\n              </cqa-custom-input>\n              <!-- Delete icon is always available so the user can remove ANY row, including the last one. -->\n              <div class=\"cqa-cursor-pointer cqa-text-red-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"removeStrListItem(variable, i, itemIndex)\">\n                <mat-icon style=\"font-size: 24px;\">delete</mat-icon>\n              </div>\n              <div *ngIf=\"itemIndex === formArray.length - 1\" class=\"cqa-cursor-pointer cqa-text-blue-600 cqa-flex cqa-items-center cqa-justify-center\" (click)=\"addStrListItem(variable, i)\">\n                <mat-icon style=\"font-size: 24px;\">add</mat-icon>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</div>\n\n", styles: [] }]
         }], propDecorators: { advancedVariables: [{
                 type: Input
             }], advancedVariableForm: [{