@cqa-lib/cqa-ui 1.1.4 → 1.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/badge/badge.component.mjs +19 -5
- package/esm2020/lib/compare-runs/compare-runs.component.mjs +5 -7
- package/esm2020/lib/configuration-card/configuration-card.component.mjs +3 -3
- package/esm2020/lib/custom-input/custom-input.component.mjs +137 -0
- package/esm2020/lib/failed-step-card/failed-step-card.component.mjs +45 -0
- package/esm2020/lib/iterations-loop/iterations-loop.component.mjs +174 -0
- package/esm2020/lib/run-history-card/run-history-card.component.mjs +5 -4
- package/esm2020/lib/ui-kit.module.mjs +20 -5
- package/esm2020/public-api.mjs +4 -1
- package/fesm2015/cqa-lib-cqa-ui.mjs +401 -20
- package/fesm2015/cqa-lib-cqa-ui.mjs.map +1 -1
- package/fesm2020/cqa-lib-cqa-ui.mjs +391 -20
- package/fesm2020/cqa-lib-cqa-ui.mjs.map +1 -1
- package/lib/badge/badge.component.d.ts +1 -1
- package/lib/compare-runs/compare-runs.component.d.ts +9 -10
- package/lib/custom-input/custom-input.component.d.ts +39 -0
- package/lib/failed-step-card/failed-step-card.component.d.ts +30 -0
- package/lib/iterations-loop/iterations-loop.component.d.ts +39 -0
- package/lib/ui-kit.module.d.ts +19 -16
- package/package.json +1 -1
- package/public-api.d.ts +3 -0
- package/styles.css +1 -1
|
@@ -4286,7 +4286,10 @@ class BadgeComponent {
|
|
|
4286
4286
|
'cqa-font-normal'
|
|
4287
4287
|
];
|
|
4288
4288
|
// Add size-specific classes
|
|
4289
|
-
if (this.size === 'small') {
|
|
4289
|
+
if (this.size === 'extra-small') {
|
|
4290
|
+
baseClasses.push('cqa-text-[8px]', 'cqa-leading-[12px]', 'cqa-py-[2px]', 'cqa-px-[4px]', 'cqa-rounded-[4px]');
|
|
4291
|
+
}
|
|
4292
|
+
else if (this.size === 'small') {
|
|
4290
4293
|
baseClasses.push('cqa-text-xs', 'cqa-leading-[17px]', 'cqa-py-[2px]', 'cqa-px-2');
|
|
4291
4294
|
}
|
|
4292
4295
|
else {
|
|
@@ -4339,9 +4342,14 @@ class BadgeComponent {
|
|
|
4339
4342
|
'cqa-inline-flex',
|
|
4340
4343
|
'cqa-items-center',
|
|
4341
4344
|
'cqa-justify-center',
|
|
4342
|
-
'cqa-flex-shrink-0'
|
|
4343
|
-
'cqa-mr-1.5'
|
|
4345
|
+
'cqa-flex-shrink-0'
|
|
4344
4346
|
];
|
|
4347
|
+
if (this.size === 'extra-small') {
|
|
4348
|
+
baseClasses.push('cqa-mr-1');
|
|
4349
|
+
}
|
|
4350
|
+
else {
|
|
4351
|
+
baseClasses.push('cqa-mr-1.5');
|
|
4352
|
+
}
|
|
4345
4353
|
// No circular background for any variant - just return base classes
|
|
4346
4354
|
return baseClasses.join(' ');
|
|
4347
4355
|
}
|
|
@@ -4372,7 +4380,13 @@ class BadgeComponent {
|
|
|
4372
4380
|
return baseClasses.join(' ');
|
|
4373
4381
|
}
|
|
4374
4382
|
get iconStyles() {
|
|
4375
|
-
|
|
4383
|
+
let iconSize = '14px';
|
|
4384
|
+
if (this.size === 'extra-small') {
|
|
4385
|
+
iconSize = '10px';
|
|
4386
|
+
}
|
|
4387
|
+
else if (this.size === 'small') {
|
|
4388
|
+
iconSize = '12px';
|
|
4389
|
+
}
|
|
4376
4390
|
const styles = {
|
|
4377
4391
|
'font-size': iconSize,
|
|
4378
4392
|
'width': iconSize,
|
|
@@ -5830,7 +5844,8 @@ class RunHistoryCardComponent {
|
|
|
5830
5844
|
'background-color': '#ecedfe',
|
|
5831
5845
|
'padding': this.isSmall ? '2px 6px' : '2px 8px',
|
|
5832
5846
|
'border-radius': this.isSmall ? '5px' : '4px',
|
|
5833
|
-
'font-size': this.isSmall ? '8px' : '10px'
|
|
5847
|
+
'font-size': this.isSmall ? '8px' : '10px',
|
|
5848
|
+
'line-height': this.isSmall ? '12px' : '15px'
|
|
5834
5849
|
};
|
|
5835
5850
|
}
|
|
5836
5851
|
get cardPadding() {
|
|
@@ -5841,10 +5856,10 @@ class RunHistoryCardComponent {
|
|
|
5841
5856
|
}
|
|
5842
5857
|
}
|
|
5843
5858
|
RunHistoryCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: RunHistoryCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5844
|
-
RunHistoryCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: RunHistoryCardComponent, selector: "cqa-run-history-card", inputs: { id: "id", status: "status", type: "type", timestamp: "timestamp", duration: "duration", runLabel: "runLabel", errorMessage: "errorMessage", size: "size", durationTooltip: "durationTooltip" }, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-shadow-sm cqa-flex cqa-flex-col\" [ngStyle]=\"{\n padding: cardPadding,\n border: '1px solid #E4E4E4',\n 'border-left-color': statusColor,\n 'border-left-width': borderLeftWidth\n }\">\n\n <!-- Header: Run ID and Status Badge -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\" [ngClass]=\"{\n 'cqa-mb-[10px]': isSmall,\n 'cqa-mb-2': !isSmall\n }\">\n <div class=\"cqa-flex cqa-items-center\" [ngClass]=\"{ 'cqa-gap-[6px]': isSmall, 'cqa-gap-2': !isSmall }\">\n <span [ngStyle]=\"statusIconContainerStyles\">\n <mat-icon [ngStyle]=\"statusIconStyles\">\n {{ statusIcon }}\n </mat-icon>\n </span>\n <span class=\"cqa-font-semibold cqa-text-[#3f43ee]\" [ngClass]=\"{\n 'cqa-text-xs': isSmall,\n 'cqa-text-sm': !isSmall\n }\">\n #{{ id }}\n </span>\n </div>\n\n <!-- Status Badge -->\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-md cqa-font-medium cqa-text-white cqa-px-2\"\n [ngClass]=\"{\n 'cqa-py-[2px] cqa-text-[10px]': isSmall,\n 'cqa-py-1 cqa-text-xs': !isSmall\n }\" [ngStyle]=\"statusBadgeStyles\">\n {{ statusLabel }}\n </span>\n </div>\n\n <!-- Type and Timestamp -->\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\">\n {{ typeIcon }}\n </mat-icon>\n <span [ngClass]=\"{ 'cqa-text-[10px]': isSmall, 'cqa-text-xs': !isSmall }\">\n {{ typeLabel }}\n </span>\n </div>\n\n <!-- Timestamp -->\n <div class=\"cqa-font-normal cqa-text-[#0B0B0B]\" [ngClass]=\"{\n 'cqa-text-sm': !isSmall,\n 'cqa-text-[11px]': isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n {{ timestamp }}\n </div>\n\n <!-- Duration and Run Label -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-gap-2\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall\n }\" [title]=\"durationTooltip\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\" style=\"flex-shrink: 0;\">\n schedule\n </mat-icon>\n <span [ngClass]=\"{\n 'cqa-text-[8px]': isSmall,\n 'cqa-text-[10px]': !isSmall\n }\">\n {{ duration }}\n </span>\n </div>\n\n <span *ngIf=\"runLabel\" class=\"cqa-text-[#3F43EE] cqa-rounded-md cqa-whitespace-nowrap\"\n [ngStyle]=\"runLabelStyles\"\n [ngClass]=\"{ 'cqa-font-medium': !isSmall }\">\n {{ runLabel }}\n </span>\n </div>\n\n <!-- Error Message (only for failed status and normal size) -->\n <div *ngIf=\"errorMessage && status === 'failed' && !isSmall\" class=\"cqa-mt-2 cqa-pt-2\"\n style=\"border-top: 1px solid #E4E4E4;\">\n <p class=\"cqa-text-[10px] cqa-text-[#E7000B]\">\n {{ errorMessage }}\n </p>\n </div>\n </div>\n</div>", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5859
|
+
RunHistoryCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: RunHistoryCardComponent, selector: "cqa-run-history-card", inputs: { id: "id", status: "status", type: "type", timestamp: "timestamp", duration: "duration", runLabel: "runLabel", errorMessage: "errorMessage", size: "size", durationTooltip: "durationTooltip" }, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-shadow-sm cqa-flex cqa-flex-col\" [ngStyle]=\"{\n padding: cardPadding,\n border: '1px solid #E4E4E4',\n 'border-left-color': statusColor,\n 'border-left-width': borderLeftWidth\n }\">\n\n <!-- Header: Run ID and Status Badge -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\" [ngClass]=\"{\n 'cqa-mb-[10px]': isSmall,\n 'cqa-mb-2': !isSmall\n }\">\n <div class=\"cqa-flex cqa-items-center\" [ngClass]=\"{ 'cqa-gap-[6px]': isSmall, 'cqa-gap-2': !isSmall }\">\n <span [ngStyle]=\"statusIconContainerStyles\">\n <mat-icon [ngStyle]=\"statusIconStyles\">\n {{ statusIcon }}\n </mat-icon>\n </span>\n <span class=\"cqa-font-semibold cqa-text-[#3f43ee]\" [ngClass]=\"{\n 'cqa-text-xs': isSmall,\n 'cqa-text-sm': !isSmall\n }\">\n #{{ id }}\n </span>\n </div>\n\n <!-- Status Badge -->\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-md cqa-font-medium cqa-text-white cqa-px-2\"\n [ngClass]=\"{\n 'cqa-py-[2px] cqa-text-[10px]': isSmall,\n 'cqa-py-1 cqa-text-xs': !isSmall\n }\" [ngStyle]=\"statusBadgeStyles\">\n {{ statusLabel }}\n </span>\n </div>\n\n <!-- Type and Timestamp -->\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\">\n {{ typeIcon }}\n </mat-icon>\n <span [ngClass]=\"{ 'cqa-text-[10px]': isSmall, 'cqa-text-xs': !isSmall }\">\n {{ typeLabel }}\n </span>\n </div>\n\n <!-- Timestamp -->\n <div class=\"cqa-font-normal cqa-text-[#0B0B0B] cqa-leading-normal\" [ngClass]=\"{\n 'cqa-text-sm': !isSmall,\n 'cqa-text-[11px]': isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n {{ timestamp }}\n </div>\n\n <!-- Duration and Run Label -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-gap-2\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall\n }\" [title]=\"durationTooltip\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\" style=\"flex-shrink: 0;\">\n schedule\n </mat-icon>\n <span [ngClass]=\"{\n 'cqa-text-[8px]': isSmall,\n 'cqa-text-[10px]': !isSmall\n }\">\n {{ duration }}\n </span>\n </div>\n\n <span *ngIf=\"runLabel\" class=\"cqa-text-[#3F43EE] cqa-rounded-md cqa-whitespace-nowrap\"\n [ngStyle]=\"runLabelStyles\"\n [ngClass]=\"{ 'cqa-font-medium': !isSmall }\">\n {{ runLabel }}\n </span>\n </div>\n\n <!-- Error Message (only for failed status and normal size) -->\n <div *ngIf=\"errorMessage && status === 'failed' && !isSmall\" class=\"cqa-mt-2 cqa-pt-2\"\n style=\"border-top: 1px solid #E4E4E4;\">\n <p class=\"cqa-text-[10px] cqa-text-[#E7000B]\">\n {{ errorMessage }}\n </p>\n </div>\n </div>\n</div>", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5845
5860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: RunHistoryCardComponent, decorators: [{
|
|
5846
5861
|
type: Component,
|
|
5847
|
-
args: [{ selector: 'cqa-run-history-card', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-shadow-sm cqa-flex cqa-flex-col\" [ngStyle]=\"{\n padding: cardPadding,\n border: '1px solid #E4E4E4',\n 'border-left-color': statusColor,\n 'border-left-width': borderLeftWidth\n }\">\n\n <!-- Header: Run ID and Status Badge -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\" [ngClass]=\"{\n 'cqa-mb-[10px]': isSmall,\n 'cqa-mb-2': !isSmall\n }\">\n <div class=\"cqa-flex cqa-items-center\" [ngClass]=\"{ 'cqa-gap-[6px]': isSmall, 'cqa-gap-2': !isSmall }\">\n <span [ngStyle]=\"statusIconContainerStyles\">\n <mat-icon [ngStyle]=\"statusIconStyles\">\n {{ statusIcon }}\n </mat-icon>\n </span>\n <span class=\"cqa-font-semibold cqa-text-[#3f43ee]\" [ngClass]=\"{\n 'cqa-text-xs': isSmall,\n 'cqa-text-sm': !isSmall\n }\">\n #{{ id }}\n </span>\n </div>\n\n <!-- Status Badge -->\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-md cqa-font-medium cqa-text-white cqa-px-2\"\n [ngClass]=\"{\n 'cqa-py-[2px] cqa-text-[10px]': isSmall,\n 'cqa-py-1 cqa-text-xs': !isSmall\n }\" [ngStyle]=\"statusBadgeStyles\">\n {{ statusLabel }}\n </span>\n </div>\n\n <!-- Type and Timestamp -->\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\">\n {{ typeIcon }}\n </mat-icon>\n <span [ngClass]=\"{ 'cqa-text-[10px]': isSmall, 'cqa-text-xs': !isSmall }\">\n {{ typeLabel }}\n </span>\n </div>\n\n <!-- Timestamp -->\n <div class=\"cqa-font-normal cqa-text-[#0B0B0B]\" [ngClass]=\"{\n 'cqa-text-sm': !isSmall,\n 'cqa-text-[11px]': isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n {{ timestamp }}\n </div>\n\n <!-- Duration and Run Label -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-gap-2\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall\n }\" [title]=\"durationTooltip\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\" style=\"flex-shrink: 0;\">\n schedule\n </mat-icon>\n <span [ngClass]=\"{\n 'cqa-text-[8px]': isSmall,\n 'cqa-text-[10px]': !isSmall\n }\">\n {{ duration }}\n </span>\n </div>\n\n <span *ngIf=\"runLabel\" class=\"cqa-text-[#3F43EE] cqa-rounded-md cqa-whitespace-nowrap\"\n [ngStyle]=\"runLabelStyles\"\n [ngClass]=\"{ 'cqa-font-medium': !isSmall }\">\n {{ runLabel }}\n </span>\n </div>\n\n <!-- Error Message (only for failed status and normal size) -->\n <div *ngIf=\"errorMessage && status === 'failed' && !isSmall\" class=\"cqa-mt-2 cqa-pt-2\"\n style=\"border-top: 1px solid #E4E4E4;\">\n <p class=\"cqa-text-[10px] cqa-text-[#E7000B]\">\n {{ errorMessage }}\n </p>\n </div>\n </div>\n</div>", styles: [] }]
|
|
5862
|
+
args: [{ selector: 'cqa-run-history-card', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-shadow-sm cqa-flex cqa-flex-col\" [ngStyle]=\"{\n padding: cardPadding,\n border: '1px solid #E4E4E4',\n 'border-left-color': statusColor,\n 'border-left-width': borderLeftWidth\n }\">\n\n <!-- Header: Run ID and Status Badge -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\" [ngClass]=\"{\n 'cqa-mb-[10px]': isSmall,\n 'cqa-mb-2': !isSmall\n }\">\n <div class=\"cqa-flex cqa-items-center\" [ngClass]=\"{ 'cqa-gap-[6px]': isSmall, 'cqa-gap-2': !isSmall }\">\n <span [ngStyle]=\"statusIconContainerStyles\">\n <mat-icon [ngStyle]=\"statusIconStyles\">\n {{ statusIcon }}\n </mat-icon>\n </span>\n <span class=\"cqa-font-semibold cqa-text-[#3f43ee]\" [ngClass]=\"{\n 'cqa-text-xs': isSmall,\n 'cqa-text-sm': !isSmall\n }\">\n #{{ id }}\n </span>\n </div>\n\n <!-- Status Badge -->\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-rounded-md cqa-font-medium cqa-text-white cqa-px-2\"\n [ngClass]=\"{\n 'cqa-py-[2px] cqa-text-[10px]': isSmall,\n 'cqa-py-1 cqa-text-xs': !isSmall\n }\" [ngStyle]=\"statusBadgeStyles\">\n {{ statusLabel }}\n </span>\n </div>\n\n <!-- Type and Timestamp -->\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\">\n {{ typeIcon }}\n </mat-icon>\n <span [ngClass]=\"{ 'cqa-text-[10px]': isSmall, 'cqa-text-xs': !isSmall }\">\n {{ typeLabel }}\n </span>\n </div>\n\n <!-- Timestamp -->\n <div class=\"cqa-font-normal cqa-text-[#0B0B0B] cqa-leading-normal\" [ngClass]=\"{\n 'cqa-text-sm': !isSmall,\n 'cqa-text-[11px]': isSmall,\n 'cqa-mb-2': isSmall,\n 'cqa-mb-[6px]': !isSmall\n }\">\n {{ timestamp }}\n </div>\n\n <!-- Duration and Run Label -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-gap-2\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[#636363]\" [ngClass]=\"{\n 'cqa-gap-1': isSmall,\n 'cqa-gap-[6px]': !isSmall\n }\" [title]=\"durationTooltip\">\n <mat-icon [ngClass]=\"{\n 'cqa-text-[12px] cqa-w-3 cqa-h-3': isSmall,\n 'cqa-text-[14px] cqa-w-[14px] cqa-h-[14px]': !isSmall }\" style=\"flex-shrink: 0;\">\n schedule\n </mat-icon>\n <span [ngClass]=\"{\n 'cqa-text-[8px]': isSmall,\n 'cqa-text-[10px]': !isSmall\n }\">\n {{ duration }}\n </span>\n </div>\n\n <span *ngIf=\"runLabel\" class=\"cqa-text-[#3F43EE] cqa-rounded-md cqa-whitespace-nowrap\"\n [ngStyle]=\"runLabelStyles\"\n [ngClass]=\"{ 'cqa-font-medium': !isSmall }\">\n {{ runLabel }}\n </span>\n </div>\n\n <!-- Error Message (only for failed status and normal size) -->\n <div *ngIf=\"errorMessage && status === 'failed' && !isSmall\" class=\"cqa-mt-2 cqa-pt-2\"\n style=\"border-top: 1px solid #E4E4E4;\">\n <p class=\"cqa-text-[10px] cqa-text-[#E7000B]\">\n {{ errorMessage }}\n </p>\n </div>\n </div>\n</div>", styles: [] }]
|
|
5848
5863
|
}], propDecorators: { id: [{
|
|
5849
5864
|
type: Input
|
|
5850
5865
|
}], status: [{
|
|
@@ -5960,10 +5975,10 @@ class ConfigurationCardComponent {
|
|
|
5960
5975
|
}
|
|
5961
5976
|
}
|
|
5962
5977
|
ConfigurationCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ConfigurationCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5963
|
-
ConfigurationCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ConfigurationCardComponent, selector: "cqa-configuration-card", inputs: { icon: "icon", title: "title", data: "data" }, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px
|
|
5978
|
+
ConfigurationCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ConfigurationCardComponent, selector: "cqa-configuration-card", inputs: { icon: "icon", title: "title", data: "data" }, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n\t<div class=\"cqa-bg-white cqa-rounded-lg\" style=\"border: 1px solid #E2E8F0; height: 100%;\">\n\t\t<!-- Section Header -->\n\t\t<div class=\"cqa-p-3 cqa-pb-2 cqa-flex cqa-items-center cqa-gap-2 cqa-bg-[#F5F5F566]\"\n\t\t\tstyle=\"border-bottom: 1px solid #E2E8F0;\">\n\t\t\t<ng-container *ngIf=\"icon\">\n\t\t\t\t<mat-icon [ngStyle]=\"headerIconStyles\">\n\t\t\t\t\t{{ icon }}\n\t\t\t\t</mat-icon>\n\t\t\t</ng-container>\n\t\t\t<div class=\"cqa-text-xs cqa-font-semibold cqa-color-[#636363] cqa-leading-normal\">\n\t\t\t\t{{ title }}\n\t\t\t</div>\n\t\t</div>\n\n\t\t<!-- Configuration Items -->\n\t\t<div class=\"cqa-p-4 cqa-pt-3\" *ngIf=\"data.length > 0\">\n\t\t\t<div class=\"cqa-grid cqa-grid-cols-1 cqa-gap-y-[10px]\">\n\t\t\t\t<ng-container *ngFor=\"let item of data\">\n\t\t\t\t\t<!-- *ngIf=\"!isBoolean(item.value)\" -->\n\t\t\t\t\t<div class=\"cqa-flex cqa-gap-2 cqa-justify-between cqa-items-center cqa-h-[15px]\"\n\t\t\t\t\t\t[ngClass]=\"{ 'cqa-h-[21px]': isBoolean(item.value) || item.isFlag }\">\n\t\t\t\t\t\t<!-- Label -->\n\t\t\t\t\t\t<span class=\"cqa-text-xs cqa-text-[#64748B] cqa-font-regular\">\n\t\t\t\t\t\t\t{{ item.label }}\n\t\t\t\t\t\t</span>\n\n\t\t\t\t\t\t<!-- Value -->\n\t\t\t\t\t\t<div class=\"cqa-flex cqa-items-center cqa-gap-[6px]\">\n\t\t\t\t\t\t\t<mat-icon *ngIf=\"item.icon\" class=\"material-icons cqa-text-[#94A3B8] cqa-text-[12px]\n\t\t\t\t\t\t\t\tcqa-w-3 cqa-h-3\">\n\t\t\t\t\t\t\t\t{{ item.icon }}\n\t\t\t\t\t\t\t</mat-icon>\n\t\t\t\t\t\t\t<ng-container *ngIf=\"!item.isFlag\">\n\t\t\t\t\t\t\t\t<span *ngIf=\"!isBoolean(item.value)\" class=\"cqa-text-xs cqa-text-[#334155] cqa-font-regular\">\n\t\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<span *ngIf=\"isBoolean(item.value)\" class=\"cqa-text-xs cqa-text-[#475569] cqa-bg-[#F1F5F9] cqa-rounded-[4px] cqa-font-regular cqa-py-1 cqa-px-[6px]\"\n\t\t\t\t\t\t\t\t\t[ngStyle]=\"{ border: '1px solid #E2E8F0' }\">\n\t\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t<span *ngIf=\"item.isFlag\" class=\"cqa-text-xs cqa-rounded-[4px] cqa-font-medium cqa-py-1 cqa-px-[6px]\"\n\t\t\t\t\t\t\t\t[ngClass]=\"getValueClass(item)\"\n\t\t\t\t\t\t\t\t[ngStyle]=\"{ border: getValueBorder(item) }\">\n\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</div>", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
5964
5979
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ConfigurationCardComponent, decorators: [{
|
|
5965
5980
|
type: Component,
|
|
5966
|
-
args: [{ selector: 'cqa-configuration-card', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px
|
|
5981
|
+
args: [{ selector: 'cqa-configuration-card', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%; height: 100%; min-width: 180px;\">\n\t<div class=\"cqa-bg-white cqa-rounded-lg\" style=\"border: 1px solid #E2E8F0; height: 100%;\">\n\t\t<!-- Section Header -->\n\t\t<div class=\"cqa-p-3 cqa-pb-2 cqa-flex cqa-items-center cqa-gap-2 cqa-bg-[#F5F5F566]\"\n\t\t\tstyle=\"border-bottom: 1px solid #E2E8F0;\">\n\t\t\t<ng-container *ngIf=\"icon\">\n\t\t\t\t<mat-icon [ngStyle]=\"headerIconStyles\">\n\t\t\t\t\t{{ icon }}\n\t\t\t\t</mat-icon>\n\t\t\t</ng-container>\n\t\t\t<div class=\"cqa-text-xs cqa-font-semibold cqa-color-[#636363] cqa-leading-normal\">\n\t\t\t\t{{ title }}\n\t\t\t</div>\n\t\t</div>\n\n\t\t<!-- Configuration Items -->\n\t\t<div class=\"cqa-p-4 cqa-pt-3\" *ngIf=\"data.length > 0\">\n\t\t\t<div class=\"cqa-grid cqa-grid-cols-1 cqa-gap-y-[10px]\">\n\t\t\t\t<ng-container *ngFor=\"let item of data\">\n\t\t\t\t\t<!-- *ngIf=\"!isBoolean(item.value)\" -->\n\t\t\t\t\t<div class=\"cqa-flex cqa-gap-2 cqa-justify-between cqa-items-center cqa-h-[15px]\"\n\t\t\t\t\t\t[ngClass]=\"{ 'cqa-h-[21px]': isBoolean(item.value) || item.isFlag }\">\n\t\t\t\t\t\t<!-- Label -->\n\t\t\t\t\t\t<span class=\"cqa-text-xs cqa-text-[#64748B] cqa-font-regular\">\n\t\t\t\t\t\t\t{{ item.label }}\n\t\t\t\t\t\t</span>\n\n\t\t\t\t\t\t<!-- Value -->\n\t\t\t\t\t\t<div class=\"cqa-flex cqa-items-center cqa-gap-[6px]\">\n\t\t\t\t\t\t\t<mat-icon *ngIf=\"item.icon\" class=\"material-icons cqa-text-[#94A3B8] cqa-text-[12px]\n\t\t\t\t\t\t\t\tcqa-w-3 cqa-h-3\">\n\t\t\t\t\t\t\t\t{{ item.icon }}\n\t\t\t\t\t\t\t</mat-icon>\n\t\t\t\t\t\t\t<ng-container *ngIf=\"!item.isFlag\">\n\t\t\t\t\t\t\t\t<span *ngIf=\"!isBoolean(item.value)\" class=\"cqa-text-xs cqa-text-[#334155] cqa-font-regular\">\n\t\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<span *ngIf=\"isBoolean(item.value)\" class=\"cqa-text-xs cqa-text-[#475569] cqa-bg-[#F1F5F9] cqa-rounded-[4px] cqa-font-regular cqa-py-1 cqa-px-[6px]\"\n\t\t\t\t\t\t\t\t\t[ngStyle]=\"{ border: '1px solid #E2E8F0' }\">\n\t\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t<span *ngIf=\"item.isFlag\" class=\"cqa-text-xs cqa-rounded-[4px] cqa-font-medium cqa-py-1 cqa-px-[6px]\"\n\t\t\t\t\t\t\t\t[ngClass]=\"getValueClass(item)\"\n\t\t\t\t\t\t\t\t[ngStyle]=\"{ border: getValueBorder(item) }\">\n\t\t\t\t\t\t\t\t{{ getDisplayValue(item) }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</div>", styles: [] }]
|
|
5967
5982
|
}], propDecorators: { icon: [{
|
|
5968
5983
|
type: Input
|
|
5969
5984
|
}], title: [{
|
|
@@ -5980,7 +5995,6 @@ class CompareRunsComponent {
|
|
|
5980
5995
|
this.isLoadingRuns = false;
|
|
5981
5996
|
this.hasMoreRuns = false;
|
|
5982
5997
|
this.isComparingRuns = false;
|
|
5983
|
-
this.isTableDataLoading = false;
|
|
5984
5998
|
this.searchRuns = new EventEmitter();
|
|
5985
5999
|
this.loadMoreRuns = new EventEmitter();
|
|
5986
6000
|
this.compareRuns = new EventEmitter();
|
|
@@ -6123,7 +6137,8 @@ class CompareRunsComponent {
|
|
|
6123
6137
|
testDataSetName: data.testDataSetName,
|
|
6124
6138
|
device,
|
|
6125
6139
|
browser,
|
|
6126
|
-
platform
|
|
6140
|
+
platform,
|
|
6141
|
+
environment: data.environment
|
|
6127
6142
|
};
|
|
6128
6143
|
}
|
|
6129
6144
|
setupTableColumns() {
|
|
@@ -6390,10 +6405,10 @@ class CompareRunsComponent {
|
|
|
6390
6405
|
}
|
|
6391
6406
|
}
|
|
6392
6407
|
CompareRunsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CompareRunsComponent, deps: [{ token: i1$1.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6393
|
-
CompareRunsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CompareRunsComponent, selector: "cqa-compare-runs", inputs: { runs: "runs", comparisonData: "comparisonData", isLoadingRuns: "isLoadingRuns", hasMoreRuns: "hasMoreRuns", isComparingRuns: "isComparingRuns", isTableDataLoading: "isTableDataLoading" }, outputs: { searchRuns: "searchRuns", loadMoreRuns: "loadMoreRuns", compareRuns: "compareRuns" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3 sm:cqa-gap-4 cqa-px-3 sm:cqa-px-4 cqa-py-4 sm:cqa-py-6\" style=\"border-bottom: 1px solid #E4E4E4\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4 md:cqa-gap-16\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run A (Base)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runASelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n \n <div class=\"cqa-hidden md:cqa-flex cqa-items-center cqa-justify-center\" style=\"position: absolute; left: 50%; transform: translateX(-50%); top: 70px;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path d=\"M4.16669 10H15.8334\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M10 4.16699L15.8333 10.0003L10 15.8337\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n \n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run B (Compare)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runBSelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n </div>\n \n <ng-container *ngIf=\"showComparison\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4\">\n <div *ngIf=\"selectedRunA\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runAStatusBgColor\"\n [style.border-color]=\"runAStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunA.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runAStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runAStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunA.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunA.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Dataset: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.testDataSetName }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.device }}</span>\n </div>\n </div>\n </div>\n \n <div *ngIf=\"selectedRunB\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runBStatusBgColor\"\n [style.border-color]=\"runBStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunB.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runBStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runBStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunB.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunB.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Dataset: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.testDataSetName }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.device }}</span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n\n <div class=\"cqa-w-full cqa-flex cqa-justify-center\">\n <cqa-button \n variant=\"filled\" \n [disabled]=\"!canCompare\"\n (click)=\"onCompareClick()\">\n {{ isComparingRuns ? 'Comparing...' : 'Compare Runs' }}\n </cqa-button>\n </div>\n </div>\n\n <div *ngIf=\"showComparison && comparisonSummary && stepComparisons && stepComparisons.length > 0\" \n class=\"cqa-bg-white cqa-pt-3 cqa-pb-0 sm:cqa-pb-1 sm:cqa-pt-4 cqa-px-3 sm:cqa-px-6 cqa-flex cqa-items-center cqa-gap-3 sm:cqa-gap-4\">\n <p class=\"cqa-text-[12px] cqa-text-[#636363]\">Summary:</p>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 5.25H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M2.91669 8.75H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#0B0B0B]\">{{ comparisonSummary.unchanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Unchanged</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M12.6759 10.5003L8.00919 2.33363C7.90743 2.15408 7.75987 2.00474 7.58156 1.90083C7.40325 1.79693 7.20056 1.74219 6.99419 1.74219C6.78781 1.74219 6.58513 1.79693 6.40681 1.90083C6.2285 2.00474 6.08094 2.15408 5.97919 2.33363L1.31252 10.5003C1.20967 10.6784 1.15574 10.8806 1.15619 11.0863C1.15665 11.2919 1.21147 11.4939 1.31511 11.6715C1.41875 11.8492 1.56752 11.9963 1.74634 12.0979C1.92516 12.1996 2.12767 12.2521 2.33335 12.2503H11.6667C11.8714 12.2501 12.0724 12.196 12.2496 12.0935C12.4268 11.9911 12.5739 11.8438 12.6762 11.6664C12.7784 11.4891 12.8322 11.288 12.8322 11.0833C12.8321 10.8786 12.7782 10.6776 12.6759 10.5003Z\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 5.25V7.58333\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 9.91699H7.00583\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#E17100]\">{{ comparisonSummary.statusChanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Status Changed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 2.91699V11.0837\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#00A63E]\">{{ comparisonSummary.added }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Added</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#FB2C36\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#FB2C36]\">{{ comparisonSummary.removed }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Removed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M7.00002 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00002 1.16699C3.77836 1.16699 1.16669 3.77866 1.16669 7.00033C1.16669 10.222 3.77836 12.8337 7.00002 12.8337Z\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 3.5V7L9.33333 8.16667\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#155DFC]\">{{ comparisonSummary.timing }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Timing Changed</span>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-overflow-hidden\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"stepComparisons\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isTableDataLoading\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n </div>\n</div>\n\n", components: [{ type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }, { type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: TableTemplateComponent, selector: "cqa-table-template", inputs: ["searchPlaceholder", "searchValue", "showClear", "showSearchBar", "filterConfig", "showFilterPanel", "showFilterButton", "otherButtonLabel", "otherButtonVariant", "showOtherButton", "showActionButton", "showSettingsButton", "showAutoRefreshButton", "data", "isEmptyState", "emptyStateConfig", "actions", "chips", "filterApplied", "columns", "selectedAutoRefreshInterval", "pageIndex", "pageSize", "serverSidePagination", "totalElements", "isTableLoading", "isTableDataLoading"], outputs: ["onSearchChange", "onApplyFilterClick", "onResetFilterClick", "onClearAll", "removeChip", "pageChange", "onReload", "onAutoRefreshClick"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6408
|
+
CompareRunsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CompareRunsComponent, selector: "cqa-compare-runs", inputs: { runs: "runs", comparisonData: "comparisonData", isLoadingRuns: "isLoadingRuns", hasMoreRuns: "hasMoreRuns", isComparingRuns: "isComparingRuns" }, outputs: { searchRuns: "searchRuns", loadMoreRuns: "loadMoreRuns", compareRuns: "compareRuns" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3 sm:cqa-gap-4 cqa-py-3 sm:cqa-py-4 cqa-px-4 sm:cqa-px-6\" style=\"border-bottom: 1px solid #E4E4E4\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4 md:cqa-gap-16 cqa-relative\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run A (Base)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runASelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n \n <div class=\"cqa-hidden md:cqa-flex cqa-items-center cqa-justify-center\" style=\"position: absolute; left: 50%; transform: translateX(-50%); top: 30px;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path d=\"M4.16669 10H15.8334\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M10 4.16699L15.8333 10.0003L10 15.8337\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n \n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run B (Compare)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runBSelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n </div>\n \n <ng-container *ngIf=\"selectedRunA || selectedRunB\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4\">\n <div *ngIf=\"selectedRunA\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runAStatusBgColor\"\n [style.border-color]=\"runAStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunA.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runAStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runAStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunA.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunA.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Env: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.environment || '\u2014' }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.device }}</span>\n </div>\n </div>\n </div>\n \n <div *ngIf=\"selectedRunB\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runBStatusBgColor\"\n [style.border-color]=\"runBStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunB.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runBStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runBStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunB.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunB.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Env: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.environment || '\u2014' }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.device }}</span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n\n <div class=\"cqa-w-full cqa-flex cqa-justify-center\">\n <cqa-button \n variant=\"filled\" \n [disabled]=\"!canCompare\"\n (click)=\"onCompareClick()\">\n {{ isComparingRuns ? 'Comparing...' : 'Compare Runs' }}\n </cqa-button>\n </div>\n </div>\n\n <div *ngIf=\"showComparison && comparisonSummary && stepComparisons && stepComparisons.length > 0\" \n class=\"cqa-bg-white cqa-pt-3 cqa-pb-0 sm:cqa-pb-1 sm:cqa-pt-4 cqa-px-3 sm:cqa-px-6 cqa-flex cqa-items-center cqa-gap-3 sm:cqa-gap-4\">\n <p class=\"cqa-text-[12px] cqa-text-[#636363]\">Summary:</p>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 5.25H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M2.91669 8.75H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#0B0B0B]\">{{ comparisonSummary.unchanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Unchanged</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M12.6759 10.5003L8.00919 2.33363C7.90743 2.15408 7.75987 2.00474 7.58156 1.90083C7.40325 1.79693 7.20056 1.74219 6.99419 1.74219C6.78781 1.74219 6.58513 1.79693 6.40681 1.90083C6.2285 2.00474 6.08094 2.15408 5.97919 2.33363L1.31252 10.5003C1.20967 10.6784 1.15574 10.8806 1.15619 11.0863C1.15665 11.2919 1.21147 11.4939 1.31511 11.6715C1.41875 11.8492 1.56752 11.9963 1.74634 12.0979C1.92516 12.1996 2.12767 12.2521 2.33335 12.2503H11.6667C11.8714 12.2501 12.0724 12.196 12.2496 12.0935C12.4268 11.9911 12.5739 11.8438 12.6762 11.6664C12.7784 11.4891 12.8322 11.288 12.8322 11.0833C12.8321 10.8786 12.7782 10.6776 12.6759 10.5003Z\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 5.25V7.58333\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 9.91699H7.00583\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#E17100]\">{{ comparisonSummary.statusChanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Status Changed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 2.91699V11.0837\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#00A63E]\">{{ comparisonSummary.added }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Added</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#FB2C36\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#FB2C36]\">{{ comparisonSummary.removed }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Removed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M7.00002 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00002 1.16699C3.77836 1.16699 1.16669 3.77866 1.16669 7.00033C1.16669 10.222 3.77836 12.8337 7.00002 12.8337Z\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 3.5V7L9.33333 8.16667\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#155DFC]\">{{ comparisonSummary.timing }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Timing Changed</span>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-overflow-hidden\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"stepComparisons\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isComparingRuns\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n </div>\n</div>\n\n", components: [{ type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }, { type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: TableTemplateComponent, selector: "cqa-table-template", inputs: ["searchPlaceholder", "searchValue", "showClear", "showSearchBar", "filterConfig", "showFilterPanel", "showFilterButton", "otherButtonLabel", "otherButtonVariant", "showOtherButton", "showActionButton", "showSettingsButton", "showAutoRefreshButton", "data", "isEmptyState", "emptyStateConfig", "actions", "chips", "filterApplied", "columns", "selectedAutoRefreshInterval", "pageIndex", "pageSize", "serverSidePagination", "totalElements", "isTableLoading", "isTableDataLoading"], outputs: ["onSearchChange", "onApplyFilterClick", "onResetFilterClick", "onClearAll", "removeChip", "pageChange", "onReload", "onAutoRefreshClick"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6394
6409
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CompareRunsComponent, decorators: [{
|
|
6395
6410
|
type: Component,
|
|
6396
|
-
args: [{ selector: 'cqa-compare-runs', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3 sm:cqa-gap-4 cqa-px-3 sm:cqa-px-4 cqa-py-4 sm:cqa-py-6\" style=\"border-bottom: 1px solid #E4E4E4\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4 md:cqa-gap-16\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run A (Base)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runASelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n \n <div class=\"cqa-hidden md:cqa-flex cqa-items-center cqa-justify-center\" style=\"position: absolute; left: 50%; transform: translateX(-50%); top: 70px;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path d=\"M4.16669 10H15.8334\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M10 4.16699L15.8333 10.0003L10 15.8337\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n \n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run B (Compare)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runBSelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n </div>\n \n <ng-container *ngIf=\"showComparison\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4\">\n <div *ngIf=\"selectedRunA\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runAStatusBgColor\"\n [style.border-color]=\"runAStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunA.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runAStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runAStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunA.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunA.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Dataset: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.testDataSetName }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.device }}</span>\n </div>\n </div>\n </div>\n \n <div *ngIf=\"selectedRunB\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runBStatusBgColor\"\n [style.border-color]=\"runBStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunB.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runBStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runBStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunB.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunB.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Dataset: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.testDataSetName }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.device }}</span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n\n <div class=\"cqa-w-full cqa-flex cqa-justify-center\">\n <cqa-button \n variant=\"filled\" \n [disabled]=\"!canCompare\"\n (click)=\"onCompareClick()\">\n {{ isComparingRuns ? 'Comparing...' : 'Compare Runs' }}\n </cqa-button>\n </div>\n </div>\n\n <div *ngIf=\"showComparison && comparisonSummary && stepComparisons && stepComparisons.length > 0\" \n class=\"cqa-bg-white cqa-pt-3 cqa-pb-0 sm:cqa-pb-1 sm:cqa-pt-4 cqa-px-3 sm:cqa-px-6 cqa-flex cqa-items-center cqa-gap-3 sm:cqa-gap-4\">\n <p class=\"cqa-text-[12px] cqa-text-[#636363]\">Summary:</p>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 5.25H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M2.91669 8.75H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#0B0B0B]\">{{ comparisonSummary.unchanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Unchanged</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M12.6759 10.5003L8.00919 2.33363C7.90743 2.15408 7.75987 2.00474 7.58156 1.90083C7.40325 1.79693 7.20056 1.74219 6.99419 1.74219C6.78781 1.74219 6.58513 1.79693 6.40681 1.90083C6.2285 2.00474 6.08094 2.15408 5.97919 2.33363L1.31252 10.5003C1.20967 10.6784 1.15574 10.8806 1.15619 11.0863C1.15665 11.2919 1.21147 11.4939 1.31511 11.6715C1.41875 11.8492 1.56752 11.9963 1.74634 12.0979C1.92516 12.1996 2.12767 12.2521 2.33335 12.2503H11.6667C11.8714 12.2501 12.0724 12.196 12.2496 12.0935C12.4268 11.9911 12.5739 11.8438 12.6762 11.6664C12.7784 11.4891 12.8322 11.288 12.8322 11.0833C12.8321 10.8786 12.7782 10.6776 12.6759 10.5003Z\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 5.25V7.58333\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 9.91699H7.00583\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#E17100]\">{{ comparisonSummary.statusChanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Status Changed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 2.91699V11.0837\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#00A63E]\">{{ comparisonSummary.added }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Added</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#FB2C36\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#FB2C36]\">{{ comparisonSummary.removed }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Removed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M7.00002 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00002 1.16699C3.77836 1.16699 1.16669 3.77866 1.16669 7.00033C1.16669 10.222 3.77836 12.8337 7.00002 12.8337Z\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 3.5V7L9.33333 8.16667\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#155DFC]\">{{ comparisonSummary.timing }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Timing Changed</span>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-overflow-hidden\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"stepComparisons\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isTableDataLoading\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n </div>\n</div>\n\n", styles: [] }]
|
|
6411
|
+
args: [{ selector: 'cqa-compare-runs', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3 sm:cqa-gap-4 cqa-py-3 sm:cqa-py-4 cqa-px-4 sm:cqa-px-6\" style=\"border-bottom: 1px solid #E4E4E4\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4 md:cqa-gap-16 cqa-relative\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run A (Base)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runASelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n \n <div class=\"cqa-hidden md:cqa-flex cqa-items-center cqa-justify-center\" style=\"position: absolute; left: 50%; transform: translateX(-50%); top: 30px;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path d=\"M4.16669 10H15.8334\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M10 4.16699L15.8333 10.0003L10 15.8337\" stroke=\"#636363\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n \n <div class=\"cqa-flex cqa-flex-col cqa-gap-1.5\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#636363]\">Run B (Compare)</span>\n <cqa-dynamic-select \n [form]=\"form\" \n [config]=\"runBSelectConfig\"\n (searchChange)=\"onSearchChange($event)\"\n (loadMore)=\"onLoadMore($event)\">\n </cqa-dynamic-select>\n </div>\n </div>\n \n <ng-container *ngIf=\"selectedRunA || selectedRunB\">\n <div class=\"cqa-grid cqa-grid-cols-1 md:cqa-grid-cols-2 cqa-gap-4\">\n <div *ngIf=\"selectedRunA\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runAStatusBgColor\"\n [style.border-color]=\"runAStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunA.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runAStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runAStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunA.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunA.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Env: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.environment || '\u2014' }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunA.device }}</span>\n </div>\n </div>\n </div>\n \n <div *ngIf=\"selectedRunB\" \n class=\"cqa-bg-white cqa-rounded-lg cqa-p-3 cqa-border cqa-border-solid\"\n [style.background-color]=\"runBStatusBgColor\"\n [style.border-color]=\"runBStatusBorderColor\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-2\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[12px] cqa-font-semibold cqa-text-[#0B0B0B]\">Run #{{ selectedRunB.id }}</span>\n </div>\n <span class=\"cqa-inline-flex cqa-items-center cqa-justify-center cqa-px-2 cqa-py-0.5 cqa-rounded-full cqa-text-[10px] cqa-font-medium\"\n [style.background-color]=\"runBStatusColor\"\n [style.color]=\"'#FFFFFF'\">\n {{ runBStatusLabel }}\n </span>\n </div>\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Time: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatTime(selectedRunB.startTime) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Duration: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ formatDurationString(selectedRunB.duration) }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Env: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.environment || '\u2014' }}</span>\n </div>\n <div class=\"cqa-flex cqa-items-center cqa-gap-1\">\n <span class=\"cqa-text-xs cqa-text-[#636363]\">Device: </span>\n <span class=\"cqa-text-xs cqa-text-[#0B0B0B] cqa-font-medium\">{{ selectedRunB.device }}</span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n\n <div class=\"cqa-w-full cqa-flex cqa-justify-center\">\n <cqa-button \n variant=\"filled\" \n [disabled]=\"!canCompare\"\n (click)=\"onCompareClick()\">\n {{ isComparingRuns ? 'Comparing...' : 'Compare Runs' }}\n </cqa-button>\n </div>\n </div>\n\n <div *ngIf=\"showComparison && comparisonSummary && stepComparisons && stepComparisons.length > 0\" \n class=\"cqa-bg-white cqa-pt-3 cqa-pb-0 sm:cqa-pb-1 sm:cqa-pt-4 cqa-px-3 sm:cqa-px-6 cqa-flex cqa-items-center cqa-gap-3 sm:cqa-gap-4\">\n <p class=\"cqa-text-[12px] cqa-text-[#636363]\">Summary:</p>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 5.25H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M2.91669 8.75H11.0834\" stroke=\"#636363\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#0B0B0B]\">{{ comparisonSummary.unchanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Unchanged</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M12.6759 10.5003L8.00919 2.33363C7.90743 2.15408 7.75987 2.00474 7.58156 1.90083C7.40325 1.79693 7.20056 1.74219 6.99419 1.74219C6.78781 1.74219 6.58513 1.79693 6.40681 1.90083C6.2285 2.00474 6.08094 2.15408 5.97919 2.33363L1.31252 10.5003C1.20967 10.6784 1.15574 10.8806 1.15619 11.0863C1.15665 11.2919 1.21147 11.4939 1.31511 11.6715C1.41875 11.8492 1.56752 11.9963 1.74634 12.0979C1.92516 12.1996 2.12767 12.2521 2.33335 12.2503H11.6667C11.8714 12.2501 12.0724 12.196 12.2496 12.0935C12.4268 11.9911 12.5739 11.8438 12.6762 11.6664C12.7784 11.4891 12.8322 11.288 12.8322 11.0833C12.8321 10.8786 12.7782 10.6776 12.6759 10.5003Z\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 5.25V7.58333\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 9.91699H7.00583\" stroke=\"#FD9A00\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#E17100]\">{{ comparisonSummary.statusChanged }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Status Changed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 2.91699V11.0837\" stroke=\"#00C950\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#00A63E]\">{{ comparisonSummary.added }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Added</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M2.91669 7H11.0834\" stroke=\"#FB2C36\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#FB2C36]\">{{ comparisonSummary.removed }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Removed</span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5\">\n <mat-icon class=\"cqa-flex-shrink-0 cqa-w-[14px] cqa-h-[14px] cqa-text-sm\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\n <path d=\"M7.00002 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00002 1.16699C3.77836 1.16699 1.16669 3.77866 1.16669 7.00033C1.16669 10.222 3.77836 12.8337 7.00002 12.8337Z\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M7 3.5V7L9.33333 8.16667\" stroke=\"#2B7FFF\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </mat-icon>\n <span class=\"cqa-text-sm cqa-font-semibold leading-normal cqa-text-[#155DFC]\">{{ comparisonSummary.timing }}</span>\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#6B7280]\">Timing Changed</span>\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-white cqa-rounded-lg cqa-overflow-hidden\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"stepComparisons\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isComparingRuns\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n </div>\n</div>\n\n", styles: [] }]
|
|
6397
6412
|
}], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { runs: [{
|
|
6398
6413
|
type: Input
|
|
6399
6414
|
}], comparisonData: [{
|
|
@@ -6404,8 +6419,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
6404
6419
|
type: Input
|
|
6405
6420
|
}], isComparingRuns: [{
|
|
6406
6421
|
type: Input
|
|
6407
|
-
}], isTableDataLoading: [{
|
|
6408
|
-
type: Input
|
|
6409
6422
|
}], searchRuns: [{
|
|
6410
6423
|
type: Output
|
|
6411
6424
|
}], loadMoreRuns: [{
|
|
@@ -6414,6 +6427,352 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
6414
6427
|
type: Output
|
|
6415
6428
|
}] } });
|
|
6416
6429
|
|
|
6430
|
+
class IterationsLoopComponent {
|
|
6431
|
+
constructor() {
|
|
6432
|
+
this.iterations = [];
|
|
6433
|
+
this.isTableDataLoading = false;
|
|
6434
|
+
this.tableColumns = [];
|
|
6435
|
+
this.pageIndex = 0;
|
|
6436
|
+
this.pageSize = 5;
|
|
6437
|
+
this.emptyStateConfig = {
|
|
6438
|
+
title: 'No Iterations',
|
|
6439
|
+
description: 'There are no iterations to display for this loop.',
|
|
6440
|
+
imageUrl: EMPTY_STATE_IMAGES.DASHBOARD,
|
|
6441
|
+
actions: []
|
|
6442
|
+
};
|
|
6443
|
+
}
|
|
6444
|
+
ngOnInit() {
|
|
6445
|
+
this.setupTableColumns();
|
|
6446
|
+
}
|
|
6447
|
+
ngOnChanges(changes) {
|
|
6448
|
+
if (changes['iterations']) {
|
|
6449
|
+
this.pageIndex = 0;
|
|
6450
|
+
}
|
|
6451
|
+
}
|
|
6452
|
+
setupTableColumns() {
|
|
6453
|
+
this.tableColumns = [
|
|
6454
|
+
{
|
|
6455
|
+
fieldId: 'index',
|
|
6456
|
+
fieldName: '#',
|
|
6457
|
+
fieldValue: 'index',
|
|
6458
|
+
isShow: true,
|
|
6459
|
+
weight: 0.5,
|
|
6460
|
+
render: (row) => {
|
|
6461
|
+
return `<span class="cqa-text-[16px] cqa-text-[#0A0A0A] cqa-font-regular">${row.index}</span>`;
|
|
6462
|
+
}
|
|
6463
|
+
},
|
|
6464
|
+
{
|
|
6465
|
+
fieldId: 'datasetId',
|
|
6466
|
+
fieldName: 'Dataset ID',
|
|
6467
|
+
fieldValue: 'datasetId',
|
|
6468
|
+
isShow: true,
|
|
6469
|
+
weight: 1.5,
|
|
6470
|
+
render: (row) => {
|
|
6471
|
+
return `<span class="cqa-text-sm cqa-text-[#0A0A0A] cqa-font-regular">${row.datasetId}</span>`;
|
|
6472
|
+
}
|
|
6473
|
+
},
|
|
6474
|
+
{
|
|
6475
|
+
fieldId: 'variables',
|
|
6476
|
+
fieldName: 'Variables',
|
|
6477
|
+
isShow: true,
|
|
6478
|
+
weight: 2,
|
|
6479
|
+
render: (row) => {
|
|
6480
|
+
const variableEntries = Object.entries(row.variables || {});
|
|
6481
|
+
const variablesHtml = variableEntries.map(([key, value], index) => {
|
|
6482
|
+
return `<div class="cqa-flex cqa-items-center cqa-gap-0.5 ${index === variableEntries.length - 1 ? 'cqa-mb-0' : 'cqa-mb-1'}">
|
|
6483
|
+
<span class="cqa-px-1 cqa-text-[12px] cqa-text-[#4A5565] cqa-bg-[#F3F4F6] cqa-rounded-[4px]">${key}:</span>
|
|
6484
|
+
<span class="cqa-text-sm cqa-text-[#4A5565] cqa-font-medium">${value}</span>
|
|
6485
|
+
</div>`;
|
|
6486
|
+
}).join('');
|
|
6487
|
+
return `<div class="cqa-flex cqa-flex-col">${variablesHtml}</div>`;
|
|
6488
|
+
}
|
|
6489
|
+
},
|
|
6490
|
+
{
|
|
6491
|
+
fieldId: 'status',
|
|
6492
|
+
fieldName: 'Status',
|
|
6493
|
+
fieldValue: 'status',
|
|
6494
|
+
isShow: true,
|
|
6495
|
+
weight: 1,
|
|
6496
|
+
render: (row) => {
|
|
6497
|
+
return this.renderStatusIcon(row.status);
|
|
6498
|
+
}
|
|
6499
|
+
},
|
|
6500
|
+
{
|
|
6501
|
+
fieldId: 'duration',
|
|
6502
|
+
fieldName: 'Duration',
|
|
6503
|
+
isShow: true,
|
|
6504
|
+
weight: 1,
|
|
6505
|
+
render: (row) => {
|
|
6506
|
+
return `
|
|
6507
|
+
<div class="cqa-flex cqa-items-center cqa-gap-1">
|
|
6508
|
+
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
6509
|
+
<path d="M7.00002 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00002 1.16699C3.77836 1.16699 1.16669 3.77866 1.16669 7.00033C1.16669 10.222 3.77836 12.8337 7.00002 12.8337Z" stroke="#636363" stroke-width="1.16667" stroke-linecap="round" stroke-linejoin="round"/>
|
|
6510
|
+
<path d="M7 3.5V7L9.33333 8.16667" stroke="#636363" stroke-width="1.16667" stroke-linecap="round" stroke-linejoin="round"/>
|
|
6511
|
+
</svg>
|
|
6512
|
+
<span class="cqa-text-xs cqa-text-[#4A5565]">${this.formatDuration(row.duration)}</span>
|
|
6513
|
+
</div>
|
|
6514
|
+
`;
|
|
6515
|
+
}
|
|
6516
|
+
}
|
|
6517
|
+
];
|
|
6518
|
+
}
|
|
6519
|
+
renderStatusIcon(status) {
|
|
6520
|
+
const upperStatus = status.toUpperCase();
|
|
6521
|
+
if (upperStatus === 'PASS') {
|
|
6522
|
+
return `
|
|
6523
|
+
<div class="cqa-flex cqa-items-center cqa-gap-1.5">
|
|
6524
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
|
|
6525
|
+
<circle cx="8" cy="8" r="7" stroke="#008236" stroke-width="1.5" fill="none"/>
|
|
6526
|
+
<path d="M5.5 8L7 9.5L10.5 6" stroke="#008236" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
6527
|
+
</svg>
|
|
6528
|
+
<span class="cqa-rounded-[4px] cqa-leading-4 cqa-px-2 cqa-py-0.5 cqa-bg-[#DCFCE7] cqa-text-xs cqa-text-[#008236]">Pass</span>
|
|
6529
|
+
</div>
|
|
6530
|
+
`;
|
|
6531
|
+
}
|
|
6532
|
+
else if (upperStatus === 'FAIL') {
|
|
6533
|
+
return `
|
|
6534
|
+
<div class="cqa-flex cqa-items-center cqa-gap-1.5">
|
|
6535
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
|
|
6536
|
+
<circle cx="8" cy="8" r="7" stroke="#C10007" stroke-width="1.5" fill="none"/>
|
|
6537
|
+
<path d="M10 6L6 10M6 6L10 10" stroke="#C10007" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
6538
|
+
</svg>
|
|
6539
|
+
<span class="cqa-rounded-[4px] cqa-leading-4 cqa-px-2 cqa-py-0.5 cqa-bg-[#FFE2E2] cqa-text-xs cqa-text-[#C10007]">Fail</span>
|
|
6540
|
+
</div>
|
|
6541
|
+
`;
|
|
6542
|
+
}
|
|
6543
|
+
else if (upperStatus === 'IN_PROGRESS') {
|
|
6544
|
+
return `
|
|
6545
|
+
<div class="cqa-flex cqa-items-center cqa-gap-1.5">
|
|
6546
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
|
|
6547
|
+
<circle cx="8" cy="8" r="7" stroke="#3B82F6" stroke-width="1.5" fill="none"/>
|
|
6548
|
+
</svg>
|
|
6549
|
+
<span class="cqa-rounded-[4px] cqa-leading-4 cqa-px-2 cqa-py-0.5 cqa-bg-[#EFF6FF] cqa-text-xs cqa-text-[#3B82F6]">In Progress</span>
|
|
6550
|
+
</div>
|
|
6551
|
+
`;
|
|
6552
|
+
}
|
|
6553
|
+
else {
|
|
6554
|
+
return `<span class="cqa-rounded-[4px] cqa-leading-4 cqa-px-2 cqa-py-0.5 cqa-text-xs cqa-text-[#9CA3AF]">—</span>`;
|
|
6555
|
+
}
|
|
6556
|
+
}
|
|
6557
|
+
formatDuration(milliseconds) {
|
|
6558
|
+
const seconds = milliseconds / 1000;
|
|
6559
|
+
if (seconds < 60) {
|
|
6560
|
+
return `${seconds.toFixed(1)}s`;
|
|
6561
|
+
}
|
|
6562
|
+
const minutes = Math.floor(seconds / 60);
|
|
6563
|
+
const remainingSeconds = Math.floor(seconds % 60);
|
|
6564
|
+
return `${minutes}m ${remainingSeconds}s`;
|
|
6565
|
+
}
|
|
6566
|
+
onPageChange(event) {
|
|
6567
|
+
this.pageIndex = event.pageIndex;
|
|
6568
|
+
this.pageSize = event.pageSize;
|
|
6569
|
+
}
|
|
6570
|
+
get isEmptyState() {
|
|
6571
|
+
return !this.iterations || this.iterations.length === 0;
|
|
6572
|
+
}
|
|
6573
|
+
get computedSummary() {
|
|
6574
|
+
if (this.summary) {
|
|
6575
|
+
return this.summary;
|
|
6576
|
+
}
|
|
6577
|
+
const passed = this.iterations.filter(i => i.status === 'PASS').length;
|
|
6578
|
+
const failed = this.iterations.filter(i => i.status === 'FAIL').length;
|
|
6579
|
+
return {
|
|
6580
|
+
totalIterations: this.iterations.length,
|
|
6581
|
+
passed,
|
|
6582
|
+
failed
|
|
6583
|
+
};
|
|
6584
|
+
}
|
|
6585
|
+
}
|
|
6586
|
+
IterationsLoopComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: IterationsLoopComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6587
|
+
IterationsLoopComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: IterationsLoopComponent, selector: "cqa-iterations-loop", inputs: { iterations: "iterations", summary: "summary", isTableDataLoading: "isTableDataLoading" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-bg-white\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"iterations\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isTableDataLoading\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n <div *ngIf=\"!isEmptyState\" class=\"cqa-p-[17px] cqa-mt-6 cqa-bg-[#FBFCFF] cqa-rounded-[5px]\" style=\"border: 1px solid #E5E5E5;\">\n <h4 class=\"cqa-text-[16px] cqa-text-[#111827] cqa-mb-3\">Summary</h4>\n <div class=\"cqa-grid cqa-grid-cols-3 cqa-gap-4\">\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Total Iterations</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#0B0B0B]\">{{ computedSummary.totalIterations }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Passed</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#00C950]\">{{ computedSummary.passed }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Failed</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#FB2C36]\">{{ computedSummary.failed }}</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n", components: [{ type: TableTemplateComponent, selector: "cqa-table-template", inputs: ["searchPlaceholder", "searchValue", "showClear", "showSearchBar", "filterConfig", "showFilterPanel", "showFilterButton", "otherButtonLabel", "otherButtonVariant", "showOtherButton", "showActionButton", "showSettingsButton", "showAutoRefreshButton", "data", "isEmptyState", "emptyStateConfig", "actions", "chips", "filterApplied", "columns", "selectedAutoRefreshInterval", "pageIndex", "pageSize", "serverSidePagination", "totalElements", "isTableLoading", "isTableDataLoading"], outputs: ["onSearchChange", "onApplyFilterClick", "onResetFilterClick", "onClearAll", "removeChip", "pageChange", "onReload", "onAutoRefreshClick"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6588
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: IterationsLoopComponent, decorators: [{
|
|
6589
|
+
type: Component,
|
|
6590
|
+
args: [{ selector: 'cqa-iterations-loop', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-bg-white\">\n <cqa-table-template\n [columns]=\"tableColumns\"\n [data]=\"iterations\"\n [pageIndex]=\"pageIndex\"\n [pageSize]=\"pageSize\"\n [isEmptyState]=\"isEmptyState\"\n [emptyStateConfig]=\"emptyStateConfig\"\n [isTableDataLoading]=\"isTableDataLoading\"\n [showSearchBar]=\"false\"\n [showFilterButton]=\"false\"\n [showSettingsButton]=\"false\"\n [showAutoRefreshButton]=\"false\"\n [showOtherButton]=\"false\"\n [showFilterPanel]=\"false\"\n [serverSidePagination]=\"false\"\n (pageChange)=\"onPageChange($event)\">\n </cqa-table-template>\n </div>\n\n <div *ngIf=\"!isEmptyState\" class=\"cqa-p-[17px] cqa-mt-6 cqa-bg-[#FBFCFF] cqa-rounded-[5px]\" style=\"border: 1px solid #E5E5E5;\">\n <h4 class=\"cqa-text-[16px] cqa-text-[#111827] cqa-mb-3\">Summary</h4>\n <div class=\"cqa-grid cqa-grid-cols-3 cqa-gap-4\">\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Total Iterations</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#0B0B0B]\">{{ computedSummary.totalIterations }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Passed</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#00C950]\">{{ computedSummary.passed }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col\">\n <span class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mb-1\">Failed</span>\n <span class=\"cqa-text-[22px] cqa-leading-[28px] cqa-font-semibold cqa-text-[#FB2C36]\">{{ computedSummary.failed }}</span>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n", styles: [] }]
|
|
6591
|
+
}], propDecorators: { iterations: [{
|
|
6592
|
+
type: Input
|
|
6593
|
+
}], summary: [{
|
|
6594
|
+
type: Input
|
|
6595
|
+
}], isTableDataLoading: [{
|
|
6596
|
+
type: Input
|
|
6597
|
+
}] } });
|
|
6598
|
+
|
|
6599
|
+
class FailedStepCardComponent {
|
|
6600
|
+
get headerTitle() {
|
|
6601
|
+
if (this.failedStepData?.stepTitle) {
|
|
6602
|
+
return `Failed at Step ${this.failedStepData.failed_step_index}: ${this.failedStepData.stepTitle}`;
|
|
6603
|
+
}
|
|
6604
|
+
return `Failed at Step ${this.failedStepData?.failed_step_index || ''}`;
|
|
6605
|
+
}
|
|
6606
|
+
get errorText() {
|
|
6607
|
+
return this.failedStepData?.errorMessage || this.failedStepData?.reason || 'An error occurred';
|
|
6608
|
+
}
|
|
6609
|
+
get videoTimestamp() {
|
|
6610
|
+
return this.failedStepData?.timestamp || '00:00';
|
|
6611
|
+
}
|
|
6612
|
+
get durationText() {
|
|
6613
|
+
return this.failedStepData?.duration || '0s';
|
|
6614
|
+
}
|
|
6615
|
+
get expectedResult() {
|
|
6616
|
+
return this.failedStepData?.expected_result || '';
|
|
6617
|
+
}
|
|
6618
|
+
get actualResult() {
|
|
6619
|
+
return this.failedStepData?.actual_result || '';
|
|
6620
|
+
}
|
|
6621
|
+
get suggestions() {
|
|
6622
|
+
return this.failedStepData?.suggestions || '';
|
|
6623
|
+
}
|
|
6624
|
+
get hasSuggestions() {
|
|
6625
|
+
return !!this.failedStepData?.suggestions && this.failedStepData.suggestions.trim().length > 0;
|
|
6626
|
+
}
|
|
6627
|
+
getFormattedSuggestions() {
|
|
6628
|
+
if (!this.suggestions)
|
|
6629
|
+
return [];
|
|
6630
|
+
return this.suggestions.split('\n').filter(s => s.trim().length > 0);
|
|
6631
|
+
}
|
|
6632
|
+
}
|
|
6633
|
+
FailedStepCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedStepCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6634
|
+
FailedStepCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedStepCardComponent, selector: "cqa-failed-step-card", inputs: { failedStepData: "failedStepData" }, ngImport: i0, template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-bg-[#FEF2F2] cqa-p-[17px] cqa-rounded-lg cqa-overflow-hidden cqa-flex cqa-flex-col cqa-gap-3\" style=\"border: 1px solid #FECACA;\">\n <div>\n <h3 class=\"cqa-text-sm cqa-leading-[18px] cqa-text-[#111827] cqa-mb-1\">{{ headerTitle }}</h3>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3 cqa-text-xs\">\n <span class=\"cqa-text-[12px] cqa-text-[#B91C1C]\">Error: {{ errorText }}</span>\n <span class=\"cqa-text-[#636363]\">\u2022</span>\n <span class=\"cqa-text-[#636363]\">Video timestamp: {{ videoTimestamp }}</span>\n <span class=\"cqa-text-[#636363]\">\u2022</span>\n <span class=\"cqa-text-[#636363]\">Duration: {{ durationText }}</span>\n </div>\n </div>\n\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-0 cqa-rounded-[4px] cqa-overflow-hidden\" style=\"border: 1px solid #E5E7EB\">\n <div class=\"cqa-bg-white cqa-px-2 cqa-py-1 md:cqa-border-r cqa-flex cqa-flex-col cqa-h-[114px]\" style=\"border-right: 1px solid #E5E7EB\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#9CA3AF] cqa-uppercase cqa-tracking-wide\">EXPECTED</span>\n <div class=\"cqa-text-[10px] cqa-text-[#0B0B0B] cqa-leading-relaxed cqa-h-[91px] cqa-max-h-[91px] cqa-overflow-y-auto cqa-font-medium\">\n {{ expectedResult }}\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-[#FFF9F9] cqa-px-2 cqa-py-1 cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#9CA3AF] cqa-uppercase cqa-tracking-wide\">ACTUAL</span>\n <div class=\"cqa-text-[10px] cqa-text-[#C10007] cqa-leading-relaxed cqa-h-[91px] cqa-max-h-[91px] cqa-overflow-y-auto cqa-font-medium\">\n {{ actualResult }}\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n" });
|
|
6635
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedStepCardComponent, decorators: [{
|
|
6636
|
+
type: Component,
|
|
6637
|
+
args: [{ selector: 'cqa-failed-step-card', template: "<div class=\"cqa-ui-root\" style=\"display: block; width: 100%;\">\n <div class=\"cqa-bg-[#FEF2F2] cqa-p-[17px] cqa-rounded-lg cqa-overflow-hidden cqa-flex cqa-flex-col cqa-gap-3\" style=\"border: 1px solid #FECACA;\">\n <div>\n <h3 class=\"cqa-text-sm cqa-leading-[18px] cqa-text-[#111827] cqa-mb-1\">{{ headerTitle }}</h3>\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3 cqa-text-xs\">\n <span class=\"cqa-text-[12px] cqa-text-[#B91C1C]\">Error: {{ errorText }}</span>\n <span class=\"cqa-text-[#636363]\">\u2022</span>\n <span class=\"cqa-text-[#636363]\">Video timestamp: {{ videoTimestamp }}</span>\n <span class=\"cqa-text-[#636363]\">\u2022</span>\n <span class=\"cqa-text-[#636363]\">Duration: {{ durationText }}</span>\n </div>\n </div>\n\n <div class=\"cqa-grid cqa-grid-cols-2 cqa-gap-0 cqa-rounded-[4px] cqa-overflow-hidden\" style=\"border: 1px solid #E5E7EB\">\n <div class=\"cqa-bg-white cqa-px-2 cqa-py-1 md:cqa-border-r cqa-flex cqa-flex-col cqa-h-[114px]\" style=\"border-right: 1px solid #E5E7EB\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#9CA3AF] cqa-uppercase cqa-tracking-wide\">EXPECTED</span>\n <div class=\"cqa-text-[10px] cqa-text-[#0B0B0B] cqa-leading-relaxed cqa-h-[91px] cqa-max-h-[91px] cqa-overflow-y-auto cqa-font-medium\">\n {{ expectedResult }}\n </div>\n </div>\n </div>\n\n <div class=\"cqa-bg-[#FFF9F9] cqa-px-2 cqa-py-1 cqa-flex cqa-flex-col\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1\">\n <span class=\"cqa-text-[10px] cqa-font-semibold cqa-text-[#9CA3AF] cqa-uppercase cqa-tracking-wide\">ACTUAL</span>\n <div class=\"cqa-text-[10px] cqa-text-[#C10007] cqa-leading-relaxed cqa-h-[91px] cqa-max-h-[91px] cqa-overflow-y-auto cqa-font-medium\">\n {{ actualResult }}\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n", styles: [] }]
|
|
6638
|
+
}], propDecorators: { failedStepData: [{
|
|
6639
|
+
type: Input
|
|
6640
|
+
}] } });
|
|
6641
|
+
|
|
6642
|
+
class CustomInputComponent {
|
|
6643
|
+
constructor() {
|
|
6644
|
+
this.label = '';
|
|
6645
|
+
this.type = 'text';
|
|
6646
|
+
this.placeholder = '';
|
|
6647
|
+
this.value = '';
|
|
6648
|
+
this.disabled = false;
|
|
6649
|
+
this.errors = [];
|
|
6650
|
+
this.required = false;
|
|
6651
|
+
this.ariaLabel = '';
|
|
6652
|
+
this.size = 'md';
|
|
6653
|
+
this.fullWidth = false;
|
|
6654
|
+
this.showCharCount = false;
|
|
6655
|
+
this.valueChange = new EventEmitter();
|
|
6656
|
+
this.blurred = new EventEmitter();
|
|
6657
|
+
this.focused = new EventEmitter();
|
|
6658
|
+
this.enterPressed = new EventEmitter();
|
|
6659
|
+
this.inputValue = '';
|
|
6660
|
+
this.isFocused = false;
|
|
6661
|
+
}
|
|
6662
|
+
ngOnChanges(changes) {
|
|
6663
|
+
if (changes['value'] && changes['value'].currentValue !== undefined) {
|
|
6664
|
+
let newValue = changes['value'].currentValue ?? '';
|
|
6665
|
+
if (this.maxLength && newValue.length > this.maxLength) {
|
|
6666
|
+
newValue = newValue.substring(0, this.maxLength);
|
|
6667
|
+
}
|
|
6668
|
+
if (newValue !== this.inputValue) {
|
|
6669
|
+
this.inputValue = newValue;
|
|
6670
|
+
}
|
|
6671
|
+
}
|
|
6672
|
+
}
|
|
6673
|
+
get hasError() {
|
|
6674
|
+
return this.errors && this.errors.length > 0;
|
|
6675
|
+
}
|
|
6676
|
+
get inputSizeClasses() {
|
|
6677
|
+
switch (this.size) {
|
|
6678
|
+
case 'sm':
|
|
6679
|
+
return 'cqa-px-3 cqa-py-2 cqa-text-xs';
|
|
6680
|
+
case 'md':
|
|
6681
|
+
return 'cqa-px-4 cqa-py-2.5 cqa-text-sm';
|
|
6682
|
+
case 'lg':
|
|
6683
|
+
return 'cqa-px-5 cqa-py-3 cqa-text-base';
|
|
6684
|
+
default:
|
|
6685
|
+
return 'cqa-px-4 cqa-py-2.5 cqa-text-sm';
|
|
6686
|
+
}
|
|
6687
|
+
}
|
|
6688
|
+
get labelSizeClasses() {
|
|
6689
|
+
switch (this.size) {
|
|
6690
|
+
case 'sm':
|
|
6691
|
+
return 'cqa-text-xs cqa-mb-1';
|
|
6692
|
+
case 'md':
|
|
6693
|
+
return 'cqa-text-sm cqa-mb-1.5';
|
|
6694
|
+
case 'lg':
|
|
6695
|
+
return 'cqa-text-base cqa-mb-2';
|
|
6696
|
+
default:
|
|
6697
|
+
return 'cqa-text-sm cqa-mb-1.5';
|
|
6698
|
+
}
|
|
6699
|
+
}
|
|
6700
|
+
onInput(event) {
|
|
6701
|
+
const target = event.target;
|
|
6702
|
+
let nextValue = target?.value ?? '';
|
|
6703
|
+
if (this.showCharCount && this.maxLength && nextValue.length > this.maxLength) {
|
|
6704
|
+
nextValue = nextValue.substring(0, this.maxLength);
|
|
6705
|
+
if (target) {
|
|
6706
|
+
target.value = nextValue;
|
|
6707
|
+
}
|
|
6708
|
+
}
|
|
6709
|
+
this.inputValue = nextValue;
|
|
6710
|
+
this.valueChange.emit(this.inputValue);
|
|
6711
|
+
}
|
|
6712
|
+
onFocus(event) {
|
|
6713
|
+
this.isFocused = true;
|
|
6714
|
+
this.focused.emit(event);
|
|
6715
|
+
}
|
|
6716
|
+
onBlur(event) {
|
|
6717
|
+
this.isFocused = false;
|
|
6718
|
+
this.blurred.emit(event);
|
|
6719
|
+
}
|
|
6720
|
+
onKeyDown(event) {
|
|
6721
|
+
if (event.key === 'Enter') {
|
|
6722
|
+
event.preventDefault();
|
|
6723
|
+
this.enterPressed.emit(this.inputValue.trim());
|
|
6724
|
+
}
|
|
6725
|
+
}
|
|
6726
|
+
get inputStyles() {
|
|
6727
|
+
return this.inputInlineStyle || '';
|
|
6728
|
+
}
|
|
6729
|
+
get labelStyles() {
|
|
6730
|
+
return this.labelInlineStyle || '';
|
|
6731
|
+
}
|
|
6732
|
+
}
|
|
6733
|
+
CustomInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CustomInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6734
|
+
CustomInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CustomInputComponent, selector: "cqa-custom-input", inputs: { label: "label", type: "type", placeholder: "placeholder", value: "value", disabled: "disabled", errors: "errors", required: "required", ariaLabel: "ariaLabel", size: "size", fullWidth: "fullWidth", maxLength: "maxLength", showCharCount: "showCharCount", inputInlineStyle: "inputInlineStyle", labelInlineStyle: "labelInlineStyle" }, outputs: { valueChange: "valueChange", blurred: "blurred", focused: "focused", enterPressed: "enterPressed" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-ui-root\" [style.display]=\"'block'\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <div class=\"cqa-flex cqa-flex-col\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <label \n *ngIf=\"label\"\n class=\"cqa-font-medium cqa-text-[#374151]\"\n [ngClass]=\"labelSizeClasses\"\n [style]=\"labelStyles\">\n {{ label }}\n <span *ngIf=\"required\" class=\"cqa-text-[#EF4444] cqa-ml-0.5\">*</span>\n </label>\n\n <div class=\"cqa-relative\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <input\n [type]=\"type\"\n class=\"cqa-w-full !cqa-border !cqa-border-solid !cqa-border-gray-200 cqa-rounded-md cqa-bg-white cqa-font-['SF_Pro_Text'] cqa-font-normal cqa-leading-normal cqa-tracking-normal cqa-text-[#0A0A0A] placeholder:cqa-text-[#9CA3AF] cqa-transition-all cqa-duration-200 cqa-outline-none\"\n [ngClass]=\"{\n 'cqa-border-[#D1D5DB] focus:cqa-border-[#3B82F6] focus:cqa-ring-1 focus:cqa-ring-[#3B82F6]': !hasError,\n 'cqa-border-[#EF4444] focus:cqa-border-[#EF4444] focus:cqa-ring-1 focus:cqa-ring-[#EF4444]': hasError,\n 'cqa-bg-[#F9FAFB] cqa-cursor-not-allowed cqa-text-[#9CA3AF]': disabled,\n 'cqa-outline-none': true\n }\"\n [ngClass]=\"inputSizeClasses\"\n [style]=\"inputStyles\"\n [placeholder]=\"placeholder\"\n [value]=\"inputValue\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keydown)=\"onKeyDown($event)\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel || label\"\n [attr.aria-invalid]=\"hasError\"\n [attr.aria-required]=\"required\"\n autocomplete=\"off\"\n />\n </div>\n\n <div *ngIf=\"showCharCount && maxLength\" class=\"cqa-flex cqa-justify-end cqa-mt-1\">\n <span class=\"cqa-text-xs cqa-text-[#6B7280]\">\n {{ inputValue.length }}/{{ maxLength }}\n </span>\n </div>\n\n <div *ngIf=\"hasError\" class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-mt-1.5\">\n <div *ngFor=\"let error of errors\" class=\"cqa-flex cqa-items-start cqa-gap-1.5\">\n <svg \n xmlns=\"http://www.w3.org/2000/svg\" \n width=\"14\" \n height=\"14\" \n viewBox=\"0 0 14 14\" \n fill=\"none\"\n class=\"cqa-flex-shrink-0 cqa-mt-0.5\">\n <path d=\"M7 1.75C4.1 1.75 1.75 4.1 1.75 7C1.75 9.9 4.1 12.25 7 12.25C9.9 12.25 12.25 9.9 12.25 7C12.25 4.1 9.9 1.75 7 1.75ZM7 9.625C6.65625 9.625 6.375 9.34375 6.375 9V7C6.375 6.65625 6.65625 6.375 7 6.375C7.34375 6.375 7.625 6.65625 7.625 7V9C7.625 9.34375 7.34375 9.625 7 9.625ZM7.625 5.25H6.375V4H7.625V5.25Z\" fill=\"#EF4444\"/>\n </svg>\n <span class=\"cqa-text-xs cqa-text-[#EF4444] cqa-font-medium cqa-leading-[18px]\">\n {{ error }}\n </span>\n </div>\n </div>\n </div>\n</div>\n\n", directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
6735
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CustomInputComponent, decorators: [{
|
|
6736
|
+
type: Component,
|
|
6737
|
+
args: [{ selector: 'cqa-custom-input', host: { class: 'cqa-ui-root' }, template: "<div class=\"cqa-ui-root\" [style.display]=\"'block'\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <div class=\"cqa-flex cqa-flex-col\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <label \n *ngIf=\"label\"\n class=\"cqa-font-medium cqa-text-[#374151]\"\n [ngClass]=\"labelSizeClasses\"\n [style]=\"labelStyles\">\n {{ label }}\n <span *ngIf=\"required\" class=\"cqa-text-[#EF4444] cqa-ml-0.5\">*</span>\n </label>\n\n <div class=\"cqa-relative\" [style.width]=\"fullWidth ? '100%' : 'auto'\">\n <input\n [type]=\"type\"\n class=\"cqa-w-full !cqa-border !cqa-border-solid !cqa-border-gray-200 cqa-rounded-md cqa-bg-white cqa-font-['SF_Pro_Text'] cqa-font-normal cqa-leading-normal cqa-tracking-normal cqa-text-[#0A0A0A] placeholder:cqa-text-[#9CA3AF] cqa-transition-all cqa-duration-200 cqa-outline-none\"\n [ngClass]=\"{\n 'cqa-border-[#D1D5DB] focus:cqa-border-[#3B82F6] focus:cqa-ring-1 focus:cqa-ring-[#3B82F6]': !hasError,\n 'cqa-border-[#EF4444] focus:cqa-border-[#EF4444] focus:cqa-ring-1 focus:cqa-ring-[#EF4444]': hasError,\n 'cqa-bg-[#F9FAFB] cqa-cursor-not-allowed cqa-text-[#9CA3AF]': disabled,\n 'cqa-outline-none': true\n }\"\n [ngClass]=\"inputSizeClasses\"\n [style]=\"inputStyles\"\n [placeholder]=\"placeholder\"\n [value]=\"inputValue\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keydown)=\"onKeyDown($event)\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel || label\"\n [attr.aria-invalid]=\"hasError\"\n [attr.aria-required]=\"required\"\n autocomplete=\"off\"\n />\n </div>\n\n <div *ngIf=\"showCharCount && maxLength\" class=\"cqa-flex cqa-justify-end cqa-mt-1\">\n <span class=\"cqa-text-xs cqa-text-[#6B7280]\">\n {{ inputValue.length }}/{{ maxLength }}\n </span>\n </div>\n\n <div *ngIf=\"hasError\" class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-mt-1.5\">\n <div *ngFor=\"let error of errors\" class=\"cqa-flex cqa-items-start cqa-gap-1.5\">\n <svg \n xmlns=\"http://www.w3.org/2000/svg\" \n width=\"14\" \n height=\"14\" \n viewBox=\"0 0 14 14\" \n fill=\"none\"\n class=\"cqa-flex-shrink-0 cqa-mt-0.5\">\n <path d=\"M7 1.75C4.1 1.75 1.75 4.1 1.75 7C1.75 9.9 4.1 12.25 7 12.25C9.9 12.25 12.25 9.9 12.25 7C12.25 4.1 9.9 1.75 7 1.75ZM7 9.625C6.65625 9.625 6.375 9.34375 6.375 9V7C6.375 6.65625 6.65625 6.375 7 6.375C7.34375 6.375 7.625 6.65625 7.625 7V9C7.625 9.34375 7.34375 9.625 7 9.625ZM7.625 5.25H6.375V4H7.625V5.25Z\" fill=\"#EF4444\"/>\n </svg>\n <span class=\"cqa-text-xs cqa-text-[#EF4444] cqa-font-medium cqa-leading-[18px]\">\n {{ error }}\n </span>\n </div>\n </div>\n </div>\n</div>\n\n", styles: [] }]
|
|
6738
|
+
}], propDecorators: { label: [{
|
|
6739
|
+
type: Input
|
|
6740
|
+
}], type: [{
|
|
6741
|
+
type: Input
|
|
6742
|
+
}], placeholder: [{
|
|
6743
|
+
type: Input
|
|
6744
|
+
}], value: [{
|
|
6745
|
+
type: Input
|
|
6746
|
+
}], disabled: [{
|
|
6747
|
+
type: Input
|
|
6748
|
+
}], errors: [{
|
|
6749
|
+
type: Input
|
|
6750
|
+
}], required: [{
|
|
6751
|
+
type: Input
|
|
6752
|
+
}], ariaLabel: [{
|
|
6753
|
+
type: Input
|
|
6754
|
+
}], size: [{
|
|
6755
|
+
type: Input
|
|
6756
|
+
}], fullWidth: [{
|
|
6757
|
+
type: Input
|
|
6758
|
+
}], maxLength: [{
|
|
6759
|
+
type: Input
|
|
6760
|
+
}], showCharCount: [{
|
|
6761
|
+
type: Input
|
|
6762
|
+
}], inputInlineStyle: [{
|
|
6763
|
+
type: Input
|
|
6764
|
+
}], labelInlineStyle: [{
|
|
6765
|
+
type: Input
|
|
6766
|
+
}], valueChange: [{
|
|
6767
|
+
type: Output
|
|
6768
|
+
}], blurred: [{
|
|
6769
|
+
type: Output
|
|
6770
|
+
}], focused: [{
|
|
6771
|
+
type: Output
|
|
6772
|
+
}], enterPressed: [{
|
|
6773
|
+
type: Output
|
|
6774
|
+
}] } });
|
|
6775
|
+
|
|
6417
6776
|
class UiKitModule {
|
|
6418
6777
|
constructor(iconRegistry) {
|
|
6419
6778
|
iconRegistry.registerFontClassAlias('material-symbols-outlined', 'material-symbols-outlined');
|
|
@@ -6461,7 +6820,10 @@ UiKitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
|
|
|
6461
6820
|
RunHistoryCardComponent,
|
|
6462
6821
|
ViewImageModalComponent,
|
|
6463
6822
|
ConfigurationCardComponent,
|
|
6464
|
-
CompareRunsComponent
|
|
6823
|
+
CompareRunsComponent,
|
|
6824
|
+
IterationsLoopComponent,
|
|
6825
|
+
FailedStepCardComponent,
|
|
6826
|
+
CustomInputComponent], imports: [CommonModule,
|
|
6465
6827
|
FormsModule,
|
|
6466
6828
|
ReactiveFormsModule,
|
|
6467
6829
|
MatIconModule,
|
|
@@ -6517,7 +6879,10 @@ UiKitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
|
|
|
6517
6879
|
RunHistoryCardComponent,
|
|
6518
6880
|
ViewImageModalComponent,
|
|
6519
6881
|
ConfigurationCardComponent,
|
|
6520
|
-
CompareRunsComponent
|
|
6882
|
+
CompareRunsComponent,
|
|
6883
|
+
IterationsLoopComponent,
|
|
6884
|
+
FailedStepCardComponent,
|
|
6885
|
+
CustomInputComponent] });
|
|
6521
6886
|
UiKitModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UiKitModule, providers: [
|
|
6522
6887
|
{ provide: OverlayContainer, useClass: TailwindOverlayContainer }
|
|
6523
6888
|
], imports: [[
|
|
@@ -6584,7 +6949,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
6584
6949
|
RunHistoryCardComponent,
|
|
6585
6950
|
ViewImageModalComponent,
|
|
6586
6951
|
ConfigurationCardComponent,
|
|
6587
|
-
CompareRunsComponent
|
|
6952
|
+
CompareRunsComponent,
|
|
6953
|
+
IterationsLoopComponent,
|
|
6954
|
+
FailedStepCardComponent,
|
|
6955
|
+
CustomInputComponent
|
|
6588
6956
|
],
|
|
6589
6957
|
imports: [
|
|
6590
6958
|
CommonModule,
|
|
@@ -6646,7 +7014,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
6646
7014
|
RunHistoryCardComponent,
|
|
6647
7015
|
ViewImageModalComponent,
|
|
6648
7016
|
ConfigurationCardComponent,
|
|
6649
|
-
CompareRunsComponent
|
|
7017
|
+
CompareRunsComponent,
|
|
7018
|
+
IterationsLoopComponent,
|
|
7019
|
+
FailedStepCardComponent,
|
|
7020
|
+
CustomInputComponent
|
|
6650
7021
|
],
|
|
6651
7022
|
providers: [
|
|
6652
7023
|
{ provide: OverlayContainer, useClass: TailwindOverlayContainer }
|
|
@@ -6788,5 +7159,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
6788
7159
|
* Generated bundle index. Do not edit.
|
|
6789
7160
|
*/
|
|
6790
7161
|
|
|
6791
|
-
export { ActionMenuButtonComponent, AiDebugAlertComponent, BadgeComponent, ButtonComponent, ChartCardComponent, ColumnVisibilityComponent, CompareRunsComponent, ConfigurationCardComponent, ConsoleAlertComponent, CoverageModuleCardComponent, DEFAULT_METADATA_COLOR, DIALOG_DATA, DIALOG_REF, DashboardHeaderComponent, DaterangepickerComponent, DaterangepickerDirective, DialogComponent, DialogRef, DialogService, DropdownButtonComponent, DynamicCellContainerDirective, DynamicCellTemplateDirective, DynamicFilterComponent, DynamicHeaderTemplateDirective, DynamicSelectFieldComponent, DynamicTableComponent, EMPTY_STATE_IMAGES, EMPTY_STATE_PRESETS, EmptyStateComponent, FailedTestCasesCardComponent, FullTableLoaderComponent, HeatErrorMapCellComponent, InsightCardComponent, MetricsCardComponent, NetworkRequestComponent, OtherButtonComponent, PRIORITY_COLORS, PaginationComponent, ProgressTextCardComponent, RESULT_COLORS, RunHistoryCardComponent, STATUS_COLORS, SearchBarComponent, SegmentControlComponent, SelectedFiltersComponent, SimulatorComponent, TableActionToolbarComponent, TableDataLoaderComponent, TableTemplateComponent, TailwindOverlayContainer, TestDistributionCardComponent, UiKitModule, ViewImageModalComponent, getEmptyStatePreset, getMetadataColor, getMetadataValueStyle };
|
|
7162
|
+
export { ActionMenuButtonComponent, AiDebugAlertComponent, BadgeComponent, ButtonComponent, ChartCardComponent, ColumnVisibilityComponent, CompareRunsComponent, ConfigurationCardComponent, ConsoleAlertComponent, CoverageModuleCardComponent, CustomInputComponent, DEFAULT_METADATA_COLOR, DIALOG_DATA, DIALOG_REF, DashboardHeaderComponent, DaterangepickerComponent, DaterangepickerDirective, DialogComponent, DialogRef, DialogService, DropdownButtonComponent, DynamicCellContainerDirective, DynamicCellTemplateDirective, DynamicFilterComponent, DynamicHeaderTemplateDirective, DynamicSelectFieldComponent, DynamicTableComponent, EMPTY_STATE_IMAGES, EMPTY_STATE_PRESETS, EmptyStateComponent, FailedStepCardComponent, FailedTestCasesCardComponent, FullTableLoaderComponent, HeatErrorMapCellComponent, InsightCardComponent, IterationsLoopComponent, MetricsCardComponent, NetworkRequestComponent, OtherButtonComponent, PRIORITY_COLORS, PaginationComponent, ProgressTextCardComponent, RESULT_COLORS, RunHistoryCardComponent, STATUS_COLORS, SearchBarComponent, SegmentControlComponent, SelectedFiltersComponent, SimulatorComponent, TableActionToolbarComponent, TableDataLoaderComponent, TableTemplateComponent, TailwindOverlayContainer, TestDistributionCardComponent, UiKitModule, ViewImageModalComponent, getEmptyStatePreset, getMetadataColor, getMetadataValueStyle };
|
|
6792
7163
|
//# sourceMappingURL=cqa-lib-cqa-ui.mjs.map
|