npm - @memberjunction/ng-dashboards - Versions diffs - 5.11.0 → 5.13.0 - Mend

@memberjunction/ng-dashboards 5.11.0 → 5.13.0

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.

Files changed (229) hide show

package/dist/Testing/components/widgets/oracle-breakdown-table.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"oracle-breakdown-table.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/oracle-breakdown-table.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input } from '@angular/core';\n\nexport interface OracleResult {\n name: string;\n status: 'Passed' \| 'Failed' \| 'Skipped' \| 'Error';\n score: number;\n cost: number;\n duration: number; // milliseconds\n errorMessage?: string;\n details?: any;\n}\n\n@Component({\n standalone: false,\n selector: 'app-oracle-breakdown-table',\n template: `\n <div class=\"oracle-breakdown\">\n <div class=\"breakdown-header\">\n <h4>\n <i class=\"fa-solid fa-balance-scale\"></i>\n Oracle Results\n </h4>\n @if (results && results.length > 0) {\n <div class=\"aggregate-score\">\n <span class=\"label\">Aggregate:</span>\n <app-score-indicator [score]=\"getAggregateScore()\" [showBar]=\"false\"></app-score-indicator>\n </div>\n }\n </div>\n \n <div class=\"breakdown-content\">\n @if (results && results.length > 0) {\n <div class=\"oracle-table\">\n <div class=\"table-header\">\n <div class=\"header-cell\">Oracle</div>\n <div class=\"header-cell\">Status</div>\n <div class=\"header-cell\">Score</div>\n <div class=\"header-cell\">Cost</div>\n <div class=\"header-cell\">Duration</div>\n </div>\n \n @for (oracle of results; track oracle.name) {\n <div class=\"table-row\" [class.has-error]=\"oracle.errorMessage\">\n <div class=\"table-cell\">\n <div class=\"oracle-name\">\n @if (oracle.status === 'Passed') {\n <i class=\"fa-solid fa-check-circle oracle-icon\"></i>\n }\n @if (oracle.status === 'Failed') {\n <i class=\"fa-solid fa-times-circle oracle-icon\"></i>\n }\n @if (oracle.status === 'Error') {\n <i class=\"fa-solid fa-exclamation-triangle oracle-icon\"></i>\n }\n @if (oracle.status === 'Skipped') {\n <i class=\"fa-solid fa-forward oracle-icon\"></i>\n }\n <span>{{ oracle.name }}</span>\n </div>\n </div>\n <div class=\"table-cell\">\n <app-test-status-badge [status]=\"oracle.status\" [showIcon]=\"false\"></app-test-status-badge>\n </div>\n <div class=\"table-cell\">\n <app-score-indicator [score]=\"oracle.score\" [showBar]=\"true\"></app-score-indicator>\n </div>\n <div class=\"table-cell\">\n <app-cost-display [cost]=\"oracle.cost\" [showIcon]=\"true\" [decimals]=\"6\"></app-cost-display>\n </div>\n <div class=\"table-cell\">\n {{ formatDuration(oracle.duration) }}\n </div>\n </div>\n \n @if (oracle.errorMessage) {\n <div class=\"error-row\">\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n {{ oracle.errorMessage }}\n </div>\n </div>\n }\n }\n </div>\n \n <div class=\"breakdown-summary\">\n <div class=\"summary-item\">\n <span class=\"summary-label\">Total Cost:</span>\n <app-cost-display [cost]=\"getTotalCost()\" [showIcon]=\"true\"></app-cost-display>\n </div>\n <div class=\"summary-item\">\n <span class=\"summary-label\">Total Duration:</span>\n <span class=\"summary-value\">{{ formatDuration(getTotalDuration()) }}</span>\n </div>\n <div class=\"summary-item\">\n <span class=\"summary-label\">Oracles Run:</span>\n <span class=\"summary-value\">{{ results.length }}</span>\n </div>\n </div>\n } @else {\n <div class=\"no-results\">\n <i class=\"fa-solid fa-inbox\"></i>\n <p>No oracle results available</p>\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .oracle-breakdown {\n background: white;\n border-radius: 8px;\n overflow: hidden;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .breakdown-header {\n padding: 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e0e0e0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .breakdown-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .breakdown-header h4 i {\n color: #2196f3;\n }\n\n .aggregate-score {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 12px;\n }\n\n .aggregate-score .label {\n color: #666;\n font-weight: 500;\n }\n\n .breakdown-content {\n flex: 1;\n overflow-y: auto;\n padding: 16px;\n }\n\n .oracle-table {\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n overflow: hidden;\n }\n\n .table-header {\n display: grid;\n grid-template-columns: 2fr 120px 150px 120px 100px;\n gap: 12px;\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e0e0e0;\n font-size: 11px;\n font-weight: 600;\n color: #666;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n .table-row {\n display: grid;\n grid-template-columns: 2fr 120px 150px 120px 100px;\n gap: 12px;\n padding: 12px 16px;\n border-bottom: 1px solid #f0f0f0;\n align-items: center;\n transition: background 0.2s ease;\n }\n\n .table-row:hover {\n background: #f8f9fa;\n }\n\n .table-row:last-child {\n border-bottom: none;\n }\n\n .table-row.has-error {\n border-left: 3px solid #f44336;\n }\n\n .table-cell {\n font-size: 12px;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .oracle-name {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n }\n\n .oracle-icon {\n font-size: 11px;\n }\n\n .oracle-icon.fa-check-circle {\n color: #4caf50;\n }\n\n .oracle-icon.fa-times-circle {\n color: #f44336;\n }\n\n .oracle-icon.fa-exclamation-triangle {\n color: #ff9800;\n }\n\n .oracle-icon.fa-forward {\n color: #9e9e9e;\n }\n\n .error-row {\n padding: 8px 16px;\n background: #fff3e0;\n border-bottom: 1px solid #f0f0f0;\n border-left: 3px solid #ff9800;\n }\n\n .error-message {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n font-size: 11px;\n color: #e65100;\n font-family: monospace;\n line-height: 1.4;\n }\n\n .error-message i {\n flex-shrink: 0;\n margin-top: 2px;\n }\n\n .breakdown-summary {\n margin-top: 16px;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 6px;\n display: flex;\n justify-content: space-around;\n gap: 16px;\n }\n\n .summary-item {\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: center;\n }\n\n .summary-label {\n font-size: 10px;\n color: #666;\n font-weight: 500;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n .summary-value {\n font-size: 14px;\n font-weight: 600;\n color: #333;\n }\n\n .no-results {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n color: #999;\n gap: 12px;\n }\n\n .no-results i {\n font-size: 36px;\n color: #ddd;\n }\n\n .no-results p {\n margin: 0;\n font-size: 13px;\n }\n\n @media (max-width: 768px) {\n .table-header,\n .table-row {\n grid-template-columns: 1fr;\n gap: 8px;\n }\n\n .table-cell {\n display: block;\n }\n\n .breakdown-summary {\n flex-direction: column;\n gap: 12px;\n }\n }\n `]\n})\nexport class OracleBreakdownTableComponent {\n @Input() results: OracleResult[] = [];\n\n formatDuration(milliseconds: number): string {\n if (milliseconds < 1000) {\n return `${milliseconds}ms`;\n }\n\n const seconds = Math.floor(milliseconds / 1000);\n const minutes = Math.floor(seconds / 60);\n const hours = Math.floor(minutes / 60);\n\n if (hours > 0) {\n return `${hours}h ${minutes % 60}m ${seconds % 60}s`;\n } else if (minutes > 0) {\n return `${minutes}m ${seconds % 60}s`;\n } else {\n return `${seconds}s`;\n }\n }\n\n getAggregateScore(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n const total = this.results.reduce((sum, r) => sum + r.score, 0);\n return total / this.results.length;\n }\n\n getTotalCost(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n return this.results.reduce((sum, r) => sum + r.cost, 0);\n }\n\n getTotalDuration(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n return this.results.reduce((sum, r) => sum + r.duration, 0);\n }\n}\n"]}
1	+ {"version":3,"file":"oracle-breakdown-table.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/oracle-breakdown-table.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input } from '@angular/core';\n\nexport interface OracleResult {\n name: string;\n status: 'Passed' \| 'Failed' \| 'Skipped' \| 'Error';\n score: number;\n cost: number;\n duration: number; // milliseconds\n errorMessage?: string;\n details?: any;\n}\n\n@Component({\n standalone: false,\n selector: 'app-oracle-breakdown-table',\n template: `\n <div class=\"oracle-breakdown\">\n <div class=\"breakdown-header\">\n <h4>\n <i class=\"fa-solid fa-balance-scale\"></i>\n Oracle Results\n </h4>\n @if (results && results.length > 0) {\n <div class=\"aggregate-score\">\n <span class=\"label\">Aggregate:</span>\n <app-score-indicator [score]=\"getAggregateScore()\" [showBar]=\"false\"></app-score-indicator>\n </div>\n }\n </div>\n \n <div class=\"breakdown-content\">\n @if (results && results.length > 0) {\n <div class=\"oracle-table\">\n <div class=\"table-header\">\n <div class=\"header-cell\">Oracle</div>\n <div class=\"header-cell\">Status</div>\n <div class=\"header-cell\">Score</div>\n <div class=\"header-cell\">Cost</div>\n <div class=\"header-cell\">Duration</div>\n </div>\n \n @for (oracle of results; track oracle.name) {\n <div class=\"table-row\" [class.has-error]=\"oracle.errorMessage\">\n <div class=\"table-cell\">\n <div class=\"oracle-name\">\n @if (oracle.status === 'Passed') {\n <i class=\"fa-solid fa-check-circle oracle-icon\"></i>\n }\n @if (oracle.status === 'Failed') {\n <i class=\"fa-solid fa-times-circle oracle-icon\"></i>\n }\n @if (oracle.status === 'Error') {\n <i class=\"fa-solid fa-exclamation-triangle oracle-icon\"></i>\n }\n @if (oracle.status === 'Skipped') {\n <i class=\"fa-solid fa-forward oracle-icon\"></i>\n }\n <span>{{ oracle.name }}</span>\n </div>\n </div>\n <div class=\"table-cell\">\n <app-test-status-badge [status]=\"oracle.status\" [showIcon]=\"false\"></app-test-status-badge>\n </div>\n <div class=\"table-cell\">\n <app-score-indicator [score]=\"oracle.score\" [showBar]=\"true\"></app-score-indicator>\n </div>\n <div class=\"table-cell\">\n <app-cost-display [cost]=\"oracle.cost\" [showIcon]=\"true\" [decimals]=\"6\"></app-cost-display>\n </div>\n <div class=\"table-cell\">\n {{ formatDuration(oracle.duration) }}\n </div>\n </div>\n \n @if (oracle.errorMessage) {\n <div class=\"error-row\">\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n {{ oracle.errorMessage }}\n </div>\n </div>\n }\n }\n </div>\n \n <div class=\"breakdown-summary\">\n <div class=\"summary-item\">\n <span class=\"summary-label\">Total Cost:</span>\n <app-cost-display [cost]=\"getTotalCost()\" [showIcon]=\"true\"></app-cost-display>\n </div>\n <div class=\"summary-item\">\n <span class=\"summary-label\">Total Duration:</span>\n <span class=\"summary-value\">{{ formatDuration(getTotalDuration()) }}</span>\n </div>\n <div class=\"summary-item\">\n <span class=\"summary-label\">Oracles Run:</span>\n <span class=\"summary-value\">{{ results.length }}</span>\n </div>\n </div>\n } @else {\n <div class=\"no-results\">\n <i class=\"fa-solid fa-inbox\"></i>\n <p>No oracle results available</p>\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .oracle-breakdown {\n background: var(--mj-bg-surface);\n border-radius: 8px;\n overflow: hidden;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .breakdown-header {\n padding: 16px;\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .breakdown-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: var(--mj-text-primary);\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .breakdown-header h4 i {\n color: var(--mj-brand-primary);\n }\n\n .aggregate-score {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 12px;\n }\n\n .aggregate-score .label {\n color: var(--mj-text-secondary);\n font-weight: 500;\n }\n\n .breakdown-content {\n flex: 1;\n overflow-y: auto;\n padding: 16px;\n }\n\n .oracle-table {\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n overflow: hidden;\n }\n\n .table-header {\n display: grid;\n grid-template-columns: 2fr 120px 150px 120px 100px;\n gap: 12px;\n padding: 12px 16px;\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n font-size: 11px;\n font-weight: 600;\n color: var(--mj-text-secondary);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n .table-row {\n display: grid;\n grid-template-columns: 2fr 120px 150px 120px 100px;\n gap: 12px;\n padding: 12px 16px;\n border-bottom: 1px solid var(--mj-border-default);\n align-items: center;\n transition: background 0.2s ease;\n }\n\n .table-row:hover {\n background: var(--mj-bg-surface-card);\n }\n\n .table-row:last-child {\n border-bottom: none;\n }\n\n .table-row.has-error {\n border-left: 3px solid var(--mj-status-error);\n }\n\n .table-cell {\n font-size: 12px;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .oracle-name {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n }\n\n .oracle-icon {\n font-size: 11px;\n }\n\n .oracle-icon.fa-check-circle {\n color: var(--mj-status-success);\n }\n\n .oracle-icon.fa-times-circle {\n color: var(--mj-status-error);\n }\n\n .oracle-icon.fa-exclamation-triangle {\n color: var(--mj-status-warning);\n }\n\n .oracle-icon.fa-forward {\n color: var(--mj-text-disabled);\n }\n\n .error-row {\n padding: 8px 16px;\n background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n border-bottom: 1px solid var(--mj-border-default);\n border-left: 3px solid var(--mj-status-warning);\n }\n\n .error-message {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n font-size: 11px;\n color: var(--mj-status-warning);\n font-family: monospace;\n line-height: 1.4;\n }\n\n .error-message i {\n flex-shrink: 0;\n margin-top: 2px;\n }\n\n .breakdown-summary {\n margin-top: 16px;\n padding: 16px;\n background: var(--mj-bg-surface-card);\n border-radius: 6px;\n display: flex;\n justify-content: space-around;\n gap: 16px;\n }\n\n .summary-item {\n display: flex;\n flex-direction: column;\n gap: 6px;\n align-items: center;\n }\n\n .summary-label {\n font-size: 10px;\n color: var(--mj-text-secondary);\n font-weight: 500;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n .summary-value {\n font-size: 14px;\n font-weight: 600;\n color: var(--mj-text-primary);\n }\n\n .no-results {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n color: var(--mj-text-disabled);\n gap: 12px;\n }\n\n .no-results i {\n font-size: 36px;\n color: var(--mj-border-default);\n }\n\n .no-results p {\n margin: 0;\n font-size: 13px;\n }\n\n @media (max-width: 768px) {\n .table-header,\n .table-row {\n grid-template-columns: 1fr;\n gap: 8px;\n }\n\n .table-cell {\n display: block;\n }\n\n .breakdown-summary {\n flex-direction: column;\n gap: 12px;\n }\n }\n `]\n})\nexport class OracleBreakdownTableComponent {\n @Input() results: OracleResult[] = [];\n\n formatDuration(milliseconds: number): string {\n if (milliseconds < 1000) {\n return `${milliseconds}ms`;\n }\n\n const seconds = Math.floor(milliseconds / 1000);\n const minutes = Math.floor(seconds / 60);\n const hours = Math.floor(minutes / 60);\n\n if (hours > 0) {\n return `${hours}h ${minutes % 60}m ${seconds % 60}s`;\n } else if (minutes > 0) {\n return `${minutes}m ${seconds % 60}s`;\n } else {\n return `${seconds}s`;\n }\n }\n\n getAggregateScore(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n const total = this.results.reduce((sum, r) => sum + r.score, 0);\n return total / this.results.length;\n }\n\n getTotalCost(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n return this.results.reduce((sum, r) => sum + r.cost, 0);\n }\n\n getTotalDuration(): number {\n if (!this.results \|\| this.results.length === 0) return 0;\n return this.results.reduce((sum, r) => sum + r.duration, 0);\n }\n}\n"]}

package/dist/Testing/components/widgets/suite-tree.component.js CHANGED Viewed

@@ -100,7 +100,7 @@ export class SuiteTreeComponent {
         } if (rf & 2) {
             i0.ɵɵadvance(11);
             i0.ɵɵconditional(ctx.suites && ctx.suites.length > 0 ? 11 : 12);
-        } }, dependencies: () => [SuiteTreeNodeComponent], styles: [".suite-tree[_ngcontent-%COMP%] {\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      background: white;\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .tree-header[_ngcontent-%COMP%] {\n      padding: 16px;\n      background: #f8f9fa;\n      border-bottom: 1px solid #e0e0e0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .tree-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .tree-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: #2196f3;\n    }\n\n    .tree-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 6px;\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%] {\n      background: white;\n      border: 1px solid #ddd;\n      padding: 6px 10px;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 11px;\n      color: #666;\n      transition: all 0.2s ease;\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%]:hover {\n      background: #e9ecef;\n      border-color: #ccc;\n      color: #333;\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n    }\n\n    .tree-content[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-suites[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px 20px;\n      color: #999;\n      gap: 12px;\n    }\n\n    .no-suites[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 36px;\n      color: #ddd;\n    }\n\n    .no-suites[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 13px;\n    }"] });
+        } }, dependencies: () => [SuiteTreeNodeComponent], styles: [".suite-tree[_ngcontent-%COMP%] {\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      background: var(--mj-bg-surface);\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .tree-header[_ngcontent-%COMP%] {\n      padding: 16px;\n      background: var(--mj-bg-surface-card);\n      border-bottom: 1px solid var(--mj-border-default);\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .tree-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .tree-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .tree-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 6px;\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      padding: 6px 10px;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 11px;\n      color: var(--mj-text-secondary);\n      transition: all 0.2s ease;\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .tree-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n    }\n\n    .tree-content[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-suites[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px 20px;\n      color: var(--mj-text-disabled);\n      gap: 12px;\n    }\n\n    .no-suites[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 36px;\n      color: var(--mj-border-default);\n    }\n\n    .no-suites[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 13px;\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SuiteTreeComponent, [{
         type: Component,
@@ -142,7 +142,7 @@ export class SuiteTreeComponent {
         }
       </div>
     </div>
-  `, styles: ["\n    .suite-tree {\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      background: white;\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .tree-header {\n      padding: 16px;\n      background: #f8f9fa;\n      border-bottom: 1px solid #e0e0e0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .tree-header h4 {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .tree-header h4 i {\n      color: #2196f3;\n    }\n\n    .tree-actions {\n      display: flex;\n      gap: 6px;\n    }\n\n    .tree-action-btn {\n      background: white;\n      border: 1px solid #ddd;\n      padding: 6px 10px;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 11px;\n      color: #666;\n      transition: all 0.2s ease;\n    }\n\n    .tree-action-btn:hover {\n      background: #e9ecef;\n      border-color: #ccc;\n      color: #333;\n    }\n\n    .tree-action-btn i {\n      font-size: 10px;\n    }\n\n    .tree-content {\n      flex: 1;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-suites {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px 20px;\n      color: #999;\n      gap: 12px;\n    }\n\n    .no-suites i {\n      font-size: 36px;\n      color: #ddd;\n    }\n\n    .no-suites p {\n      margin: 0;\n      font-size: 13px;\n    }\n  "] }]
+  `, styles: ["\n    .suite-tree {\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      background: var(--mj-bg-surface);\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .tree-header {\n      padding: 16px;\n      background: var(--mj-bg-surface-card);\n      border-bottom: 1px solid var(--mj-border-default);\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .tree-header h4 {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .tree-header h4 i {\n      color: var(--mj-brand-primary);\n    }\n\n    .tree-actions {\n      display: flex;\n      gap: 6px;\n    }\n\n    .tree-action-btn {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      padding: 6px 10px;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 11px;\n      color: var(--mj-text-secondary);\n      transition: all 0.2s ease;\n    }\n\n    .tree-action-btn:hover {\n      background: var(--mj-bg-surface-sunken);\n      border-color: var(--mj-border-strong);\n      color: var(--mj-text-primary);\n    }\n\n    .tree-action-btn i {\n      font-size: 10px;\n    }\n\n    .tree-content {\n      flex: 1;\n      overflow-y: auto;\n      padding: 8px;\n    }\n\n    .no-suites {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px 20px;\n      color: var(--mj-text-disabled);\n      gap: 12px;\n    }\n\n    .no-suites i {\n      font-size: 36px;\n      color: var(--mj-border-default);\n    }\n\n    .no-suites p {\n      margin: 0;\n      font-size: 13px;\n    }\n  "] }]
     }], null, { suites: [{
             type: Input
         }], selectedSuiteId: [{
@@ -210,7 +210,7 @@ export class SuiteTreeNodeComponent {
             i0.ɵɵtextInterpolate1(" ", ctx.node.passRate.toFixed(0), "% ");
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.node.expanded && ctx.node.children && ctx.node.children.length > 0 ? 13 : -1);
-        } }, dependencies: [SuiteTreeNodeComponent], styles: [".tree-node[_ngcontent-%COMP%] {\n      margin-bottom: 2px;\n    }\n\n    .node-content[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      padding: 8px 12px;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s ease;\n      gap: 8px;\n    }\n\n    .node-content[_ngcontent-%COMP%]:hover {\n      background: #f8f9fa;\n    }\n\n    .node-content.selected[_ngcontent-%COMP%] {\n      background: rgba(33, 150, 243, 0.1);\n      border-left: 3px solid #2196f3;\n    }\n\n    .expand-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      cursor: pointer;\n      padding: 2px 6px;\n      color: #666;\n      font-size: 10px;\n      transition: color 0.2s ease;\n      min-width: 20px;\n    }\n\n    .expand-btn[_ngcontent-%COMP%]:hover {\n      color: #333;\n    }\n\n    .expand-placeholder[_ngcontent-%COMP%] {\n      width: 20px;\n    }\n\n    .suite-icon[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: #ff9800;\n    }\n\n    .suite-name[_ngcontent-%COMP%] {\n      flex: 1;\n      font-size: 12px;\n      font-weight: 500;\n      color: #333;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .suite-metrics[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      font-size: 10px;\n    }\n\n    .test-count[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 3px;\n      color: #666;\n      background: #f0f0f0;\n      padding: 2px 6px;\n      border-radius: 10px;\n    }\n\n    .test-count[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 9px;\n    }\n\n    .pass-rate[_ngcontent-%COMP%] {\n      font-weight: 600;\n      padding: 2px 6px;\n      border-radius: 10px;\n      min-width: 36px;\n      text-align: center;\n    }\n\n    .pass-rate.excellent[_ngcontent-%COMP%] {\n      background: rgba(76, 175, 80, 0.1);\n      color: #4caf50;\n    }\n\n    .pass-rate.good[_ngcontent-%COMP%] {\n      background: rgba(139, 195, 74, 0.1);\n      color: #8bc34a;\n    }\n\n    .pass-rate.fair[_ngcontent-%COMP%] {\n      background: rgba(255, 193, 7, 0.1);\n      color: #ffc107;\n    }\n\n    .pass-rate.poor[_ngcontent-%COMP%] {\n      background: rgba(244, 67, 54, 0.1);\n      color: #f44336;\n    }"] });
+        } }, dependencies: [SuiteTreeNodeComponent], styles: [".tree-node[_ngcontent-%COMP%] {\n      margin-bottom: 2px;\n    }\n\n    .node-content[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      padding: 8px 12px;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s ease;\n      gap: 8px;\n    }\n\n    .node-content[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-card);\n    }\n\n    .node-content.selected[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-brand-primary);\n    }\n\n    .expand-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      cursor: pointer;\n      padding: 2px 6px;\n      color: var(--mj-text-secondary);\n      font-size: 10px;\n      transition: color 0.2s ease;\n      min-width: 20px;\n    }\n\n    .expand-btn[_ngcontent-%COMP%]:hover {\n      color: var(--mj-text-primary);\n    }\n\n    .expand-placeholder[_ngcontent-%COMP%] {\n      width: 20px;\n    }\n\n    .suite-icon[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: var(--mj-status-warning);\n    }\n\n    .suite-name[_ngcontent-%COMP%] {\n      flex: 1;\n      font-size: 12px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .suite-metrics[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      font-size: 10px;\n    }\n\n    .test-count[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 3px;\n      color: var(--mj-text-secondary);\n      background: var(--mj-bg-surface-sunken);\n      padding: 2px 6px;\n      border-radius: 10px;\n    }\n\n    .test-count[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 9px;\n    }\n\n    .pass-rate[_ngcontent-%COMP%] {\n      font-weight: 600;\n      padding: 2px 6px;\n      border-radius: 10px;\n      min-width: 36px;\n      text-align: center;\n    }\n\n    .pass-rate.excellent[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n\n    .pass-rate.good[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n\n    .pass-rate.fair[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n    }\n\n    .pass-rate.poor[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SuiteTreeNodeComponent, [{
         type: Component,
@@ -262,7 +262,7 @@ export class SuiteTreeNodeComponent {
         }
       }
     </div>
-    `, styles: ["\n    .tree-node {\n      margin-bottom: 2px;\n    }\n\n    .node-content {\n      display: flex;\n      align-items: center;\n      padding: 8px 12px;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s ease;\n      gap: 8px;\n    }\n\n    .node-content:hover {\n      background: #f8f9fa;\n    }\n\n    .node-content.selected {\n      background: rgba(33, 150, 243, 0.1);\n      border-left: 3px solid #2196f3;\n    }\n\n    .expand-btn {\n      background: none;\n      border: none;\n      cursor: pointer;\n      padding: 2px 6px;\n      color: #666;\n      font-size: 10px;\n      transition: color 0.2s ease;\n      min-width: 20px;\n    }\n\n    .expand-btn:hover {\n      color: #333;\n    }\n\n    .expand-placeholder {\n      width: 20px;\n    }\n\n    .suite-icon {\n      font-size: 12px;\n      color: #ff9800;\n    }\n\n    .suite-name {\n      flex: 1;\n      font-size: 12px;\n      font-weight: 500;\n      color: #333;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .suite-metrics {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      font-size: 10px;\n    }\n\n    .test-count {\n      display: flex;\n      align-items: center;\n      gap: 3px;\n      color: #666;\n      background: #f0f0f0;\n      padding: 2px 6px;\n      border-radius: 10px;\n    }\n\n    .test-count i {\n      font-size: 9px;\n    }\n\n    .pass-rate {\n      font-weight: 600;\n      padding: 2px 6px;\n      border-radius: 10px;\n      min-width: 36px;\n      text-align: center;\n    }\n\n    .pass-rate.excellent {\n      background: rgba(76, 175, 80, 0.1);\n      color: #4caf50;\n    }\n\n    .pass-rate.good {\n      background: rgba(139, 195, 74, 0.1);\n      color: #8bc34a;\n    }\n\n    .pass-rate.fair {\n      background: rgba(255, 193, 7, 0.1);\n      color: #ffc107;\n    }\n\n    .pass-rate.poor {\n      background: rgba(244, 67, 54, 0.1);\n      color: #f44336;\n    }\n  "] }]
+    `, styles: ["\n    .tree-node {\n      margin-bottom: 2px;\n    }\n\n    .node-content {\n      display: flex;\n      align-items: center;\n      padding: 8px 12px;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s ease;\n      gap: 8px;\n    }\n\n    .node-content:hover {\n      background: var(--mj-bg-surface-card);\n    }\n\n    .node-content.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-left: 3px solid var(--mj-brand-primary);\n    }\n\n    .expand-btn {\n      background: none;\n      border: none;\n      cursor: pointer;\n      padding: 2px 6px;\n      color: var(--mj-text-secondary);\n      font-size: 10px;\n      transition: color 0.2s ease;\n      min-width: 20px;\n    }\n\n    .expand-btn:hover {\n      color: var(--mj-text-primary);\n    }\n\n    .expand-placeholder {\n      width: 20px;\n    }\n\n    .suite-icon {\n      font-size: 12px;\n      color: var(--mj-status-warning);\n    }\n\n    .suite-name {\n      flex: 1;\n      font-size: 12px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .suite-metrics {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      font-size: 10px;\n    }\n\n    .test-count {\n      display: flex;\n      align-items: center;\n      gap: 3px;\n      color: var(--mj-text-secondary);\n      background: var(--mj-bg-surface-sunken);\n      padding: 2px 6px;\n      border-radius: 10px;\n    }\n\n    .test-count i {\n      font-size: 9px;\n    }\n\n    .pass-rate {\n      font-weight: 600;\n      padding: 2px 6px;\n      border-radius: 10px;\n      min-width: 36px;\n      text-align: center;\n    }\n\n    .pass-rate.excellent {\n      background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n\n    .pass-rate.good {\n      background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n\n    .pass-rate.fair {\n      background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-warning);\n    }\n\n    .pass-rate.poor {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n      color: var(--mj-status-error);\n    }\n  "] }]
     }], null, { node: [{
             type: Input
         }], level: [{

package/dist/Testing/components/widgets/suite-tree.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"suite-tree.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/suite-tree.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { SuiteHierarchyNode } from '../../services/testing-instrumentation.service';\n\n@Component({\n standalone: false,\n selector: 'app-suite-tree',\n template: `\n <div class=\"suite-tree\">\n <div class=\"tree-header\">\n <h4>\n <i class=\"fa-solid fa-folder-tree\"></i>\n Test Suites\n </h4>\n <div class=\"tree-actions\">\n <button class=\"tree-action-btn\" (click)=\"expandAll()\" title=\"Expand All\">\n <i class=\"fa-solid fa-chevron-down\"></i>\n </button>\n <button class=\"tree-action-btn\" (click)=\"collapseAll()\" title=\"Collapse All\">\n <i class=\"fa-solid fa-chevron-up\"></i>\n </button>\n </div>\n </div>\n\n <div class=\"tree-content\">\n @if (suites && suites.length > 0) {\n @for (suite of suites; track suite.id) {\n <div>\n <app-suite-tree-node\n [node]=\"suite\"\n [level]=\"0\"\n [selectedId]=\"selectedSuiteId\"\n (nodeClick)=\"onNodeClick($event)\"\n (toggleExpand)=\"onToggleExpand($event)\"\n ></app-suite-tree-node>\n </div>\n }\n } @else {\n <div class=\"no-suites\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <p>No test suites found</p>\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .suite-tree {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: white;\n border-radius: 8px;\n overflow: hidden;\n }\n\n .tree-header {\n padding: 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e0e0e0;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .tree-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .tree-header h4 i {\n color: #2196f3;\n }\n\n .tree-actions {\n display: flex;\n gap: 6px;\n }\n\n .tree-action-btn {\n background: white;\n border: 1px solid #ddd;\n padding: 6px 10px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 11px;\n color: #666;\n transition: all 0.2s ease;\n }\n\n .tree-action-btn:hover {\n background: #e9ecef;\n border-color: #ccc;\n color: #333;\n }\n\n .tree-action-btn i {\n font-size: 10px;\n }\n\n .tree-content {\n flex: 1;\n overflow-y: auto;\n padding: 8px;\n }\n\n .no-suites {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n color: #999;\n gap: 12px;\n }\n\n .no-suites i {\n font-size: 36px;\n color: #ddd;\n }\n\n .no-suites p {\n margin: 0;\n font-size: 13px;\n }\n `]\n})\nexport class SuiteTreeComponent {\n @Input() suites: SuiteHierarchyNode[] = [];\n @Input() selectedSuiteId: string \| null = null;\n @Output() suiteSelect = new EventEmitter<string>();\n\n onNodeClick(suiteId: string): void {\n this.suiteSelect.emit(suiteId);\n }\n\n onToggleExpand(node: SuiteHierarchyNode): void {\n node.expanded = !node.expanded;\n }\n\n expandAll(): void {\n this.setExpandedRecursive(this.suites, true);\n }\n\n collapseAll(): void {\n this.setExpandedRecursive(this.suites, false);\n }\n\n private setExpandedRecursive(nodes: SuiteHierarchyNode[], expanded: boolean): void {\n nodes.forEach(node => {\n node.expanded = expanded;\n if (node.children && node.children.length > 0) {\n this.setExpandedRecursive(node.children, expanded);\n }\n });\n }\n}\n\n@Component({\n standalone: false,\n selector: 'app-suite-tree-node',\n template: `\n <div class=\"tree-node\" [style.padding-left.px]=\"level * 16\">\n <div\n class=\"node-content\"\n [class.selected]=\"node.id === selectedId\"\n (click)=\"onClick()\"\n >\n @if (node.children && node.children.length > 0) {\n <button\n class=\"expand-btn\"\n (click)=\"onToggle($event)\"\n >\n <i class=\"fa-solid\" [class.fa-chevron-right]=\"!node.expanded\" [class.fa-chevron-down]=\"node.expanded\"></i>\n </button>\n }\n @if (!node.children \|\| node.children.length === 0) {\n <span class=\"expand-placeholder\"></span>\n }\n \n <i class=\"fa-solid fa-folder suite-icon\"></i>\n \n <span class=\"suite-name\">{{ node.name }}</span>\n \n <div class=\"suite-metrics\">\n <span class=\"test-count\" title=\"Test Count\">\n <i class=\"fa-solid fa-flask\"></i>\n {{ node.testCount }}\n </span>\n <span class=\"pass-rate\" [class]=\"getPassRateClass(node.passRate)\" title=\"Pass Rate\">\n {{ node.passRate.toFixed(0) }}%\n </span>\n </div>\n </div>\n \n @if (node.expanded && node.children && node.children.length > 0) {\n @for (child of node.children; track child.id) {\n <div>\n <app-suite-tree-node\n [node]=\"child\"\n [level]=\"level + 1\"\n [selectedId]=\"selectedId\"\n (nodeClick)=\"nodeClick.emit($event)\"\n (toggleExpand)=\"toggleExpand.emit($event)\"\n ></app-suite-tree-node>\n </div>\n }\n }\n </div>\n `,\n styles: [`\n .tree-node {\n margin-bottom: 2px;\n }\n\n .node-content {\n display: flex;\n align-items: center;\n padding: 8px 12px;\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.2s ease;\n gap: 8px;\n }\n\n .node-content:hover {\n background: #f8f9fa;\n }\n\n .node-content.selected {\n background: rgba(33, 150, 243, 0.1);\n border-left: 3px solid #2196f3;\n }\n\n .expand-btn {\n background: none;\n border: none;\n cursor: pointer;\n padding: 2px 6px;\n color: #666;\n font-size: 10px;\n transition: color 0.2s ease;\n min-width: 20px;\n }\n\n .expand-btn:hover {\n color: #333;\n }\n\n .expand-placeholder {\n width: 20px;\n }\n\n .suite-icon {\n font-size: 12px;\n color: #ff9800;\n }\n\n .suite-name {\n flex: 1;\n font-size: 12px;\n font-weight: 500;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .suite-metrics {\n display: flex;\n gap: 8px;\n align-items: center;\n font-size: 10px;\n }\n\n .test-count {\n display: flex;\n align-items: center;\n gap: 3px;\n color: #666;\n background: #f0f0f0;\n padding: 2px 6px;\n border-radius: 10px;\n }\n\n .test-count i {\n font-size: 9px;\n }\n\n .pass-rate {\n font-weight: 600;\n padding: 2px 6px;\n border-radius: 10px;\n min-width: 36px;\n text-align: center;\n }\n\n .pass-rate.excellent {\n background: rgba(76, 175, 80, 0.1);\n color: #4caf50;\n }\n\n .pass-rate.good {\n background: rgba(139, 195, 74, 0.1);\n color: #8bc34a;\n }\n\n .pass-rate.fair {\n background: rgba(255, 193, 7, 0.1);\n color: #ffc107;\n }\n\n .pass-rate.poor {\n background: rgba(244, 67, 54, 0.1);\n color: #f44336;\n }\n `]\n})\nexport class SuiteTreeNodeComponent {\n @Input() node!: SuiteHierarchyNode;\n @Input() level = 0;\n @Input() selectedId: string \| null = null;\n @Output() nodeClick = new EventEmitter<string>();\n @Output() toggleExpand = new EventEmitter<SuiteHierarchyNode>();\n\n onClick(): void {\n this.nodeClick.emit(this.node.id);\n }\n\n onToggle(event: Event): void {\n event.stopPropagation();\n this.toggleExpand.emit(this.node);\n }\n\n getPassRateClass(passRate: number): string {\n if (passRate >= 90) return 'excellent';\n if (passRate >= 75) return 'good';\n if (passRate >= 50) return 'fair';\n return 'poor';\n }\n}\n"]}
1	+ {"version":3,"file":"suite-tree.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/suite-tree.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { SuiteHierarchyNode } from '../../services/testing-instrumentation.service';\n\n@Component({\n standalone: false,\n selector: 'app-suite-tree',\n template: `\n <div class=\"suite-tree\">\n <div class=\"tree-header\">\n <h4>\n <i class=\"fa-solid fa-folder-tree\"></i>\n Test Suites\n </h4>\n <div class=\"tree-actions\">\n <button class=\"tree-action-btn\" (click)=\"expandAll()\" title=\"Expand All\">\n <i class=\"fa-solid fa-chevron-down\"></i>\n </button>\n <button class=\"tree-action-btn\" (click)=\"collapseAll()\" title=\"Collapse All\">\n <i class=\"fa-solid fa-chevron-up\"></i>\n </button>\n </div>\n </div>\n\n <div class=\"tree-content\">\n @if (suites && suites.length > 0) {\n @for (suite of suites; track suite.id) {\n <div>\n <app-suite-tree-node\n [node]=\"suite\"\n [level]=\"0\"\n [selectedId]=\"selectedSuiteId\"\n (nodeClick)=\"onNodeClick($event)\"\n (toggleExpand)=\"onToggleExpand($event)\"\n ></app-suite-tree-node>\n </div>\n }\n } @else {\n <div class=\"no-suites\">\n <i class=\"fa-solid fa-folder-open\"></i>\n <p>No test suites found</p>\n </div>\n }\n </div>\n </div>\n `,\n styles: [`\n .suite-tree {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: var(--mj-bg-surface);\n border-radius: 8px;\n overflow: hidden;\n }\n\n .tree-header {\n padding: 16px;\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .tree-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: var(--mj-text-primary);\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .tree-header h4 i {\n color: var(--mj-brand-primary);\n }\n\n .tree-actions {\n display: flex;\n gap: 6px;\n }\n\n .tree-action-btn {\n background: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n padding: 6px 10px;\n border-radius: 4px;\n cursor: pointer;\n font-size: 11px;\n color: var(--mj-text-secondary);\n transition: all 0.2s ease;\n }\n\n .tree-action-btn:hover {\n background: var(--mj-bg-surface-sunken);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-primary);\n }\n\n .tree-action-btn i {\n font-size: 10px;\n }\n\n .tree-content {\n flex: 1;\n overflow-y: auto;\n padding: 8px;\n }\n\n .no-suites {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n color: var(--mj-text-disabled);\n gap: 12px;\n }\n\n .no-suites i {\n font-size: 36px;\n color: var(--mj-border-default);\n }\n\n .no-suites p {\n margin: 0;\n font-size: 13px;\n }\n `]\n})\nexport class SuiteTreeComponent {\n @Input() suites: SuiteHierarchyNode[] = [];\n @Input() selectedSuiteId: string \| null = null;\n @Output() suiteSelect = new EventEmitter<string>();\n\n onNodeClick(suiteId: string): void {\n this.suiteSelect.emit(suiteId);\n }\n\n onToggleExpand(node: SuiteHierarchyNode): void {\n node.expanded = !node.expanded;\n }\n\n expandAll(): void {\n this.setExpandedRecursive(this.suites, true);\n }\n\n collapseAll(): void {\n this.setExpandedRecursive(this.suites, false);\n }\n\n private setExpandedRecursive(nodes: SuiteHierarchyNode[], expanded: boolean): void {\n nodes.forEach(node => {\n node.expanded = expanded;\n if (node.children && node.children.length > 0) {\n this.setExpandedRecursive(node.children, expanded);\n }\n });\n }\n}\n\n@Component({\n standalone: false,\n selector: 'app-suite-tree-node',\n template: `\n <div class=\"tree-node\" [style.padding-left.px]=\"level * 16\">\n <div\n class=\"node-content\"\n [class.selected]=\"node.id === selectedId\"\n (click)=\"onClick()\"\n >\n @if (node.children && node.children.length > 0) {\n <button\n class=\"expand-btn\"\n (click)=\"onToggle($event)\"\n >\n <i class=\"fa-solid\" [class.fa-chevron-right]=\"!node.expanded\" [class.fa-chevron-down]=\"node.expanded\"></i>\n </button>\n }\n @if (!node.children \|\| node.children.length === 0) {\n <span class=\"expand-placeholder\"></span>\n }\n \n <i class=\"fa-solid fa-folder suite-icon\"></i>\n \n <span class=\"suite-name\">{{ node.name }}</span>\n \n <div class=\"suite-metrics\">\n <span class=\"test-count\" title=\"Test Count\">\n <i class=\"fa-solid fa-flask\"></i>\n {{ node.testCount }}\n </span>\n <span class=\"pass-rate\" [class]=\"getPassRateClass(node.passRate)\" title=\"Pass Rate\">\n {{ node.passRate.toFixed(0) }}%\n </span>\n </div>\n </div>\n \n @if (node.expanded && node.children && node.children.length > 0) {\n @for (child of node.children; track child.id) {\n <div>\n <app-suite-tree-node\n [node]=\"child\"\n [level]=\"level + 1\"\n [selectedId]=\"selectedId\"\n (nodeClick)=\"nodeClick.emit($event)\"\n (toggleExpand)=\"toggleExpand.emit($event)\"\n ></app-suite-tree-node>\n </div>\n }\n }\n </div>\n `,\n styles: [`\n .tree-node {\n margin-bottom: 2px;\n }\n\n .node-content {\n display: flex;\n align-items: center;\n padding: 8px 12px;\n border-radius: 6px;\n cursor: pointer;\n transition: all 0.2s ease;\n gap: 8px;\n }\n\n .node-content:hover {\n background: var(--mj-bg-surface-card);\n }\n\n .node-content.selected {\n background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n border-left: 3px solid var(--mj-brand-primary);\n }\n\n .expand-btn {\n background: none;\n border: none;\n cursor: pointer;\n padding: 2px 6px;\n color: var(--mj-text-secondary);\n font-size: 10px;\n transition: color 0.2s ease;\n min-width: 20px;\n }\n\n .expand-btn:hover {\n color: var(--mj-text-primary);\n }\n\n .expand-placeholder {\n width: 20px;\n }\n\n .suite-icon {\n font-size: 12px;\n color: var(--mj-status-warning);\n }\n\n .suite-name {\n flex: 1;\n font-size: 12px;\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .suite-metrics {\n display: flex;\n gap: 8px;\n align-items: center;\n font-size: 10px;\n }\n\n .test-count {\n display: flex;\n align-items: center;\n gap: 3px;\n color: var(--mj-text-secondary);\n background: var(--mj-bg-surface-sunken);\n padding: 2px 6px;\n border-radius: 10px;\n }\n\n .test-count i {\n font-size: 9px;\n }\n\n .pass-rate {\n font-weight: 600;\n padding: 2px 6px;\n border-radius: 10px;\n min-width: 36px;\n text-align: center;\n }\n\n .pass-rate.excellent {\n background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n }\n\n .pass-rate.good {\n background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n }\n\n .pass-rate.fair {\n background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n }\n\n .pass-rate.poor {\n background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n color: var(--mj-status-error);\n }\n `]\n})\nexport class SuiteTreeNodeComponent {\n @Input() node!: SuiteHierarchyNode;\n @Input() level = 0;\n @Input() selectedId: string \| null = null;\n @Output() nodeClick = new EventEmitter<string>();\n @Output() toggleExpand = new EventEmitter<SuiteHierarchyNode>();\n\n onClick(): void {\n this.nodeClick.emit(this.node.id);\n }\n\n onToggle(event: Event): void {\n event.stopPropagation();\n this.toggleExpand.emit(this.node);\n }\n\n getPassRateClass(passRate: number): string {\n if (passRate >= 90) return 'excellent';\n if (passRate >= 75) return 'good';\n if (passRate >= 50) return 'fair';\n return 'poor';\n }\n}\n"]}

package/dist/Testing/components/widgets/test-run-detail-panel.component.js CHANGED Viewed

@@ -232,7 +232,7 @@ export class TestRunDetailPanelComponent {
             i0.ɵɵconditionalCreate(0, TestRunDetailPanelComponent_Conditional_0_Template, 60, 22, "div", 0);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.testRun ? 0 : -1);
-        } }, dependencies: [i1.DefaultValueAccessor, i1.NumberValueAccessor, i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.MinValidator, i1.MaxValidator, i1.NgModel, i2.TestStatusBadgeComponent, i2.ScoreIndicatorComponent, i2.CostDisplayComponent, i3.OracleBreakdownTableComponent, i4.DatePipe], styles: [".test-run-detail-panel[_ngcontent-%COMP%] {\n      background: white;\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .detail-header[_ngcontent-%COMP%] {\n      padding: 20px;\n      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n      color: white;\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n    }\n\n    .header-left[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n      margin: 0 0 8px 0;\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .header-meta[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 16px;\n      font-size: 12px;\n      opacity: 0.9;\n    }\n\n    .header-meta[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .header-right[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .close-btn[_ngcontent-%COMP%] {\n      background: rgba(255, 255, 255, 0.2);\n      border: none;\n      color: white;\n      padding: 8px 12px;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: background 0.2s ease;\n    }\n\n    .close-btn[_ngcontent-%COMP%]:hover {\n      background: rgba(255, 255, 255, 0.3);\n    }\n\n    .detail-content[_ngcontent-%COMP%] {\n      padding: 20px;\n    }\n\n    .metrics-section[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      gap: 16px;\n      margin-bottom: 24px;\n    }\n\n    .metric-card[_ngcontent-%COMP%] {\n      background: #f8f9fa;\n      padding: 16px;\n      border-radius: 8px;\n      border-left: 4px solid #2196f3;\n    }\n\n    .metric-label[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: #666;\n      font-weight: 600;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 8px;\n    }\n\n    .metric-value[_ngcontent-%COMP%] {\n      font-size: 16px;\n      font-weight: 600;\n      color: #333;\n    }\n\n    .target-link[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      color: #2196f3;\n      cursor: pointer;\n      font-size: 14px;\n    }\n\n    .target-link[_ngcontent-%COMP%]:hover {\n      text-decoration: underline;\n    }\n\n    .oracle-section[_ngcontent-%COMP%], \n   .details-section[_ngcontent-%COMP%], \n   .feedback-section[_ngcontent-%COMP%] {\n      margin-bottom: 24px;\n    }\n\n    .section-header[_ngcontent-%COMP%] {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 12px;\n      padding-bottom: 8px;\n      border-bottom: 1px solid #e0e0e0;\n    }\n\n    .section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: #2196f3;\n    }\n\n    .toggle-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #666;\n      cursor: pointer;\n      padding: 4px 8px;\n      border-radius: 4px;\n      transition: background 0.2s ease;\n    }\n\n    .toggle-btn[_ngcontent-%COMP%]:hover {\n      background: #f0f0f0;\n    }\n\n    .details-content[_ngcontent-%COMP%] {\n      margin-top: 12px;\n    }\n\n    .json-viewer[_ngcontent-%COMP%] {\n      background: #f8f9fa;\n      border: 1px solid #e0e0e0;\n      border-radius: 6px;\n      padding: 16px;\n      font-size: 11px;\n      line-height: 1.5;\n      overflow-x: auto;\n      max-height: 300px;\n      overflow-y: auto;\n      font-family: 'Courier New', monospace;\n    }\n\n    .feedback-form[_ngcontent-%COMP%] {\n      background: #f8f9fa;\n      padding: 16px;\n      border-radius: 8px;\n    }\n\n    .form-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 1fr 2fr;\n      gap: 16px;\n      margin-bottom: 16px;\n    }\n\n    .form-group[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .form-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n      font-size: 12px;\n      font-weight: 600;\n      color: #666;\n    }\n\n    .rating-input[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 14px;\n    }\n\n    .checkbox-group[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n    }\n\n    .checkbox-label[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 13px;\n      color: #333;\n      cursor: pointer;\n    }\n\n    .checkbox-label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n      width: 16px;\n      height: 16px;\n      cursor: pointer;\n    }\n\n    .comments-textarea[_ngcontent-%COMP%] {\n      padding: 10px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n      font-family: inherit;\n      resize: vertical;\n    }\n\n    .submit-btn[_ngcontent-%COMP%] {\n      background: #2196f3;\n      color: white;\n      border: none;\n      padding: 10px 20px;\n      border-radius: 4px;\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      transition: background 0.2s ease;\n    }\n\n    .submit-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: #1976d2;\n    }\n\n    .submit-btn[_ngcontent-%COMP%]:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    @media (max-width: 768px) {\n      .form-row[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n      }\n\n      .metrics-section[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n      }\n    }"] });
+        } }, dependencies: [i1.DefaultValueAccessor, i1.NumberValueAccessor, i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.MinValidator, i1.MaxValidator, i1.NgModel, i2.TestStatusBadgeComponent, i2.ScoreIndicatorComponent, i2.CostDisplayComponent, i3.OracleBreakdownTableComponent, i4.DatePipe], styles: [".test-run-detail-panel[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .detail-header[_ngcontent-%COMP%] {\n      padding: 20px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n    }\n\n    .header-left[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n      margin: 0 0 8px 0;\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .header-meta[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 16px;\n      font-size: 12px;\n      opacity: 0.9;\n    }\n\n    .header-meta[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .header-right[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .close-btn[_ngcontent-%COMP%] {\n      background: rgba(255, 255, 255, 0.2);\n      border: none;\n      color: var(--mj-text-inverse);\n      padding: 8px 12px;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: background 0.2s ease;\n    }\n\n    .close-btn[_ngcontent-%COMP%]:hover {\n      background: rgba(255, 255, 255, 0.3);\n    }\n\n    .detail-content[_ngcontent-%COMP%] {\n      padding: 20px;\n    }\n\n    .metrics-section[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      gap: 16px;\n      margin-bottom: 24px;\n    }\n\n    .metric-card[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-card);\n      padding: 16px;\n      border-radius: 8px;\n      border-left: 4px solid var(--mj-brand-primary);\n    }\n\n    .metric-label[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: var(--mj-text-secondary);\n      font-weight: 600;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 8px;\n    }\n\n    .metric-value[_ngcontent-%COMP%] {\n      font-size: 16px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .target-link[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      color: var(--mj-brand-primary);\n      cursor: pointer;\n      font-size: 14px;\n    }\n\n    .target-link[_ngcontent-%COMP%]:hover {\n      text-decoration: underline;\n    }\n\n    .oracle-section[_ngcontent-%COMP%], \n   .details-section[_ngcontent-%COMP%], \n   .feedback-section[_ngcontent-%COMP%] {\n      margin-bottom: 24px;\n    }\n\n    .section-header[_ngcontent-%COMP%] {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 12px;\n      padding-bottom: 8px;\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n    }\n\n    .toggle-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      padding: 4px 8px;\n      border-radius: 4px;\n      transition: background 0.2s ease;\n    }\n\n    .toggle-btn[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .details-content[_ngcontent-%COMP%] {\n      margin-top: 12px;\n    }\n\n    .json-viewer[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-card);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      padding: 16px;\n      font-size: 11px;\n      line-height: 1.5;\n      overflow-x: auto;\n      max-height: 300px;\n      overflow-y: auto;\n      font-family: 'Courier New', monospace;\n    }\n\n    .feedback-form[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface-card);\n      padding: 16px;\n      border-radius: 8px;\n    }\n\n    .form-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 1fr 2fr;\n      gap: 16px;\n      margin-bottom: 16px;\n    }\n\n    .form-group[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .form-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n    }\n\n    .rating-input[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 4px;\n      font-size: 14px;\n    }\n\n    .checkbox-group[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n    }\n\n    .checkbox-label[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 13px;\n      color: var(--mj-text-primary);\n      cursor: pointer;\n    }\n\n    .checkbox-label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n      width: 16px;\n      height: 16px;\n      cursor: pointer;\n    }\n\n    .comments-textarea[_ngcontent-%COMP%] {\n      padding: 10px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 4px;\n      font-size: 13px;\n      font-family: inherit;\n      resize: vertical;\n    }\n\n    .submit-btn[_ngcontent-%COMP%] {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      padding: 10px 20px;\n      border-radius: 4px;\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      transition: background 0.2s ease;\n    }\n\n    .submit-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .submit-btn[_ngcontent-%COMP%]:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    @media (max-width: 768px) {\n      .form-row[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n      }\n\n      .metrics-section[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n      }\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TestRunDetailPanelComponent, [{
         type: Component,
@@ -360,7 +360,7 @@ export class TestRunDetailPanelComponent {
         </div>
       </div>
     }
-    `, styles: ["\n    .test-run-detail-panel {\n      background: white;\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .detail-header {\n      padding: 20px;\n      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n      color: white;\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n    }\n\n    .header-left h3 {\n      margin: 0 0 8px 0;\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .header-meta {\n      display: flex;\n      gap: 16px;\n      font-size: 12px;\n      opacity: 0.9;\n    }\n\n    .header-meta span {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .header-right {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .close-btn {\n      background: rgba(255, 255, 255, 0.2);\n      border: none;\n      color: white;\n      padding: 8px 12px;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: background 0.2s ease;\n    }\n\n    .close-btn:hover {\n      background: rgba(255, 255, 255, 0.3);\n    }\n\n    .detail-content {\n      padding: 20px;\n    }\n\n    .metrics-section {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      gap: 16px;\n      margin-bottom: 24px;\n    }\n\n    .metric-card {\n      background: #f8f9fa;\n      padding: 16px;\n      border-radius: 8px;\n      border-left: 4px solid #2196f3;\n    }\n\n    .metric-label {\n      font-size: 11px;\n      color: #666;\n      font-weight: 600;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 8px;\n    }\n\n    .metric-value {\n      font-size: 16px;\n      font-weight: 600;\n      color: #333;\n    }\n\n    .target-link {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      color: #2196f3;\n      cursor: pointer;\n      font-size: 14px;\n    }\n\n    .target-link:hover {\n      text-decoration: underline;\n    }\n\n    .oracle-section,\n    .details-section,\n    .feedback-section {\n      margin-bottom: 24px;\n    }\n\n    .section-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 12px;\n      padding-bottom: 8px;\n      border-bottom: 1px solid #e0e0e0;\n    }\n\n    .section-header h4 {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .section-header h4 i {\n      color: #2196f3;\n    }\n\n    .toggle-btn {\n      background: none;\n      border: none;\n      color: #666;\n      cursor: pointer;\n      padding: 4px 8px;\n      border-radius: 4px;\n      transition: background 0.2s ease;\n    }\n\n    .toggle-btn:hover {\n      background: #f0f0f0;\n    }\n\n    .details-content {\n      margin-top: 12px;\n    }\n\n    .json-viewer {\n      background: #f8f9fa;\n      border: 1px solid #e0e0e0;\n      border-radius: 6px;\n      padding: 16px;\n      font-size: 11px;\n      line-height: 1.5;\n      overflow-x: auto;\n      max-height: 300px;\n      overflow-y: auto;\n      font-family: 'Courier New', monospace;\n    }\n\n    .feedback-form {\n      background: #f8f9fa;\n      padding: 16px;\n      border-radius: 8px;\n    }\n\n    .form-row {\n      display: grid;\n      grid-template-columns: 1fr 2fr;\n      gap: 16px;\n      margin-bottom: 16px;\n    }\n\n    .form-group {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .form-group label {\n      font-size: 12px;\n      font-weight: 600;\n      color: #666;\n    }\n\n    .rating-input {\n      padding: 8px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 14px;\n    }\n\n    .checkbox-group {\n      display: flex;\n      align-items: center;\n    }\n\n    .checkbox-label {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 13px;\n      color: #333;\n      cursor: pointer;\n    }\n\n    .checkbox-label input[type=\"checkbox\"] {\n      width: 16px;\n      height: 16px;\n      cursor: pointer;\n    }\n\n    .comments-textarea {\n      padding: 10px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n      font-family: inherit;\n      resize: vertical;\n    }\n\n    .submit-btn {\n      background: #2196f3;\n      color: white;\n      border: none;\n      padding: 10px 20px;\n      border-radius: 4px;\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      transition: background 0.2s ease;\n    }\n\n    .submit-btn:hover:not(:disabled) {\n      background: #1976d2;\n    }\n\n    .submit-btn:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    @media (max-width: 768px) {\n      .form-row {\n        grid-template-columns: 1fr;\n      }\n\n      .metrics-section {\n        grid-template-columns: 1fr;\n      }\n    }\n  "] }]
+    `, styles: ["\n    .test-run-detail-panel {\n      background: var(--mj-bg-surface);\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .detail-header {\n      padding: 20px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n    }\n\n    .header-left h3 {\n      margin: 0 0 8px 0;\n      font-size: 18px;\n      font-weight: 600;\n    }\n\n    .header-meta {\n      display: flex;\n      gap: 16px;\n      font-size: 12px;\n      opacity: 0.9;\n    }\n\n    .header-meta span {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .header-right {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .close-btn {\n      background: rgba(255, 255, 255, 0.2);\n      border: none;\n      color: var(--mj-text-inverse);\n      padding: 8px 12px;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: background 0.2s ease;\n    }\n\n    .close-btn:hover {\n      background: rgba(255, 255, 255, 0.3);\n    }\n\n    .detail-content {\n      padding: 20px;\n    }\n\n    .metrics-section {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      gap: 16px;\n      margin-bottom: 24px;\n    }\n\n    .metric-card {\n      background: var(--mj-bg-surface-card);\n      padding: 16px;\n      border-radius: 8px;\n      border-left: 4px solid var(--mj-brand-primary);\n    }\n\n    .metric-label {\n      font-size: 11px;\n      color: var(--mj-text-secondary);\n      font-weight: 600;\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      margin-bottom: 8px;\n    }\n\n    .metric-value {\n      font-size: 16px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .target-link {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      color: var(--mj-brand-primary);\n      cursor: pointer;\n      font-size: 14px;\n    }\n\n    .target-link:hover {\n      text-decoration: underline;\n    }\n\n    .oracle-section,\n    .details-section,\n    .feedback-section {\n      margin-bottom: 24px;\n    }\n\n    .section-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 12px;\n      padding-bottom: 8px;\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .section-header h4 {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .section-header h4 i {\n      color: var(--mj-brand-primary);\n    }\n\n    .toggle-btn {\n      background: none;\n      border: none;\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      padding: 4px 8px;\n      border-radius: 4px;\n      transition: background 0.2s ease;\n    }\n\n    .toggle-btn:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .details-content {\n      margin-top: 12px;\n    }\n\n    .json-viewer {\n      background: var(--mj-bg-surface-card);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      padding: 16px;\n      font-size: 11px;\n      line-height: 1.5;\n      overflow-x: auto;\n      max-height: 300px;\n      overflow-y: auto;\n      font-family: 'Courier New', monospace;\n    }\n\n    .feedback-form {\n      background: var(--mj-bg-surface-card);\n      padding: 16px;\n      border-radius: 8px;\n    }\n\n    .form-row {\n      display: grid;\n      grid-template-columns: 1fr 2fr;\n      gap: 16px;\n      margin-bottom: 16px;\n    }\n\n    .form-group {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .form-group label {\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n    }\n\n    .rating-input {\n      padding: 8px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 4px;\n      font-size: 14px;\n    }\n\n    .checkbox-group {\n      display: flex;\n      align-items: center;\n    }\n\n    .checkbox-label {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 13px;\n      color: var(--mj-text-primary);\n      cursor: pointer;\n    }\n\n    .checkbox-label input[type=\"checkbox\"] {\n      width: 16px;\n      height: 16px;\n      cursor: pointer;\n    }\n\n    .comments-textarea {\n      padding: 10px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 4px;\n      font-size: 13px;\n      font-family: inherit;\n      resize: vertical;\n    }\n\n    .submit-btn {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      padding: 10px 20px;\n      border-radius: 4px;\n      font-size: 13px;\n      font-weight: 500;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      transition: background 0.2s ease;\n    }\n\n    .submit-btn:hover:not(:disabled) {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .submit-btn:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    @media (max-width: 768px) {\n      .form-row {\n        grid-template-columns: 1fr;\n      }\n\n      .metrics-section {\n        grid-template-columns: 1fr;\n      }\n    }\n  "] }]
     }], null, { testRun: [{
             type: Input
         }], oracleResults: [{

package/dist/Testing/components/widgets/test-run-detail-panel.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"test-run-detail-panel.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/test-run-detail-panel.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { TestRunSummary } from '../../services/testing-instrumentation.service';\nimport { OracleResult } from './oracle-breakdown-table.component';\n\n@Component({\n standalone: false,\n selector: 'app-test-run-detail-panel',\n template: `\n @if (testRun) {\n <div class=\"test-run-detail-panel\">\n <div class=\"detail-header\">\n <div class=\"header-left\">\n <h3>{{ testRun.testName }}</h3>\n <div class=\"header-meta\">\n <span class=\"test-type\">\n <i class=\"fa-solid fa-tag\"></i>\n {{ testRun.testType }}\n </span>\n <span class=\"run-time\">\n <i class=\"fa-solid fa-clock\"></i>\n {{ testRun.runDateTime \| date:'medium' }}\n </span>\n </div>\n </div>\n <div class=\"header-right\">\n <app-test-status-badge [status]=\"testRun.status\"></app-test-status-badge>\n @if (closeable) {\n <button class=\"close-btn\" (click)=\"onClose()\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"detail-content\">\n <!-- Main Metrics -->\n <div class=\"metrics-section\">\n <div class=\"metric-card\">\n <div class=\"metric-label\">Score</div>\n <app-score-indicator [score]=\"testRun.score\" [showBar]=\"true\" [showIcon]=\"true\"></app-score-indicator>\n </div>\n <div class=\"metric-card\">\n <div class=\"metric-label\">Cost</div>\n <app-cost-display [cost]=\"testRun.cost\" [showIcon]=\"true\"></app-cost-display>\n </div>\n <div class=\"metric-card\">\n <div class=\"metric-label\">Duration</div>\n <div class=\"metric-value\">{{ formatDuration(testRun.duration) }}</div>\n </div>\n @if (testRun.targetType) {\n <div class=\"metric-card\">\n <div class=\"metric-label\">Target</div>\n <div class=\"metric-value target-link\" (click)=\"onViewTarget()\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n {{ testRun.targetType }}\n </div>\n </div>\n }\n </div>\n <!-- Oracle Breakdown -->\n @if (oracleResults && oracleResults.length > 0) {\n <div class=\"oracle-section\">\n <app-oracle-breakdown-table [results]=\"oracleResults\"></app-oracle-breakdown-table>\n </div>\n }\n <!-- Result Details -->\n @if (resultDetails) {\n <div class=\"details-section\">\n <div class=\"section-header\">\n <h4>\n <i class=\"fa-solid fa-file-alt\"></i>\n Result Details\n </h4>\n <button class=\"toggle-btn\" (click)=\"toggleResultDetails()\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!showResultDetails\" [class.fa-chevron-up]=\"showResultDetails\"></i>\n </button>\n </div>\n @if (showResultDetails) {\n <div class=\"details-content\">\n <pre class=\"json-viewer\">{{ formatJSON(resultDetails) }}</pre>\n </div>\n }\n </div>\n }\n <!-- Feedback Section -->\n <div class=\"feedback-section\">\n <div class=\"section-header\">\n <h4>\n <i class=\"fa-solid fa-comment-dots\"></i>\n Human Feedback\n </h4>\n </div>\n <div class=\"feedback-form\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Rating (1-10)</label>\n <input\n type=\"number\"\n [(ngModel)]=\"feedbackRating\"\n min=\"1\"\n max=\"10\"\n class=\"rating-input\"\n />\n </div>\n <div class=\"form-group\">\n <label>Is Correct?</label>\n <div class=\"checkbox-group\">\n <label class=\"checkbox-label\">\n <input type=\"checkbox\" [(ngModel)]=\"feedbackIsCorrect\" />\n <span>Yes, the automated result is correct</span>\n </label>\n </div>\n </div>\n </div>\n <div class=\"form-group\">\n <label>Comments</label>\n <textarea\n [(ngModel)]=\"feedbackComments\"\n rows=\"3\"\n class=\"comments-textarea\"\n placeholder=\"Enter your feedback comments...\"\n ></textarea>\n </div>\n <button class=\"submit-btn\" (click)=\"onSubmitFeedback()\" [disabled]=\"submittingFeedback\">\n <i class=\"fa-solid fa-paper-plane\"></i>\n {{ submittingFeedback ? 'Submitting...' : 'Submit Feedback' }}\n </button>\n </div>\n </div>\n </div>\n </div>\n }\n `,\n styles: [`\n .test-run-detail-panel {\n background: white;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n }\n\n .detail-header {\n padding: 20px;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n }\n\n .header-left h3 {\n margin: 0 0 8px 0;\n font-size: 18px;\n font-weight: 600;\n }\n\n .header-meta {\n display: flex;\n gap: 16px;\n font-size: 12px;\n opacity: 0.9;\n }\n\n .header-meta span {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .header-right {\n display: flex;\n align-items: center;\n gap: 12px;\n }\n\n .close-btn {\n background: rgba(255, 255, 255, 0.2);\n border: none;\n color: white;\n padding: 8px 12px;\n border-radius: 4px;\n cursor: pointer;\n transition: background 0.2s ease;\n }\n\n .close-btn:hover {\n background: rgba(255, 255, 255, 0.3);\n }\n\n .detail-content {\n padding: 20px;\n }\n\n .metrics-section {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n margin-bottom: 24px;\n }\n\n .metric-card {\n background: #f8f9fa;\n padding: 16px;\n border-radius: 8px;\n border-left: 4px solid #2196f3;\n }\n\n .metric-label {\n font-size: 11px;\n color: #666;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n margin-bottom: 8px;\n }\n\n .metric-value {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n }\n\n .target-link {\n display: flex;\n align-items: center;\n gap: 6px;\n color: #2196f3;\n cursor: pointer;\n font-size: 14px;\n }\n\n .target-link:hover {\n text-decoration: underline;\n }\n\n .oracle-section,\n .details-section,\n .feedback-section {\n margin-bottom: 24px;\n }\n\n .section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n padding-bottom: 8px;\n border-bottom: 1px solid #e0e0e0;\n }\n\n .section-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .section-header h4 i {\n color: #2196f3;\n }\n\n .toggle-btn {\n background: none;\n border: none;\n color: #666;\n cursor: pointer;\n padding: 4px 8px;\n border-radius: 4px;\n transition: background 0.2s ease;\n }\n\n .toggle-btn:hover {\n background: #f0f0f0;\n }\n\n .details-content {\n margin-top: 12px;\n }\n\n .json-viewer {\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 6px;\n padding: 16px;\n font-size: 11px;\n line-height: 1.5;\n overflow-x: auto;\n max-height: 300px;\n overflow-y: auto;\n font-family: 'Courier New', monospace;\n }\n\n .feedback-form {\n background: #f8f9fa;\n padding: 16px;\n border-radius: 8px;\n }\n\n .form-row {\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 16px;\n margin-bottom: 16px;\n }\n\n .form-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .form-group label {\n font-size: 12px;\n font-weight: 600;\n color: #666;\n }\n\n .rating-input {\n padding: 8px 12px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 14px;\n }\n\n .checkbox-group {\n display: flex;\n align-items: center;\n }\n\n .checkbox-label {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: #333;\n cursor: pointer;\n }\n\n .checkbox-label input[type=\"checkbox\"] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n }\n\n .comments-textarea {\n padding: 10px 12px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n resize: vertical;\n }\n\n .submit-btn {\n background: #2196f3;\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n transition: background 0.2s ease;\n }\n\n .submit-btn:hover:not(:disabled) {\n background: #1976d2;\n }\n\n .submit-btn:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n @media (max-width: 768px) {\n .form-row {\n grid-template-columns: 1fr;\n }\n\n .metrics-section {\n grid-template-columns: 1fr;\n }\n }\n `]\n})\nexport class TestRunDetailPanelComponent {\n @Input() testRun!: TestRunSummary;\n @Input() oracleResults: OracleResult[] = [];\n @Input() resultDetails: any = null;\n @Input() closeable = true;\n\n @Output() close = new EventEmitter<void>();\n @Output() viewTarget = new EventEmitter<{ type: string; id: string }>();\n @Output() submitFeedback = new EventEmitter<{\n rating: number;\n isCorrect: boolean;\n comments: string;\n }>();\n\n showResultDetails = false;\n feedbackRating = 5;\n feedbackIsCorrect = true;\n feedbackComments = '';\n submittingFeedback = false;\n\n formatDuration(milliseconds: number): string {\n if (milliseconds < 1000) {\n return `${milliseconds}ms`;\n }\n\n const seconds = Math.floor(milliseconds / 1000);\n const minutes = Math.floor(seconds / 60);\n\n if (minutes > 0) {\n return `${minutes}m ${seconds % 60}s`;\n }\n return `${seconds}s`;\n }\n\n formatJSON(obj: any): string {\n try {\n return JSON.stringify(obj, null, 2);\n } catch (error) {\n return String(obj);\n }\n }\n\n toggleResultDetails(): void {\n this.showResultDetails = !this.showResultDetails;\n }\n\n onClose(): void {\n this.close.emit();\n }\n\n onViewTarget(): void {\n if (this.testRun.targetType && this.testRun.targetLogID) {\n this.viewTarget.emit({\n type: this.testRun.targetType,\n id: this.testRun.targetLogID\n });\n }\n }\n\n async onSubmitFeedback(): Promise<void> {\n this.submittingFeedback = true;\n this.submitFeedback.emit({\n rating: this.feedbackRating,\n isCorrect: this.feedbackIsCorrect,\n comments: this.feedbackComments\n });\n\n // Reset after submission\n setTimeout(() => {\n this.submittingFeedback = false;\n this.feedbackRating = 5;\n this.feedbackIsCorrect = true;\n this.feedbackComments = '';\n }, 1000);\n }\n}\n"]}
1	+ {"version":3,"file":"test-run-detail-panel.component.js","sourceRoot":"","sources":["../../../../src/Testing/components/widgets/test-run-detail-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;;;;;;;;IA2BzD,kCAA8C;IAApB,+MAAS,gBAAS,KAAC;IAC3C,wBAAiC;IACnC,iBAAS;;;;IAqBP,AADF,+BAAyB,cACG;IAAA,sBAAM;IAAA,iBAAM;IACtC,+BAA+D;IAAzB,4MAAS,qBAAc,KAAC;IAC5D,wBAA6C;IAC7C,YACF;IACF,AADE,iBAAM,EACF;;;IAFF,eACF;IADE,0DACF;;;IAMJ,+BAA4B;IAC1B,iDAAmF;IACrF,iBAAM;;;IADwB,cAAyB;IAAzB,8CAAyB;;;IAiBjD,AADF,+BAA6B,cACF;IAAA,YAA+B;IAC1D,AAD0D,iBAAM,EAC1D;;;IADqB,eAA+B;IAA/B,6DAA+B;;;;IAV1D,AADF,AADF,+BAA6B,cACC,SACtB;IACF,wBAAoC;IACpC,gCACF;IAAA,iBAAK;IACL,kCAA2D;IAAhC,+MAAS,4BAAqB,KAAC;IACxD,wBAA+G;IAEnH,AADE,iBAAS,EACL;IACN,2HAAyB;IAK3B,iBAAM;;;IARoB,eAA4C;IAAC,AAA7C,4DAA4C,2CAA0C;IAG9G,cAIC;IAJD,mDAIC;;;;IApEH,AADF,AADF,AADF,8BAAmC,aACN,aACA,SACnB;IAAA,YAAsB;IAAA,iBAAK;IAE7B,AADF,8BAAyB,cACC;IACtB,uBAA+B;IAC/B,YACF;IAAA,iBAAO;IACP,+BAAuB;IACrB,wBAAiC;IACjC,aACF;;IAEJ,AADE,AADE,iBAAO,EACH,EACF;IACN,+BAA0B;IACxB,4CAAyE;IACzE,iHAAiB;IAMrB,AADE,iBAAM,EACF;IAKA,AADF,AADF,AAFF,gCAA4B,eAEG,eACF,eACG;IAAA,sBAAK;IAAA,iBAAM;IACrC,2CAAsG;IACxG,iBAAM;IAEJ,AADF,gCAAyB,eACG;IAAA,qBAAI;IAAA,iBAAM;IACpC,wCAA6E;IAC/E,iBAAM;IAEJ,AADF,gCAAyB,eACG;IAAA,yBAAQ;IAAA,iBAAM;IACxC,gCAA0B;IAAA,aAAsC;IAClE,AADkE,iBAAM,EAClE;IACN,8GAA0B;IAS5B,iBAAM;IAEN,8GAAiD;IAMjD,8GAAqB;IAqBjB,AADF,AADF,gCAA8B,eACA,UACtB;IACF,yBAAwC;IACxC,iCACF;IACF,AADE,iBAAK,EACD;IAIA,AADF,AADF,AADF,gCAA2B,eACH,eACI,aACf;IAAA,8BAAa;IAAA,iBAAQ;IAC5B,kCAMI;IAJF,gUAA4B;IAKhC,AAPE,iBAMI,EACA;IAEJ,AADF,gCAAwB,aACf;IAAA,4BAAW;IAAA,iBAAQ;IAGtB,AADF,AADF,gCAA4B,iBACI,iBAC6B;IAAlC,sUAA+B;IAAtD,iBAAyD;IACzD,6BAAM;IAAA,qDAAoC;IAIlD,AADE,AADE,AADE,AAD4C,iBAAO,EAC3C,EACJ,EACF,EACF;IAEJ,AADF,gCAAwB,aACf;IAAA,yBAAQ;IAAA,iBAAQ;IACvB,qCAKC;IAJC,uUAA8B;IAKlC,AADG,iBAAW,EACR;IACN,mCAAwF;IAA7D,gMAAS,yBAAkB,KAAC;IACrD,yBAAuC;IACvC,aACF;IAIR,AADE,AADE,AADE,AADE,iBAAS,EACL,EACF,EACF,EACF;;;IArHI,eAAsB;IAAtB,6CAAsB;IAItB,eACF;IADE,wDACF;IAGE,eACF;IADE,6FACF;IAIqB,eAAyB;IAAzB,8CAAyB;IAChD,cAIC;IAJD,4CAIC;IAQsB,eAAuB;IAAkB,AAAjB,AAAxB,4CAAuB,iBAAiB,kBAAkB;IAI7D,eAAqB;IAAC,AAAtB,0CAAqB,kBAAkB;IAI/B,eAAsC;IAAtC,oEAAsC;IAElE,cAQC;IARD,qDAQC;IAGH,cAIC;IAJD,mFAIC;IAED,cAiBC;IAjBD,gDAiBC;IAeS,gBAA4B;IAA5B,qDAA4B;IAUH,eAA+B;IAA/B,wDAA+B;IAS1D,eAA8B;IAA9B,uDAA8B;IAMsB,cAA+B;IAA/B,oDAA+B;IAErF,eACF;IADE,gGACF;;AAyQd,MAAM,OAAO,2BAA2B;IAC7B,OAAO,CAAkB;IACzB,aAAa,GAAmB,EAAE,CAAC;IACnC,aAAa,GAAQ,IAAI,CAAC;IAC1B,SAAS,GAAG,IAAI,CAAC;IAEhB,KAAK,GAAG,IAAI,YAAY,EAAQ,CAAC;IACjC,UAAU,GAAG,IAAI,YAAY,EAAgC,CAAC;IAC9D,cAAc,GAAG,IAAI,YAAY,EAIvC,CAAC;IAEL,iBAAiB,GAAG,KAAK,CAAC;IAC1B,cAAc,GAAG,CAAC,CAAC;IACnB,iBAAiB,GAAG,IAAI,CAAC;IACzB,gBAAgB,GAAG,EAAE,CAAC;IACtB,kBAAkB,GAAG,KAAK,CAAC;IAE3B,cAAc,CAAC,YAAoB;QACjC,IAAI,YAAY,GAAG,IAAI,EAAE,CAAC;YACxB,OAAO,GAAG,YAAY,IAAI,CAAC;QAC7B,CAAC;QAED,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;QAChD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;QAEzC,IAAI,OAAO,GAAG,CAAC,EAAE,CAAC;YAChB,OAAO,GAAG,OAAO,KAAK,OAAO,GAAG,EAAE,GAAG,CAAC;QACxC,CAAC;QACD,OAAO,GAAG,OAAO,GAAG,CAAC;IACvB,CAAC;IAED,UAAU,CAAC,GAAQ;QACjB,IAAI,CAAC;YACH,OAAO,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QACtC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC;QACrB,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;IACnD,CAAC;IAED,OAAO;QACL,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,YAAY;QACV,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;YACxD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;gBACnB,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU;gBAC7B,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,WAAW;aAC7B,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,KAAK,CAAC,gBAAgB;QACpB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;YACvB,MAAM,EAAE,IAAI,CAAC,cAAc;YAC3B,SAAS,EAAE,IAAI,CAAC,iBAAiB;YACjC,QAAQ,EAAE,IAAI,CAAC,gBAAgB;SAChC,CAAC,CAAC;QAEH,yBAAyB;QACzB,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;YACxB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;YAC9B,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC7B,CAAC,EAAE,IAAI,CAAC,CAAC;IACX,CAAC;qHA1EU,2BAA2B;6DAA3B,2BAA2B;YA9XpC,+FAAe;;YAAf,sCA0HC;;;iFAoQQ,2BAA2B;cAlYvC,SAAS;6BACI,KAAK,YACP,2BAA2B,YAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4HP;;kBAoQF,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBAEL,MAAM;;kBACN,MAAM;;kBACN,MAAM;;kFARI,2BAA2B","sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { TestRunSummary } from '../../services/testing-instrumentation.service';\nimport { OracleResult } from './oracle-breakdown-table.component';\n\n@Component({\n standalone: false,\n selector: 'app-test-run-detail-panel',\n template: `\n @if (testRun) {\n <div class=\"test-run-detail-panel\">\n <div class=\"detail-header\">\n <div class=\"header-left\">\n <h3>{{ testRun.testName }}</h3>\n <div class=\"header-meta\">\n <span class=\"test-type\">\n <i class=\"fa-solid fa-tag\"></i>\n {{ testRun.testType }}\n </span>\n <span class=\"run-time\">\n <i class=\"fa-solid fa-clock\"></i>\n {{ testRun.runDateTime \| date:'medium' }}\n </span>\n </div>\n </div>\n <div class=\"header-right\">\n <app-test-status-badge [status]=\"testRun.status\"></app-test-status-badge>\n @if (closeable) {\n <button class=\"close-btn\" (click)=\"onClose()\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"detail-content\">\n <!-- Main Metrics -->\n <div class=\"metrics-section\">\n <div class=\"metric-card\">\n <div class=\"metric-label\">Score</div>\n <app-score-indicator [score]=\"testRun.score\" [showBar]=\"true\" [showIcon]=\"true\"></app-score-indicator>\n </div>\n <div class=\"metric-card\">\n <div class=\"metric-label\">Cost</div>\n <app-cost-display [cost]=\"testRun.cost\" [showIcon]=\"true\"></app-cost-display>\n </div>\n <div class=\"metric-card\">\n <div class=\"metric-label\">Duration</div>\n <div class=\"metric-value\">{{ formatDuration(testRun.duration) }}</div>\n </div>\n @if (testRun.targetType) {\n <div class=\"metric-card\">\n <div class=\"metric-label\">Target</div>\n <div class=\"metric-value target-link\" (click)=\"onViewTarget()\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n {{ testRun.targetType }}\n </div>\n </div>\n }\n </div>\n <!-- Oracle Breakdown -->\n @if (oracleResults && oracleResults.length > 0) {\n <div class=\"oracle-section\">\n <app-oracle-breakdown-table [results]=\"oracleResults\"></app-oracle-breakdown-table>\n </div>\n }\n <!-- Result Details -->\n @if (resultDetails) {\n <div class=\"details-section\">\n <div class=\"section-header\">\n <h4>\n <i class=\"fa-solid fa-file-alt\"></i>\n Result Details\n </h4>\n <button class=\"toggle-btn\" (click)=\"toggleResultDetails()\">\n <i class=\"fa-solid\" [class.fa-chevron-down]=\"!showResultDetails\" [class.fa-chevron-up]=\"showResultDetails\"></i>\n </button>\n </div>\n @if (showResultDetails) {\n <div class=\"details-content\">\n <pre class=\"json-viewer\">{{ formatJSON(resultDetails) }}</pre>\n </div>\n }\n </div>\n }\n <!-- Feedback Section -->\n <div class=\"feedback-section\">\n <div class=\"section-header\">\n <h4>\n <i class=\"fa-solid fa-comment-dots\"></i>\n Human Feedback\n </h4>\n </div>\n <div class=\"feedback-form\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Rating (1-10)</label>\n <input\n type=\"number\"\n [(ngModel)]=\"feedbackRating\"\n min=\"1\"\n max=\"10\"\n class=\"rating-input\"\n />\n </div>\n <div class=\"form-group\">\n <label>Is Correct?</label>\n <div class=\"checkbox-group\">\n <label class=\"checkbox-label\">\n <input type=\"checkbox\" [(ngModel)]=\"feedbackIsCorrect\" />\n <span>Yes, the automated result is correct</span>\n </label>\n </div>\n </div>\n </div>\n <div class=\"form-group\">\n <label>Comments</label>\n <textarea\n [(ngModel)]=\"feedbackComments\"\n rows=\"3\"\n class=\"comments-textarea\"\n placeholder=\"Enter your feedback comments...\"\n ></textarea>\n </div>\n <button class=\"submit-btn\" (click)=\"onSubmitFeedback()\" [disabled]=\"submittingFeedback\">\n <i class=\"fa-solid fa-paper-plane\"></i>\n {{ submittingFeedback ? 'Submitting...' : 'Submit Feedback' }}\n </button>\n </div>\n </div>\n </div>\n </div>\n }\n `,\n styles: [`\n .test-run-detail-panel {\n background: var(--mj-bg-surface);\n border-radius: 8px;\n overflow: hidden;\n box-shadow: var(--mj-shadow-md);\n }\n\n .detail-header {\n padding: 20px;\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n }\n\n .header-left h3 {\n margin: 0 0 8px 0;\n font-size: 18px;\n font-weight: 600;\n }\n\n .header-meta {\n display: flex;\n gap: 16px;\n font-size: 12px;\n opacity: 0.9;\n }\n\n .header-meta span {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .header-right {\n display: flex;\n align-items: center;\n gap: 12px;\n }\n\n .close-btn {\n background: rgba(255, 255, 255, 0.2);\n border: none;\n color: var(--mj-text-inverse);\n padding: 8px 12px;\n border-radius: 4px;\n cursor: pointer;\n transition: background 0.2s ease;\n }\n\n .close-btn:hover {\n background: rgba(255, 255, 255, 0.3);\n }\n\n .detail-content {\n padding: 20px;\n }\n\n .metrics-section {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n margin-bottom: 24px;\n }\n\n .metric-card {\n background: var(--mj-bg-surface-card);\n padding: 16px;\n border-radius: 8px;\n border-left: 4px solid var(--mj-brand-primary);\n }\n\n .metric-label {\n font-size: 11px;\n color: var(--mj-text-secondary);\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n margin-bottom: 8px;\n }\n\n .metric-value {\n font-size: 16px;\n font-weight: 600;\n color: var(--mj-text-primary);\n }\n\n .target-link {\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-brand-primary);\n cursor: pointer;\n font-size: 14px;\n }\n\n .target-link:hover {\n text-decoration: underline;\n }\n\n .oracle-section,\n .details-section,\n .feedback-section {\n margin-bottom: 24px;\n }\n\n .section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--mj-border-default);\n }\n\n .section-header h4 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: var(--mj-text-primary);\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .section-header h4 i {\n color: var(--mj-brand-primary);\n }\n\n .toggle-btn {\n background: none;\n border: none;\n color: var(--mj-text-secondary);\n cursor: pointer;\n padding: 4px 8px;\n border-radius: 4px;\n transition: background 0.2s ease;\n }\n\n .toggle-btn:hover {\n background: var(--mj-bg-surface-sunken);\n }\n\n .details-content {\n margin-top: 12px;\n }\n\n .json-viewer {\n background: var(--mj-bg-surface-card);\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n padding: 16px;\n font-size: 11px;\n line-height: 1.5;\n overflow-x: auto;\n max-height: 300px;\n overflow-y: auto;\n font-family: 'Courier New', monospace;\n }\n\n .feedback-form {\n background: var(--mj-bg-surface-card);\n padding: 16px;\n border-radius: 8px;\n }\n\n .form-row {\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 16px;\n margin-bottom: 16px;\n }\n\n .form-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .form-group label {\n font-size: 12px;\n font-weight: 600;\n color: var(--mj-text-secondary);\n }\n\n .rating-input {\n padding: 8px 12px;\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n font-size: 14px;\n }\n\n .checkbox-group {\n display: flex;\n align-items: center;\n }\n\n .checkbox-label {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n color: var(--mj-text-primary);\n cursor: pointer;\n }\n\n .checkbox-label input[type=\"checkbox\"] {\n width: 16px;\n height: 16px;\n cursor: pointer;\n }\n\n .comments-textarea {\n padding: 10px 12px;\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n font-size: 13px;\n font-family: inherit;\n resize: vertical;\n }\n\n .submit-btn {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border: none;\n padding: 10px 20px;\n border-radius: 4px;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n transition: background 0.2s ease;\n }\n\n .submit-btn:hover:not(:disabled) {\n background: var(--mj-brand-primary-hover);\n }\n\n .submit-btn:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n @media (max-width: 768px) {\n .form-row {\n grid-template-columns: 1fr;\n }\n\n .metrics-section {\n grid-template-columns: 1fr;\n }\n }\n `]\n})\nexport class TestRunDetailPanelComponent {\n @Input() testRun!: TestRunSummary;\n @Input() oracleResults: OracleResult[] = [];\n @Input() resultDetails: any = null;\n @Input() closeable = true;\n\n @Output() close = new EventEmitter<void>();\n @Output() viewTarget = new EventEmitter<{ type: string; id: string }>();\n @Output() submitFeedback = new EventEmitter<{\n rating: number;\n isCorrect: boolean;\n comments: string;\n }>();\n\n showResultDetails = false;\n feedbackRating = 5;\n feedbackIsCorrect = true;\n feedbackComments = '';\n submittingFeedback = false;\n\n formatDuration(milliseconds: number): string {\n if (milliseconds < 1000) {\n return `${milliseconds}ms`;\n }\n\n const seconds = Math.floor(milliseconds / 1000);\n const minutes = Math.floor(seconds / 60);\n\n if (minutes > 0) {\n return `${minutes}m ${seconds % 60}s`;\n }\n return `${seconds}s`;\n }\n\n formatJSON(obj: any): string {\n try {\n return JSON.stringify(obj, null, 2);\n } catch (error) {\n return String(obj);\n }\n }\n\n toggleResultDetails(): void {\n this.showResultDetails = !this.showResultDetails;\n }\n\n onClose(): void {\n this.close.emit();\n }\n\n onViewTarget(): void {\n if (this.testRun.targetType && this.testRun.targetLogID) {\n this.viewTarget.emit({\n type: this.testRun.targetType,\n id: this.testRun.targetLogID\n });\n }\n }\n\n async onSubmitFeedback(): Promise<void> {\n this.submittingFeedback = true;\n this.submitFeedback.emit({\n rating: this.feedbackRating,\n isCorrect: this.feedbackIsCorrect,\n comments: this.feedbackComments\n });\n\n // Reset after submission\n setTimeout(() => {\n this.submittingFeedback = false;\n this.feedbackRating = 5;\n this.feedbackIsCorrect = true;\n this.feedbackComments = '';\n }, 1000);\n }\n}\n"]}

package/dist/Testing/testing-dashboard.component.js CHANGED Viewed

@@ -240,7 +240,7 @@ let TestingDashboardComponent = class TestingDashboardComponent extends BaseDash
             i0.ɵɵconditional(ctx.isLoading ? 1 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(!ctx.isLoading ? 2 : -1);
-        } }, dependencies: [i1.DialogContainerDirective, i2.EvaluationModeToggleComponent, i3.LoadingComponent, i4.TestingDashboardTabComponent, i5.TestingRunsComponent, i6.TestingAnalyticsComponent, i7.TestingReviewComponent], styles: ["\n\n\n\n\n\n.testing-dashboard-container[_ngcontent-%COMP%] {\n  height: 100%;\n  background: linear-gradient(135deg, #f5f7fa 0%, #e8eef5 100%);\n  position: relative;\n  overflow: hidden;\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.95);\n  backdrop-filter: blur(8px);\n}\n\n.loading-content[_ngcontent-%COMP%] {\n  text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n  box-sizing: border-box;\n  display: block;\n  position: absolute;\n  width: 64px;\n  height: 64px;\n  margin: 8px;\n  border: 8px solid #6366f1;\n  border-radius: 50%;\n  animation: _ngcontent-%COMP%_spinner-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-color: #6366f1 transparent transparent transparent;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n  margin-top: 20px;\n  font-size: 16px;\n  color: #64748b;\n  font-weight: 500;\n}\n\n\n\n.dashboard-content-wrapper[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.dashboard-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n}\n\n\n\n.testing-dashboard-nav[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-start;\n  gap: 2px;\n  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);\n  border-bottom: 1px solid rgba(99, 102, 241, 0.1);\n  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.06);\n  padding: 0 16px;\n  position: relative;\n  z-index: 10;\n}\n\n.nav-item[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  padding: 16px 24px;\n  cursor: pointer;\n  color: #64748b;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-bottom: 3px solid transparent;\n  white-space: nowrap;\n  position: relative;\n  font-weight: 500;\n}\n\n.nav-item[_ngcontent-%COMP%]::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 3px;\n  background: transparent;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-radius: 8px 8px 0 0;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover {\n  color: #6366f1;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover::before {\n  background: linear-gradient(180deg, rgba(99, 102, 241, 0.08) 0%, rgba(139, 92, 246, 0.04) 100%);\n}\n\n.nav-item.active[_ngcontent-%COMP%] {\n  color: #6366f1;\n  border-bottom-color: #6366f1;\n}\n\n.nav-item.active[_ngcontent-%COMP%]::before {\n  background: linear-gradient(180deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.05) 100%);\n}\n\n.nav-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  position: relative;\n  z-index: 1;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n  transform: scale(1.1);\n}\n\n.nav-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 600;\n  letter-spacing: 0.2px;\n  position: relative;\n  z-index: 1;\n}\n\n\n\n.nav-spacer[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n\n\n@media (max-width: 768px) {\n  .testing-dashboard-nav[_ngcontent-%COMP%] {\n    padding: 0 8px;\n    overflow-x: auto;\n  }\n\n  .nav-item[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n    gap: 8px;\n  }\n\n  .nav-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 11px;\n  }\n\n  .nav-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 18px;\n  }\n}"], changeDetection: 0 });
+        } }, dependencies: [i1.DialogContainerDirective, i2.EvaluationModeToggleComponent, i3.LoadingComponent, i4.TestingDashboardTabComponent, i5.TestingRunsComponent, i6.TestingAnalyticsComponent, i7.TestingReviewComponent], styles: ["\n\n\n\n\n\n.testing-dashboard-container[_ngcontent-%COMP%] {\n  height: 100%;\n  background: var(--mj-bg-surface-sunken);\n  position: relative;\n  overflow: hidden;\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  backdrop-filter: blur(8px);\n}\n\n.loading-content[_ngcontent-%COMP%] {\n  text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n  box-sizing: border-box;\n  display: block;\n  position: absolute;\n  width: 64px;\n  height: 64px;\n  margin: 8px;\n  border: 8px solid var(--mj-brand-primary);\n  border-radius: 50%;\n  animation: _ngcontent-%COMP%_spinner-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-color: var(--mj-brand-primary) transparent transparent transparent;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n  margin-top: 20px;\n  font-size: 16px;\n  color: var(--mj-text-muted);\n  font-weight: 500;\n}\n\n\n\n.dashboard-content-wrapper[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.dashboard-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n}\n\n\n\n.testing-dashboard-nav[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-start;\n  gap: 2px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  box-shadow: var(--mj-shadow-sm);\n  padding: 0 16px;\n  position: relative;\n  z-index: 10;\n}\n\n.nav-item[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  padding: 16px 24px;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-bottom: 3px solid transparent;\n  white-space: nowrap;\n  position: relative;\n  font-weight: 500;\n}\n\n.nav-item[_ngcontent-%COMP%]::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 3px;\n  background: transparent;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-radius: 8px 8px 0 0;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover {\n  color: var(--mj-brand-primary);\n}\n\n.nav-item[_ngcontent-%COMP%]:hover::before {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n\n.nav-item.active[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.nav-item.active[_ngcontent-%COMP%]::before {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.nav-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  position: relative;\n  z-index: 1;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n  transform: scale(1.1);\n}\n\n.nav-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 600;\n  letter-spacing: 0.2px;\n  position: relative;\n  z-index: 1;\n}\n\n\n\n.nav-spacer[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n\n\n@media (max-width: 768px) {\n  .testing-dashboard-nav[_ngcontent-%COMP%] {\n    padding: 0 8px;\n    overflow-x: auto;\n  }\n\n  .nav-item[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n    gap: 8px;\n  }\n\n  .nav-item[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 11px;\n  }\n\n  .nav-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 18px;\n  }\n}"], changeDetection: 0 });
 };
 TestingDashboardComponent = __decorate([
     RegisterClass(BaseDashboard, 'TestingDashboard')
@@ -248,7 +248,7 @@ TestingDashboardComponent = __decorate([
 export { TestingDashboardComponent };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TestingDashboardComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-testing-dashboard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"testing-dashboard-container\" kendoDialogContainer>\n  @if (isLoading) {\n    <div class=\"loading-container\">\n      <mj-loading text=\"Loading Testing Dashboard...\" size=\"large\"></mj-loading>\n    </div>\n  }\n\n  @if (!isLoading) {\n    <div class=\"dashboard-content-wrapper\">\n      <div class=\"testing-dashboard-nav\">\n        @for (navItem of navigationConfig; track $index) {\n          <div\n            class=\"nav-item\"\n            [class.active]=\"navItem.selected\"\n            (click)=\"onTabChange(navigationItems[$index])\"\n          >\n            <i [class]=\"navItem.icon\"></i>\n            <span>{{ navItem.text }}</span>\n          </div>\n        }\n        <div class=\"nav-spacer\"></div>\n        <app-evaluation-mode-toggle></app-evaluation-mode-toggle>\n      </div>\n\n      <div class=\"dashboard-content\">\n        @if (activeTab === 'dashboard' && hasVisited('dashboard')) {\n          <app-testing-dashboard-tab\n            [initialState]=\"dashboardState\"\n            (stateChange)=\"onDashboardStateChange($event)\"\n          ></app-testing-dashboard-tab>\n        }\n\n        @if (activeTab === 'runs' && hasVisited('runs')) {\n          <app-testing-runs\n            [initialState]=\"runsState\"\n            (stateChange)=\"onRunsStateChange($event)\"\n          ></app-testing-runs>\n        }\n\n        @if (activeTab === 'analytics' && hasVisited('analytics')) {\n          <app-testing-analytics\n            [initialState]=\"analyticsState\"\n            (stateChange)=\"onAnalyticsStateChange($event)\"\n          ></app-testing-analytics>\n        }\n\n        @if (activeTab === 'review' && hasVisited('review')) {\n          <app-testing-review\n            [initialState]=\"reviewState\"\n            (stateChange)=\"onReviewStateChange($event)\"\n          ></app-testing-review>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: ["/* ============================================\n   Testing Dashboard - Premium Design System\n   Based on AI Dashboard patterns\n   ============================================ */\n\n.testing-dashboard-container {\n  height: 100%;\n  background: linear-gradient(135deg, #f5f7fa 0%, #e8eef5 100%);\n  position: relative;\n  overflow: hidden;\n}\n\n/* Loading State */\n.loading-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  background: rgba(255, 255, 255, 0.95);\n  backdrop-filter: blur(8px);\n}\n\n.loading-content {\n  text-align: center;\n}\n\n.loading-spinner {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n}\n\n.spinner-ring {\n  box-sizing: border-box;\n  display: block;\n  position: absolute;\n  width: 64px;\n  height: 64px;\n  margin: 8px;\n  border: 8px solid #6366f1;\n  border-radius: 50%;\n  animation: spinner-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-color: #6366f1 transparent transparent transparent;\n}\n\n.spinner-ring:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner-ring:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n@keyframes spinner-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-text {\n  margin-top: 20px;\n  font-size: 16px;\n  color: #64748b;\n  font-weight: 500;\n}\n\n/* Dashboard Layout */\n.dashboard-content-wrapper {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.dashboard-content {\n  flex: 1;\n  overflow: hidden;\n}\n\n/* Premium Navigation Tabs */\n.testing-dashboard-nav {\n  display: flex;\n  justify-content: flex-start;\n  gap: 2px;\n  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);\n  border-bottom: 1px solid rgba(99, 102, 241, 0.1);\n  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.06);\n  padding: 0 16px;\n  position: relative;\n  z-index: 10;\n}\n\n.nav-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  padding: 16px 24px;\n  cursor: pointer;\n  color: #64748b;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-bottom: 3px solid transparent;\n  white-space: nowrap;\n  position: relative;\n  font-weight: 500;\n}\n\n.nav-item::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 3px;\n  background: transparent;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-radius: 8px 8px 0 0;\n}\n\n.nav-item:hover {\n  color: #6366f1;\n}\n\n.nav-item:hover::before {\n  background: linear-gradient(180deg, rgba(99, 102, 241, 0.08) 0%, rgba(139, 92, 246, 0.04) 100%);\n}\n\n.nav-item.active {\n  color: #6366f1;\n  border-bottom-color: #6366f1;\n}\n\n.nav-item.active::before {\n  background: linear-gradient(180deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.05) 100%);\n}\n\n.nav-item i {\n  font-size: 16px;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  position: relative;\n  z-index: 1;\n}\n\n.nav-item:hover i {\n  transform: scale(1.1);\n}\n\n.nav-item span {\n  font-size: 13px;\n  font-weight: 600;\n  letter-spacing: 0.2px;\n  position: relative;\n  z-index: 1;\n}\n\n/* Spacer for flex layout */\n.nav-spacer {\n  flex: 1;\n}\n\n/* Responsive */\n@media (max-width: 768px) {\n  .testing-dashboard-nav {\n    padding: 0 8px;\n    overflow-x: auto;\n  }\n\n  .nav-item {\n    padding: 12px 16px;\n    gap: 8px;\n  }\n\n  .nav-item span {\n    font-size: 11px;\n  }\n\n  .nav-item i {\n    font-size: 18px;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-testing-dashboard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"testing-dashboard-container\" kendoDialogContainer>\n  @if (isLoading) {\n    <div class=\"loading-container\">\n      <mj-loading text=\"Loading Testing Dashboard...\" size=\"large\"></mj-loading>\n    </div>\n  }\n\n  @if (!isLoading) {\n    <div class=\"dashboard-content-wrapper\">\n      <div class=\"testing-dashboard-nav\">\n        @for (navItem of navigationConfig; track $index) {\n          <div\n            class=\"nav-item\"\n            [class.active]=\"navItem.selected\"\n            (click)=\"onTabChange(navigationItems[$index])\"\n          >\n            <i [class]=\"navItem.icon\"></i>\n            <span>{{ navItem.text }}</span>\n          </div>\n        }\n        <div class=\"nav-spacer\"></div>\n        <app-evaluation-mode-toggle></app-evaluation-mode-toggle>\n      </div>\n\n      <div class=\"dashboard-content\">\n        @if (activeTab === 'dashboard' && hasVisited('dashboard')) {\n          <app-testing-dashboard-tab\n            [initialState]=\"dashboardState\"\n            (stateChange)=\"onDashboardStateChange($event)\"\n          ></app-testing-dashboard-tab>\n        }\n\n        @if (activeTab === 'runs' && hasVisited('runs')) {\n          <app-testing-runs\n            [initialState]=\"runsState\"\n            (stateChange)=\"onRunsStateChange($event)\"\n          ></app-testing-runs>\n        }\n\n        @if (activeTab === 'analytics' && hasVisited('analytics')) {\n          <app-testing-analytics\n            [initialState]=\"analyticsState\"\n            (stateChange)=\"onAnalyticsStateChange($event)\"\n          ></app-testing-analytics>\n        }\n\n        @if (activeTab === 'review' && hasVisited('review')) {\n          <app-testing-review\n            [initialState]=\"reviewState\"\n            (stateChange)=\"onReviewStateChange($event)\"\n          ></app-testing-review>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: ["/* ============================================\n   Testing Dashboard - Premium Design System\n   Based on AI Dashboard patterns\n   ============================================ */\n\n.testing-dashboard-container {\n  height: 100%;\n  background: var(--mj-bg-surface-sunken);\n  position: relative;\n  overflow: hidden;\n}\n\n/* Loading State */\n.loading-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  backdrop-filter: blur(8px);\n}\n\n.loading-content {\n  text-align: center;\n}\n\n.loading-spinner {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n}\n\n.spinner-ring {\n  box-sizing: border-box;\n  display: block;\n  position: absolute;\n  width: 64px;\n  height: 64px;\n  margin: 8px;\n  border: 8px solid var(--mj-brand-primary);\n  border-radius: 50%;\n  animation: spinner-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-color: var(--mj-brand-primary) transparent transparent transparent;\n}\n\n.spinner-ring:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner-ring:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n@keyframes spinner-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.loading-text {\n  margin-top: 20px;\n  font-size: 16px;\n  color: var(--mj-text-muted);\n  font-weight: 500;\n}\n\n/* Dashboard Layout */\n.dashboard-content-wrapper {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.dashboard-content {\n  flex: 1;\n  overflow: hidden;\n}\n\n/* Premium Navigation Tabs */\n.testing-dashboard-nav {\n  display: flex;\n  justify-content: flex-start;\n  gap: 2px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  box-shadow: var(--mj-shadow-sm);\n  padding: 0 16px;\n  position: relative;\n  z-index: 10;\n}\n\n.nav-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  padding: 16px 24px;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-bottom: 3px solid transparent;\n  white-space: nowrap;\n  position: relative;\n  font-weight: 500;\n}\n\n.nav-item::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 3px;\n  background: transparent;\n  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);\n  border-radius: 8px 8px 0 0;\n}\n\n.nav-item:hover {\n  color: var(--mj-brand-primary);\n}\n\n.nav-item:hover::before {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n}\n\n.nav-item.active {\n  color: var(--mj-brand-primary);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.nav-item.active::before {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.nav-item i {\n  font-size: 16px;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  position: relative;\n  z-index: 1;\n}\n\n.nav-item:hover i {\n  transform: scale(1.1);\n}\n\n.nav-item span {\n  font-size: 13px;\n  font-weight: 600;\n  letter-spacing: 0.2px;\n  position: relative;\n  z-index: 1;\n}\n\n/* Spacer for flex layout */\n.nav-spacer {\n  flex: 1;\n}\n\n/* Responsive */\n@media (max-width: 768px) {\n  .testing-dashboard-nav {\n    padding: 0 8px;\n    overflow-x: auto;\n  }\n\n  .nav-item {\n    padding: 12px 16px;\n    gap: 8px;\n  }\n\n  .nav-item span {\n    font-size: 11px;\n  }\n\n  .nav-item i {\n    font-size: 18px;\n  }\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TestingDashboardComponent, { className: "TestingDashboardComponent", filePath: "src/Testing/testing-dashboard.component.ts", lineNumber: 24 }); })();
 //# sourceMappingURL=testing-dashboard.component.js.map