@cqa-lib/cqa-ui 1.0.0 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/badge/badge.component.mjs +3 -3
- package/esm2020/lib/dashboards/chart-card/chart-card.component.mjs +3 -3
- package/esm2020/lib/dashboards/coverage-module-card/coverage-module-card.component.mjs +46 -4
- package/esm2020/lib/dashboards/dashboard-header/dashboard-header.component.mjs +6 -3
- package/esm2020/lib/dashboards/failed-test-cases-card/failed-test-cases-card.component.mjs +6 -7
- package/esm2020/lib/dashboards/insight-card/insight-card.component.mjs +10 -10
- package/esm2020/lib/dashboards/test-distribution-card/test-distribution-card.component.mjs +4 -5
- package/fesm2015/cqa-lib-cqa-ui.mjs +65 -21
- package/fesm2015/cqa-lib-cqa-ui.mjs.map +1 -1
- package/fesm2020/cqa-lib-cqa-ui.mjs +65 -21
- package/fesm2020/cqa-lib-cqa-ui.mjs.map +1 -1
- package/lib/dashboards/coverage-module-card/coverage-module-card.component.d.ts +13 -1
- package/lib/dashboards/dashboard-header/dashboard-header.component.d.ts +2 -1
- package/package.json +1 -1
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.eot +0 -0
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.otf +0 -0
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.svg +14730 -0
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.ttf +0 -0
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.woff +0 -0
- package/src/assets/fonts/SFUIText-Bold/SF-UI-Text-Bold.woff2 +0 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.eot +0 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.otf +0 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.svg +21333 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.ttf +0 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.woff +0 -0
- package/src/assets/fonts/SFUIText-Light/SF-UI-Text-Light.woff2 +0 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.eot +0 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.otf +0 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.svg +14584 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.ttf +0 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.woff +0 -0
- package/src/assets/fonts/SFUIText-Medium/SF-UI-Text-Medium.woff2 +0 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.eot +0 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.otf +0 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.svg +17870 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.ttf +0 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.woff +0 -0
- package/src/assets/fonts/SFUIText-Regular/SF-UI-Text-Regular.woff2 +0 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.eot +0 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.otf +0 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.svg +14732 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.ttf +0 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.woff +0 -0
- package/src/assets/fonts/SFUIText-Semibold/SF-UI-Text-Semibold.woff2 +0 -0
- package/styles.css +1 -1
- package/storybook-static/assets/images/README.md +0 -66
|
@@ -1850,10 +1850,10 @@ class ChartCardComponent {
|
|
|
1850
1850
|
}
|
|
1851
1851
|
}
|
|
1852
1852
|
ChartCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ChartCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1853
|
-
ChartCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ChartCardComponent, selector: "cqa-chart-card", inputs: { title: "title", subtitle: "subtitle", cardClass: "cardClass" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-
|
|
1853
|
+
ChartCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ChartCardComponent, selector: "cqa-chart-card", inputs: { title: "title", subtitle: "subtitle", cardClass: "cardClass" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-border cqa-border-border-default cqa-rounded-[8px] cqa-shadow-card\"\n [ngClass]=\"cardClass\">\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-px-[13px] cqa-py-[6px]\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-text-[16px] cqa-leading-6 cqa-text-[#111827]\">{{ title }}</div>\n <div *ngIf=\"subtitle\" class=\"cqa-text-[12px] cqa-leading-4 cqa-text-[#6A7282] cqa-mt-0.5\">{{ subtitle }}</div>\n </div>\n <!-- Right-side actions slot -->\n <ng-content select=\"[chart-actions]\"></ng-content>\n </div>\n\n <!-- Chart/content area -->\n <div class=\"cqa-px-[13px]\">\n <div class=\"cqa-w-full cqa-min-h-[220px]\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>", directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1854
1854
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ChartCardComponent, decorators: [{
|
|
1855
1855
|
type: Component,
|
|
1856
|
-
args: [{ selector: 'cqa-chart-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-
|
|
1856
|
+
args: [{ selector: 'cqa-chart-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-border cqa-border-border-default cqa-rounded-[8px] cqa-shadow-card\"\n [ngClass]=\"cardClass\">\n <!-- Header -->\n <div\n class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-px-[13px] cqa-py-[6px]\">\n <div class=\"cqa-flex cqa-flex-col\">\n <div class=\"cqa-text-[16px] cqa-leading-6 cqa-text-[#111827]\">{{ title }}</div>\n <div *ngIf=\"subtitle\" class=\"cqa-text-[12px] cqa-leading-4 cqa-text-[#6A7282] cqa-mt-0.5\">{{ subtitle }}</div>\n </div>\n <!-- Right-side actions slot -->\n <ng-content select=\"[chart-actions]\"></ng-content>\n </div>\n\n <!-- Chart/content area -->\n <div class=\"cqa-px-[13px]\">\n <div class=\"cqa-w-full cqa-min-h-[220px]\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>", styles: [] }]
|
|
1857
1857
|
}], propDecorators: { title: [{
|
|
1858
1858
|
type: Input
|
|
1859
1859
|
}], subtitle: [{
|
|
@@ -1910,6 +1910,7 @@ class DashboardHeaderComponent {
|
|
|
1910
1910
|
this.title = '';
|
|
1911
1911
|
this.badgeClass = 'bg-[#D1FAE5] text-[#065F46]';
|
|
1912
1912
|
this.headerClass = '';
|
|
1913
|
+
this.showHeader = true;
|
|
1913
1914
|
// Optional workspace select on the right
|
|
1914
1915
|
this.workspaceOptions = [];
|
|
1915
1916
|
this.workspacePlaceholder = 'Workspace';
|
|
@@ -1953,10 +1954,10 @@ class DashboardHeaderComponent {
|
|
|
1953
1954
|
}
|
|
1954
1955
|
}
|
|
1955
1956
|
DashboardHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DashboardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1956
|
-
DashboardHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DashboardHeaderComponent, selector: "cqa-dashboard-header", inputs: { title: "title", badgeText: "badgeText", badgeClass: "badgeClass", headerClass: "headerClass", workspaceOptions: "workspaceOptions", workspacePlaceholder: "workspacePlaceholder", workspaceDisabled: "workspaceDisabled", workspaceValue: "workspaceValue", workspaceMultiple: "workspaceMultiple", workspaceSearchable: "workspaceSearchable" }, outputs: { workspaceValueChange: "workspaceValueChange" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-w-full cqa-flex cqa-items-end cqa-justify-between cqa-bg-white cqa-pr-6 cqa-pl-2 lg:cqa-px-6 lg:cqa-py-[6px] cqa-py-2 cqa-border-b cqa-border-default cqa-shadow-header\"\n [ngClass]=\"headerClass\">\n <!-- Left branding block -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n <div class=\"cqa-pr-4 lg:cqa-hidden cqa-gap-2 md:cqa-flex\">\n <cqa-button variant=\"filled\" icon=\"\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"31\" height=\"22\" viewBox=\"0 0 31 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.16675 11H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 16.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 5.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button
|
|
1957
|
+
DashboardHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DashboardHeaderComponent, selector: "cqa-dashboard-header", inputs: { title: "title", badgeText: "badgeText", badgeClass: "badgeClass", headerClass: "headerClass", showHeader: "showHeader", workspaceOptions: "workspaceOptions", workspacePlaceholder: "workspacePlaceholder", workspaceDisabled: "workspaceDisabled", workspaceValue: "workspaceValue", workspaceMultiple: "workspaceMultiple", workspaceSearchable: "workspaceSearchable" }, outputs: { workspaceValueChange: "workspaceValueChange" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"cqa-ui-root\" *ngIf=\"showHeader\">\n <div\n class=\"cqa-w-full cqa-flex cqa-items-end cqa-justify-between cqa-bg-white cqa-pr-6 cqa-pl-2 lg:cqa-px-6 lg:cqa-py-[6px] cqa-py-2 cqa-border-b cqa-border-default cqa-shadow-header\"\n [ngClass]=\"headerClass\">\n <!-- Left branding block -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n <div class=\"cqa-pr-4 lg:cqa-hidden cqa-gap-2 md:cqa-flex cqa-hidden\">\n <!-- <cqa-button variant=\"filled\" icon=\"\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"31\" height=\"22\" viewBox=\"0 0 31 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.16675 11H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 16.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 5.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button> -->\n <!-- <span class=\"cqa-border-l cqa-border-primary-surface cqa-hidden md:cqa-flex\"></span> -->\n <cqa-button variant=\"filled\" icon=\"\" class=\"cqa-hidden md:cqa-flex\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4.58337 11H17.4167\" stroke=\"white\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M11 4.58301V17.4163\" stroke=\"white\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button>\n </div>\n <!-- Optional projected logo -->\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect x=\"0.5\" y=\"0.5\" width=\"31\" height=\"31\" rx=\"15.5\" fill=\"url(#pattern0_6303_22035)\" />\n <rect x=\"0.5\" y=\"0.5\" width=\"31\" height=\"31\" rx=\"15.5\" stroke=\"#D8D9FC\" />\n <defs>\n <pattern id=\"pattern0_6303_22035\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_6303_22035\" transform=\"scale(0.005)\" />\n </pattern>\n <image id=\"image0_6303_22035\" width=\"200\" height=\"200\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBw8SEBMQEBASEBAQEBYRFRUXFRARERASGRkWGxYXGBUYHigsGBomGxUYITEhJSkrLjouGSAzODMsNygtLjcBCgoKDg0OGxAQGy4dICUrNy0rKysrMDctLisvLS0tKy0tLTcuLS0tMDctNi0tLSstLS0rLS0rLTEtLS0tLS0tLf/AABEIAMgAyAMBIgACEQEDEQH/xAAcAAEAAgIDAQAAAAAAAAAAAAAABQYCBwEDBAj/xABBEAABAwICAwsKBQUAAwEAAAABAAIDBBEFIQYSQQciMVFSYXGBkaHRExQWIzJUkqKxwRdCYnKyU4LC4fAkNPEV/8QAGwEBAAIDAQEAAAAAAAAAAAAAAAIDAQQFBgf/xAAuEQACAQIEAwYGAwAAAAAAAAAAAQIDEQQSIVETMUEFUmGBkbEUIjJCccEVodH/2gAMAwEAAhEDEQA/AN4oiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiA81XK5jdcDWDc3DaW8Y5xwrkyFzNeIg3F2n8ruZd6r/AJbzSo1DlTzm7eKN+3qz71KKuRbsS1JViVhLbtIJa4H2mOHCCF1UNfrPdC+zZo7awzs5p4HtvsPdwKMxwuppRVxi7HEMmbyh+V3SuNI4TJEytpT66Aa7CPzxn2mnjy2KagvJ+5jMyS8/1JxBLl5S5hdsfbNzDxOHeOtcYjiBgc18n/rvIa539F/5Sf0k5X2G3Go9zosSorsOo/hBz1oZm8Gf/ZFdOjOLCshkpapvr4wY5mG2/GY1gmTq+nMZiD08bidNeopqqV1OTvm70mHrtm1Uf00xP3uT5PBbI0br3QzvwmrOvqj1DnWPlYiCdU9X3CoWnui5optaME08pJZw7w7WH7LcoON8kkvB7lM780eT00xP3uT5PBPTTE/e5Pk8FAItvhQ2RVne5P8AppifvcnyeCemmJ+9yfJ4KAROFDZDO9yz0GnmIxyNe6YytBzY4N1XDaLgZHnW4cAxqGrhE0JyOTm/mY7aCvndTeiekMlFOJG3MbspGctvHzEcK16+GUleK1J06jT1PoBVTTKmrmtM9JO8Bou6MWOXG247lY6KqZLG2WN2sx7Q5p4wu9cqUbqx0KFXhTU7J+DNLeleIe8v+XwT0rxD3l/y+Cm9P9GvJONTC31TzvwOBjuPoJVKXOm5wdmz2uFjhcRTU4wXoia9K8Q95f8AL4J6V4h7y/5fBQqKGeW5sfCUO4vRE16V4h7y/wCXwWUel1eCD5w42PAQ0g9OSg0Wc8tw8HQ7i9Ebo0X0hjq49Yb2Vvts4uccYU4tD4ViMlPK2aI2c09ThtBW6MExSOphbLHwEZja120FbtGrnVnzPJ9qdnPDSzR+l/14EiiIrzknCjseofLQOaPaG+b0j/rKSXCynZ3MNXViuYBVNqad1PLmWt1ect2HpC8OiVa6KV9FKeBx1P3bR0EZrpmd5rXEjJhdf+x3D3/RYabQmKojqGZF4vf9bbfay21FN5ej18ym7tfY80U3/wCbiTozlTTkHmAPAf7XXHQsdNo30VbFiEIykNnjYSALg/ub/FerTyJs9HDVtHs2vzNdYEdTgEa7z7B3tOcsDevWZmO1uXWVJdJv8MxuvNGG6DTCelhxGnO+hs4OHDqEjva77qUopIsWw4tfYOcNV3HHK3gcO49ahNzesE1PNQy5t1SWj9Drhw6jn/covc7rXUte+kkOUrjGeLyjL2PWLjrCw4NRcesdV+DKlqnuUSupHwyPikFnxuLXDnH1C6FsTdewgNljq2jKUaj/AN7RvT1t/itdrepTzwUiicbOwREVhEIiIDYu5PpCWyGikO9ku6L9L8y5vQRn1c62svmmmndG9sjDZ7HBwPEQvoXB8WingjnDmjyjA61xkdo7brmYulaWZdTZoyurM9dXTMkY6N4u14LSOMLSWPYW6mqHwuz1Tdp5TTwFbv8AOGctvaFSd0uhZJC2oYWl0R1XWIuWOsO427VzMRTco32O92Ni+FXyN6S9+hrVERc89mEREAVn0Exw09QGPNoZiGu4mu/K77KsLlShJxd0U4ihGtTcJdT6DuigtDcUNRSMc43e0ajukbesWPWuV1Iu6uj5/VpunNwlzROoiLJWVDTeHfRv4wW9lrfVYY563DY5dsZF+0sPfZe7TZvqmHik+oK8EG+wuYckn6tK24P5YvZlEvqaOnBfXYbUwHPUDiP5N+YKO3Mqq00sJ4JI9a3O3/Tu5SGgJuZ2bHMb3aw+6rmgj9XEIhx67fkd4K5rSovMhfWLOjRmTzXFWsvZomfCecG4HfZYadtNPirpWZG8c7emwv3tKx0kPk8VkI/LUNd/Er37rbLVcR44P8nKa1nF7oj9r8GXLTumbUYZK5udmNnb1WP8b9q0Wt+YR6zCmA569Jq/JZaDWMJpmjsyVbowiItwpCIiAIiIAso3WIPEViijKKasydObjJSXRkui4jOQ6AuV42Ss2j6pTlmgnugiIokwiIgL5uV1lpJoScnNDx0jI/UdiKK3OpCK9g5THjuv9lyujh3eB4vtuChim91f9G3URFcckrWmz/VRjjeT2A+K8EO9wuY8o/5NCz02mvJGzktJ7f8A4sdIfU4fFDteRcdrj3kLbgvlit2US+ps6NAsjO88DWD/ACP2Vc0DYXYhEeIPcfgd9yrJhfqMLqJjkZAQP4DvJUfuZ03rJp3ZNjYG36bk9zVc5aVH5EEtYor2kI8pisgGetUtZ3tH2Xv3W5L1cbeTAO9zl59EojU4o2QjLyj53cwFyPmIXVpmTVYs6Jme/ZA3sAPzXVi0mlsjH2vxZsjC/VYUwnLUo9b5LrQa3lugVbafDZGtyL2tgYOmwPygrRqjhNVKW7M1uiCIi3CkIiIAiKUotHa2Zgkip5JI3Xs4DI2JH1Cw5Jcxa/Ii0U36I4j7pL8Kwn0Zro2l8lNIyNvtOIsAFCVWCTdyynTlKSilzZjGMh0LlEXjpO8mz6pTjlilsgiIsEgiIgLRucx3r2nksee633RS+5XR76acjIARt7y77IujhlaB4vtqanin4K37NjLhFFaSV3koTb25N437nsV8Vd2OQ3ZXK9GzzuuJ4WB1zxajbfX7rq0vkdPVsp2Zllm/3OzPdZTeG07aOldLJ7ZGs7/Fv/ca8eiVAbvrZvafctvsGes5bSkk822iKbPluR26DO2Gnho2bcz+1vB2k9yyrGeYYOWnKacWPHrP4R1M+i68IpjiFe+reP8Ax4XAMB4HW9kD+R6QurSVrsRxBlHGfU0+cjhwAm2t15BvSpq2kH01Zjd+SMtAKVtLRzV8o9ppLf2Nv9T9FF7meHOnq5K2QXEZJB45X3+gJ7QpjdBqCWwYXSt38pbdo2MbbVHRcX/tUnWTw4RhwaLOeBZo2yzHhPRfPoCw5tptc5exlJabIpu61jIknZSsO9p8388jgPo36lUFdlRM57nPeS5z3FxO0krrW9ShkiolEnd3CIisIhERAeigpHzSshjF3yODQOc/ZfROF0LYIY4WezGwNHPbb2qgblOjZaPPpW5uBbCOJvA5/Xwdq2SuXi6uaWVdDaoxsrhUPdPxWzGUrTm867+Zo9kdv0VxxSvZBE6aQ2awX5zxAc91pHFa99RM+Z/tPde3ENg7FzMRUyxtueg7Fwbq1eI+Ufc8iIi0D2AREQBcgXyGZ4FwrjueYCZZfOJB6qI73ifJ/r6qUIuTsa+KxEaFJ1JF70UwvzaljjPt21nfuOZ7ODqRTCLqJWVkeAqTdSbm+bOHEAXPAFC0lOZ5vOXj1bMoWnb+sqVqIdcap9n8w5XN0LKVhLbNOrsvxdCmnbkVtXITEITVzCLgp4XXkP8AUfyR0LHSIvl1aGn3rpB6xw4IYfE8AHSpuGFrGajAAAMhn3rGkpGsueF7zrPceF5+w2WUlO3lyI5SJr3CjpmwUzLzP9XC3K7n7XG+wcJK68LoYcOpHySHWf7cr/zSSHIAceZsOlTEVIPKGV2+kI1QdjGclv1J/wBLiajD5GPfm2M3Y3Zr8o8ZGxM/T1M5SuYPRCnE2J15DZ5RrG+fkGcDWDjNrDuWrtLdIpK2cyOu2Nu9jZyG7TzklbA0y0cxOuksHxMp2HeM1nZnlONsz9FW/wAL6/lw/E7wW5QlTXzSevsUTUnoloUdFePwvr+XD8TvBPwvr+XD8TvBbPxFPvFfDlsUdFePwvr+XD8TvBPwvr+XD8TvBPiKfeHDlsUdWvQTRN1ZLryAimjO+P8AUPIB+qlsO3LqkyN8vJG2K++1CS4jiFx3raNBRxwxtiiaGRsFgBsVFfFJK0GWQpO92d0cYaA1oAaBYAZAAJLIGgucQABck8ACzKqul2F11V6qFzGQbbuOtIeew4OZcuTaV1qb1CnGc1GTyrdlL000kNVJqRm0EZ3v6zyj9lWVb/w9reVF8TvBPw9reVF8TvBaEqdSTu0exoYzBUKahCasioIrf+Htbyovid4J+Htbyovid4KPBnsXfyeF76Kgit/4e1vKi+J3gsotzyrJGs+MNvmQXEgdFlngz2MPtPC99EJo5gclXKGNyYM3u2Nb4rctBRxwxtijbqsYLALpwbCoqaIRRCwHCdrjxkr3rcpUsi8Ty3aOPlip6aRXL/TlERXHNCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiA/9k=\" />\n </defs>\n </svg>\n\n <!-- Title + optional badge -->\n <div class=\"cqa-items-end cqa-gap-3 cqa-min-w-0 cqa-hidden md:cqa-flex\">\n <div\n class=\"cqa-truncate cqa-text-[#22223B] cqa-font-extrabold cqa-text-[32px] cqa-font-nunito-sans cqa-leading-[1]\">\n {{ title }}</div>\n <span *ngIf=\"badgeText\"\n class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-lg cqa-text-[12px] cqa-font-medium cqa-leading-4 cqa-whitespace-nowrap cqa-text-[#007A55] cqa-bg-[#D0FAE5] cqa-border cqa-border-[#A4F4CF]\"\n [ngClass]=\"badgeClass\">{{ badgeText }}</span>\n </div>\n </div>\n\n <!-- Right controls/actions -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n <!-- Optional workspace select -->\n <div *ngIf=\"workspaceOptions?.length\" class=\"cqa-w-full cqa-max-w-[199px] cqa-ml-auto header-dropdown\">\n <cqa-dynamic-select [form]=\"workspaceForm\" [config]=\"workspaceConfig\">\n </cqa-dynamic-select>\n </div>\n\n <ng-content></ng-content>\n </div>\n </div>\n</div>", components: [{ type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }, { type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1957
1958
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DashboardHeaderComponent, decorators: [{
|
|
1958
1959
|
type: Component,
|
|
1959
|
-
args: [{ selector: 'cqa-dashboard-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-w-full cqa-flex cqa-items-end cqa-justify-between cqa-bg-white cqa-pr-6 cqa-pl-2 lg:cqa-px-6 lg:cqa-py-[6px] cqa-py-2 cqa-border-b cqa-border-default cqa-shadow-header\"\n [ngClass]=\"headerClass\">\n <!-- Left branding block -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n <div class=\"cqa-pr-4 lg:cqa-hidden cqa-gap-2 md:cqa-flex\">\n <cqa-button variant=\"filled\" icon=\"\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"31\" height=\"22\" viewBox=\"0 0 31 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.16675 11H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 16.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 5.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button
|
|
1960
|
+
args: [{ selector: 'cqa-dashboard-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\" *ngIf=\"showHeader\">\n <div\n class=\"cqa-w-full cqa-flex cqa-items-end cqa-justify-between cqa-bg-white cqa-pr-6 cqa-pl-2 lg:cqa-px-6 lg:cqa-py-[6px] cqa-py-2 cqa-border-b cqa-border-default cqa-shadow-header\"\n [ngClass]=\"headerClass\">\n <!-- Left branding block -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-min-w-0\">\n <div class=\"cqa-pr-4 lg:cqa-hidden cqa-gap-2 md:cqa-flex cqa-hidden\">\n <!-- <cqa-button variant=\"filled\" icon=\"\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"31\" height=\"22\" viewBox=\"0 0 31 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5.16675 11H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 16.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M5.16675 5.5H25.8334\" stroke=\"white\" stroke-width=\"1.83333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button> -->\n <!-- <span class=\"cqa-border-l cqa-border-primary-surface cqa-hidden md:cqa-flex\"></span> -->\n <cqa-button variant=\"filled\" icon=\"\" class=\"cqa-hidden md:cqa-flex\" [customClass]=\"'!cqa-rounded-[10px] !cqa-p-[7px] !cqa-min-w-[47px]'\">\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4.58337 11H17.4167\" stroke=\"white\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n <path d=\"M11 4.58301V17.4163\" stroke=\"white\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </cqa-button>\n </div>\n <!-- Optional projected logo -->\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <rect x=\"0.5\" y=\"0.5\" width=\"31\" height=\"31\" rx=\"15.5\" fill=\"url(#pattern0_6303_22035)\" />\n <rect x=\"0.5\" y=\"0.5\" width=\"31\" height=\"31\" rx=\"15.5\" stroke=\"#D8D9FC\" />\n <defs>\n <pattern id=\"pattern0_6303_22035\" patternContentUnits=\"objectBoundingBox\" width=\"1\" height=\"1\">\n <use xlink:href=\"#image0_6303_22035\" transform=\"scale(0.005)\" />\n </pattern>\n <image id=\"image0_6303_22035\" width=\"200\" height=\"200\" preserveAspectRatio=\"none\"\n xlink:href=\"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBw8SEBMQEBASEBAQEBYRFRUXFRARERASGRkWGxYXGBUYHigsGBomGxUYITEhJSkrLjouGSAzODMsNygtLjcBCgoKDg0OGxAQGy4dICUrNy0rKysrMDctLisvLS0tKy0tLTcuLS0tMDctNi0tLSstLS0rLS0rLTEtLS0tLS0tLf/AABEIAMgAyAMBIgACEQEDEQH/xAAcAAEAAgIDAQAAAAAAAAAAAAAABQYCBwEDBAj/xABBEAABAwICAwsKBQUAAwEAAAABAAIDBBEFIQYSQQciMVFSYXGBkaHRExQWIzJUkqKxwRdCYnKyU4LC4fAkNPEV/8QAGwEBAAIDAQEAAAAAAAAAAAAAAAIDAQQFBgf/xAAuEQACAQIEAwYGAwAAAAAAAAAAAQIDEQQSIVETMUEFUmGBkbEUIjJCccEVodH/2gAMAwEAAhEDEQA/AN4oiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiA81XK5jdcDWDc3DaW8Y5xwrkyFzNeIg3F2n8ruZd6r/AJbzSo1DlTzm7eKN+3qz71KKuRbsS1JViVhLbtIJa4H2mOHCCF1UNfrPdC+zZo7awzs5p4HtvsPdwKMxwuppRVxi7HEMmbyh+V3SuNI4TJEytpT66Aa7CPzxn2mnjy2KagvJ+5jMyS8/1JxBLl5S5hdsfbNzDxOHeOtcYjiBgc18n/rvIa539F/5Sf0k5X2G3Go9zosSorsOo/hBz1oZm8Gf/ZFdOjOLCshkpapvr4wY5mG2/GY1gmTq+nMZiD08bidNeopqqV1OTvm70mHrtm1Uf00xP3uT5PBbI0br3QzvwmrOvqj1DnWPlYiCdU9X3CoWnui5optaME08pJZw7w7WH7LcoON8kkvB7lM780eT00xP3uT5PBPTTE/e5Pk8FAItvhQ2RVne5P8AppifvcnyeCemmJ+9yfJ4KAROFDZDO9yz0GnmIxyNe6YytBzY4N1XDaLgZHnW4cAxqGrhE0JyOTm/mY7aCvndTeiekMlFOJG3MbspGctvHzEcK16+GUleK1J06jT1PoBVTTKmrmtM9JO8Bou6MWOXG247lY6KqZLG2WN2sx7Q5p4wu9cqUbqx0KFXhTU7J+DNLeleIe8v+XwT0rxD3l/y+Cm9P9GvJONTC31TzvwOBjuPoJVKXOm5wdmz2uFjhcRTU4wXoia9K8Q95f8AL4J6V4h7y/5fBQqKGeW5sfCUO4vRE16V4h7y/wCXwWUel1eCD5w42PAQ0g9OSg0Wc8tw8HQ7i9Ebo0X0hjq49Yb2Vvts4uccYU4tD4ViMlPK2aI2c09ThtBW6MExSOphbLHwEZja120FbtGrnVnzPJ9qdnPDSzR+l/14EiiIrzknCjseofLQOaPaG+b0j/rKSXCynZ3MNXViuYBVNqad1PLmWt1ect2HpC8OiVa6KV9FKeBx1P3bR0EZrpmd5rXEjJhdf+x3D3/RYabQmKojqGZF4vf9bbfay21FN5ej18ym7tfY80U3/wCbiTozlTTkHmAPAf7XXHQsdNo30VbFiEIykNnjYSALg/ub/FerTyJs9HDVtHs2vzNdYEdTgEa7z7B3tOcsDevWZmO1uXWVJdJv8MxuvNGG6DTCelhxGnO+hs4OHDqEjva77qUopIsWw4tfYOcNV3HHK3gcO49ahNzesE1PNQy5t1SWj9Drhw6jn/covc7rXUte+kkOUrjGeLyjL2PWLjrCw4NRcesdV+DKlqnuUSupHwyPikFnxuLXDnH1C6FsTdewgNljq2jKUaj/AN7RvT1t/itdrepTzwUiicbOwREVhEIiIDYu5PpCWyGikO9ku6L9L8y5vQRn1c62svmmmndG9sjDZ7HBwPEQvoXB8WingjnDmjyjA61xkdo7brmYulaWZdTZoyurM9dXTMkY6N4u14LSOMLSWPYW6mqHwuz1Tdp5TTwFbv8AOGctvaFSd0uhZJC2oYWl0R1XWIuWOsO427VzMRTco32O92Ni+FXyN6S9+hrVERc89mEREAVn0Exw09QGPNoZiGu4mu/K77KsLlShJxd0U4ihGtTcJdT6DuigtDcUNRSMc43e0ajukbesWPWuV1Iu6uj5/VpunNwlzROoiLJWVDTeHfRv4wW9lrfVYY563DY5dsZF+0sPfZe7TZvqmHik+oK8EG+wuYckn6tK24P5YvZlEvqaOnBfXYbUwHPUDiP5N+YKO3Mqq00sJ4JI9a3O3/Tu5SGgJuZ2bHMb3aw+6rmgj9XEIhx67fkd4K5rSovMhfWLOjRmTzXFWsvZomfCecG4HfZYadtNPirpWZG8c7emwv3tKx0kPk8VkI/LUNd/Er37rbLVcR44P8nKa1nF7oj9r8GXLTumbUYZK5udmNnb1WP8b9q0Wt+YR6zCmA569Jq/JZaDWMJpmjsyVbowiItwpCIiAIiIAso3WIPEViijKKasydObjJSXRkui4jOQ6AuV42Ss2j6pTlmgnugiIokwiIgL5uV1lpJoScnNDx0jI/UdiKK3OpCK9g5THjuv9lyujh3eB4vtuChim91f9G3URFcckrWmz/VRjjeT2A+K8EO9wuY8o/5NCz02mvJGzktJ7f8A4sdIfU4fFDteRcdrj3kLbgvlit2US+ps6NAsjO88DWD/ACP2Vc0DYXYhEeIPcfgd9yrJhfqMLqJjkZAQP4DvJUfuZ03rJp3ZNjYG36bk9zVc5aVH5EEtYor2kI8pisgGetUtZ3tH2Xv3W5L1cbeTAO9zl59EojU4o2QjLyj53cwFyPmIXVpmTVYs6Jme/ZA3sAPzXVi0mlsjH2vxZsjC/VYUwnLUo9b5LrQa3lugVbafDZGtyL2tgYOmwPygrRqjhNVKW7M1uiCIi3CkIiIAiKUotHa2Zgkip5JI3Xs4DI2JH1Cw5Jcxa/Ii0U36I4j7pL8Kwn0Zro2l8lNIyNvtOIsAFCVWCTdyynTlKSilzZjGMh0LlEXjpO8mz6pTjlilsgiIsEgiIgLRucx3r2nksee633RS+5XR76acjIARt7y77IujhlaB4vtqanin4K37NjLhFFaSV3koTb25N437nsV8Vd2OQ3ZXK9GzzuuJ4WB1zxajbfX7rq0vkdPVsp2Zllm/3OzPdZTeG07aOldLJ7ZGs7/Fv/ca8eiVAbvrZvafctvsGes5bSkk822iKbPluR26DO2Gnho2bcz+1vB2k9yyrGeYYOWnKacWPHrP4R1M+i68IpjiFe+reP8Ax4XAMB4HW9kD+R6QurSVrsRxBlHGfU0+cjhwAm2t15BvSpq2kH01Zjd+SMtAKVtLRzV8o9ppLf2Nv9T9FF7meHOnq5K2QXEZJB45X3+gJ7QpjdBqCWwYXSt38pbdo2MbbVHRcX/tUnWTw4RhwaLOeBZo2yzHhPRfPoCw5tptc5exlJabIpu61jIknZSsO9p8388jgPo36lUFdlRM57nPeS5z3FxO0krrW9ShkiolEnd3CIisIhERAeigpHzSshjF3yODQOc/ZfROF0LYIY4WezGwNHPbb2qgblOjZaPPpW5uBbCOJvA5/Xwdq2SuXi6uaWVdDaoxsrhUPdPxWzGUrTm867+Zo9kdv0VxxSvZBE6aQ2awX5zxAc91pHFa99RM+Z/tPde3ENg7FzMRUyxtueg7Fwbq1eI+Ufc8iIi0D2AREQBcgXyGZ4FwrjueYCZZfOJB6qI73ifJ/r6qUIuTsa+KxEaFJ1JF70UwvzaljjPt21nfuOZ7ODqRTCLqJWVkeAqTdSbm+bOHEAXPAFC0lOZ5vOXj1bMoWnb+sqVqIdcap9n8w5XN0LKVhLbNOrsvxdCmnbkVtXITEITVzCLgp4XXkP8AUfyR0LHSIvl1aGn3rpB6xw4IYfE8AHSpuGFrGajAAAMhn3rGkpGsueF7zrPceF5+w2WUlO3lyI5SJr3CjpmwUzLzP9XC3K7n7XG+wcJK68LoYcOpHySHWf7cr/zSSHIAceZsOlTEVIPKGV2+kI1QdjGclv1J/wBLiajD5GPfm2M3Y3Zr8o8ZGxM/T1M5SuYPRCnE2J15DZ5RrG+fkGcDWDjNrDuWrtLdIpK2cyOu2Nu9jZyG7TzklbA0y0cxOuksHxMp2HeM1nZnlONsz9FW/wAL6/lw/E7wW5QlTXzSevsUTUnoloUdFePwvr+XD8TvBPwvr+XD8TvBbPxFPvFfDlsUdFePwvr+XD8TvBPwvr+XD8TvBPiKfeHDlsUdWvQTRN1ZLryAimjO+P8AUPIB+qlsO3LqkyN8vJG2K++1CS4jiFx3raNBRxwxtiiaGRsFgBsVFfFJK0GWQpO92d0cYaA1oAaBYAZAAJLIGgucQABck8ACzKqul2F11V6qFzGQbbuOtIeew4OZcuTaV1qb1CnGc1GTyrdlL000kNVJqRm0EZ3v6zyj9lWVb/w9reVF8TvBPw9reVF8TvBaEqdSTu0exoYzBUKahCasioIrf+Htbyovid4J+Htbyovid4KPBnsXfyeF76Kgit/4e1vKi+J3gsotzyrJGs+MNvmQXEgdFlngz2MPtPC99EJo5gclXKGNyYM3u2Nb4rctBRxwxtijbqsYLALpwbCoqaIRRCwHCdrjxkr3rcpUsi8Ty3aOPlip6aRXL/TlERXHNCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiAIiIAiIgCIiA/9k=\" />\n </defs>\n </svg>\n\n <!-- Title + optional badge -->\n <div class=\"cqa-items-end cqa-gap-3 cqa-min-w-0 cqa-hidden md:cqa-flex\">\n <div\n class=\"cqa-truncate cqa-text-[#22223B] cqa-font-extrabold cqa-text-[32px] cqa-font-nunito-sans cqa-leading-[1]\">\n {{ title }}</div>\n <span *ngIf=\"badgeText\"\n class=\"cqa-px-2 cqa-py-[2px] cqa-rounded-lg cqa-text-[12px] cqa-font-medium cqa-leading-4 cqa-whitespace-nowrap cqa-text-[#007A55] cqa-bg-[#D0FAE5] cqa-border cqa-border-[#A4F4CF]\"\n [ngClass]=\"badgeClass\">{{ badgeText }}</span>\n </div>\n </div>\n\n <!-- Right controls/actions -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqa-flex-1\">\n <!-- Optional workspace select -->\n <div *ngIf=\"workspaceOptions?.length\" class=\"cqa-w-full cqa-max-w-[199px] cqa-ml-auto header-dropdown\">\n <cqa-dynamic-select [form]=\"workspaceForm\" [config]=\"workspaceConfig\">\n </cqa-dynamic-select>\n </div>\n\n <ng-content></ng-content>\n </div>\n </div>\n</div>", styles: [] }]
|
|
1960
1961
|
}], propDecorators: { title: [{
|
|
1961
1962
|
type: Input
|
|
1962
1963
|
}], badgeText: [{
|
|
@@ -1965,6 +1966,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
1965
1966
|
type: Input
|
|
1966
1967
|
}], headerClass: [{
|
|
1967
1968
|
type: Input
|
|
1969
|
+
}], showHeader: [{
|
|
1970
|
+
type: Input
|
|
1968
1971
|
}], workspaceOptions: [{
|
|
1969
1972
|
type: Input
|
|
1970
1973
|
}], workspacePlaceholder: [{
|
|
@@ -2007,8 +2010,16 @@ class CoverageModuleCardComponent {
|
|
|
2007
2010
|
this.ctaText = 'AI Coverage';
|
|
2008
2011
|
/** Disable CTA */
|
|
2009
2012
|
this.ctaDisabled = false;
|
|
2013
|
+
/** Generation duration in milliseconds (default ~12s) */
|
|
2014
|
+
this.generationMs = 200;
|
|
2010
2015
|
this.view = new EventEmitter();
|
|
2016
|
+
this.issuesClicked = new EventEmitter();
|
|
2011
2017
|
this.ctaClicked = new EventEmitter();
|
|
2018
|
+
/** Emits when the AI coverage area is clicked */
|
|
2019
|
+
this.aiCoverageClick = new EventEmitter();
|
|
2020
|
+
/** Internal generation state */
|
|
2021
|
+
this.isGenerating = false;
|
|
2022
|
+
this.isGenerated = false;
|
|
2012
2023
|
}
|
|
2013
2024
|
statusColorClass(item) {
|
|
2014
2025
|
const status = item.status ?? 'neutral';
|
|
@@ -2038,12 +2049,39 @@ class CoverageModuleCardComponent {
|
|
|
2038
2049
|
const clamped = Math.max(0, Math.min(100, pct));
|
|
2039
2050
|
return `${clamped}%`;
|
|
2040
2051
|
}
|
|
2052
|
+
/** Computed CTA button class to switch to light green after generation */
|
|
2053
|
+
get ctaButtonClass() {
|
|
2054
|
+
const base = 'cqa-w-full cqa-text-[14px] cqa-leading-[20px] cqa-font-semibold';
|
|
2055
|
+
if (this.isGenerated) {
|
|
2056
|
+
// light green background, dark green text, subtle green border
|
|
2057
|
+
return `${base} cqa-bg-[#D1FAE5] cqa-text-[#065F46] cqa-border-[#A7F3D0]`;
|
|
2058
|
+
}
|
|
2059
|
+
if (this.isGenerating) {
|
|
2060
|
+
return `${base} cqa-bg-primary-surface cqa-text-primary`;
|
|
2061
|
+
}
|
|
2062
|
+
return base;
|
|
2063
|
+
}
|
|
2064
|
+
onAiCoverageClick() {
|
|
2065
|
+
if (this.isGenerating) {
|
|
2066
|
+
return;
|
|
2067
|
+
}
|
|
2068
|
+
this.ctaClicked.emit();
|
|
2069
|
+
this.aiCoverageClick.emit();
|
|
2070
|
+
// Start generating state for ~12 seconds
|
|
2071
|
+
this.isGenerated = false;
|
|
2072
|
+
this.isGenerating = true;
|
|
2073
|
+
// Clear any existing timer defensively
|
|
2074
|
+
setTimeout(() => {
|
|
2075
|
+
this.isGenerating = false;
|
|
2076
|
+
this.isGenerated = true;
|
|
2077
|
+
}, 200);
|
|
2078
|
+
}
|
|
2041
2079
|
}
|
|
2042
2080
|
CoverageModuleCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CoverageModuleCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2043
|
-
CoverageModuleCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CoverageModuleCardComponent, selector: "cqa-coverage-module-card", inputs: { title: "title", issues: "issues", showViewAction: "showViewAction", positiveCount: "positiveCount", negativeCount: "negativeCount", edgeCaseCount: "edgeCaseCount", positiveLabel: "positiveLabel", negativeLabel: "negativeLabel", edgeCaseLabel: "edgeCaseLabel", aiCount: "aiCount", humanCount: "humanCount", aiLabel: "aiLabel", humanLabel: "humanLabel", items: "items", ctaText: "ctaText", ctaDisabled: "ctaDisabled" }, outputs: { view: "view", ctaClicked: "ctaClicked" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-py-[10px] cqa-px-[17px] cqa-shadow-card\">\n <!-- Header -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-3\">\n <h3 class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-dialog\">{{ title }}</h3>\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span\n class=\"cqa-px-[10px] cqa-py-[4px] cqa-text-[12px] cqa-leading-[16px] cqa-flex cqa-items-center cqa-gap-1 cqa-rounded-full cqa-bg-warning-light cqa-text-danger\">\n {{ issues }} {{ issues === 1 ? 'issue' : 'issues' }}\n </span>\n <button type=\"button\"\n class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-primary cqa-flex cqa-items-center cqa-gap-1\"\n *ngIf=\"showViewAction\" (click)=\"view.emit()\">\n View\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 12L10 8L6 4\" stroke=\"#4F46E5\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </button>\n </div>\n </div>\n\n <!-- Middle metrics row -->\n <div class=\"cqa-flex cqa-items-stretch cqa-justify-between cqa-gap-6 cqa-mb-4\">\n <!-- Left: Positive / Negative / Edge Case -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-6\">\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#10B981]\">{{ positiveCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ positiveLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#EF4444]\">{{ negativeCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ negativeLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#F59E0B]\">{{ edgeCaseCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ edgeCaseLabel }}</span>\n </div>\n </div>\n\n <!-- Divider -->\n <div class=\"cqa-w-px cqa-bg-[#E5E7EB]\"></div>\n\n <!-- Right: AI / Human -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-6\">\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-dialog\">{{ aiCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ aiLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-dialog\">{{ humanCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ humanLabel }}</span>\n </div>\n </div>\n </div>\n\n <!-- Body -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-items-center cqa-gap-3\">\n <span class=\"cqa-min-w-[120px] cqa-text-[12px] cqa-leading-4 cqa-text-[#374151]\">{{ it.label }}</span>\n <div class=\"cqa-flex-1 cqa-h-[8px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden\">\n <div class=\"cqa-h-full cqa-rounded-full\" [ngClass]=\"statusColorClass(it)\"\n [style.width]=\"formatPercent(it.percent)\"></div>\n </div>\n <span class=\"cqa-w-[40px] cqa-text-right cqa-text-[12px] cqa-leading-4\" [ngClass]=\"textColorClass(it)\">{{\n formatPercent(it.percent) }}</span>\n </div>\n </div>\n\n <!-- Footer -->\n <div class=\"cqa-mt-4\">\n <button type=\"button\"\n class=\"cqa-w-full cqa-h-[40px] cqa-rounded-[8px] cqa-bg-[#4338CA] cqa-text-white cqa-text-[14px] cqa-leading-[20px] hover:cqa-bg-[#3730A3] disabled:cqa-opacity-50 disabled:cqa-cursor-not-allowed\"\n [disabled]=\"ctaDisabled\" (click)=\"ctaClicked.emit()\">\n \u2728 {{ ctaText }}\n </button>\n </div>\n </div>\n</div>", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2081
|
+
CoverageModuleCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CoverageModuleCardComponent, selector: "cqa-coverage-module-card", inputs: { title: "title", issues: "issues", showViewAction: "showViewAction", positiveCount: "positiveCount", negativeCount: "negativeCount", edgeCaseCount: "edgeCaseCount", positiveLabel: "positiveLabel", negativeLabel: "negativeLabel", edgeCaseLabel: "edgeCaseLabel", aiCount: "aiCount", humanCount: "humanCount", aiLabel: "aiLabel", humanLabel: "humanLabel", items: "items", ctaText: "ctaText", ctaDisabled: "ctaDisabled", generationMs: "generationMs" }, outputs: { view: "view", issuesClicked: "issuesClicked", ctaClicked: "ctaClicked", aiCoverageClick: "aiCoverageClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-w-full cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-py-[10px] md:cqa-px-[17px] cqa-px-3 cqa-shadow-card\">\n <!-- Header -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-3\">\n <h3 class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-dialog\">{{ title }}</h3>\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span (click)=\"issuesClicked.emit()\"\n class=\"cqa-cursor-pointer cqa-px-[10px] cqa-py-[4px] cqa-text-[12px] cqa-leading-[16px] cqa-flex cqa-items-center cqa-gap-1 cqa-rounded-full cqa-bg-warning-light cqa-text-danger\">\n {{ issues }} {{ issues === 1 ? 'issue' : 'issues' }}\n </span>\n <button type=\"button\"\n class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-primary cqa-flex cqa-items-center cqa-gap-1\"\n *ngIf=\"showViewAction\" (click)=\"view.emit()\">\n View\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 12L10 8L6 4\" stroke=\"#4F46E5\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Middle metrics row -->\n <div class=\"cqa-grid md:cqa-grid-cols-4 cqa-grid-cols-2 cqa-gap-3 cqa-mb-4 cqa-border-t cqa-border-b cqa-border-surface-[#F3F4F6] cqa-py-2\">\n <!-- Left: Positive / Negative / Edge Case -->\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#059669]\">{{ positiveCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ positiveLabel }}</div>\n </div>\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#EF4444]\">{{ negativeCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ negativeLabel }}</div>\n </div>\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#F59E0B]\">{{ edgeCaseCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ edgeCaseLabel }}</div>\n </div>\n\n <!-- Right: AI / Human -->\n <div class=\"cqa-text-center cqa-flex cqa-items-center cqa-justify-center cqa-flex-col\">\n <div class=\"cqa-flex cqa-items-center cqa-justify-center\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-items-center cqa-justify-center cqa-w-[60px] cqa-cursor-pointer\">\n <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-bold cqa-text-primary cqa-flex cqa-items-center cqa-gap-[2px]\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(#clip0_7415_11751)\"><path d=\"M4.9685 7.75012C4.92386 7.57709 4.83367 7.41918 4.70731 7.29282C4.58095 7.16646 4.42304 7.07626 4.25 7.03162L1.1825 6.24062C1.13017 6.22577 1.08411 6.19425 1.05131 6.15085C1.01851 6.10744 1.00076 6.05453 1.00076 6.00012C1.00076 5.94572 1.01851 5.89281 1.05131 5.8494C1.08411 5.806 1.13017 5.77448 1.1825 5.75962L4.25 4.96812C4.42298 4.92353 4.58085 4.83341 4.7072 4.70714C4.83356 4.58088 4.92378 4.42307 4.9685 4.25012L5.7595 1.18262C5.7742 1.13008 5.80569 1.0838 5.84916 1.05082C5.89263 1.01785 5.94569 1 6.00025 1C6.05481 1 6.10787 1.01785 6.15134 1.05082C6.19481 1.0838 6.2263 1.13008 6.241 1.18262L7.0315 4.25012C7.07614 4.42316 7.16633 4.58107 7.29269 4.70743C7.41905 4.83379 7.57696 4.92399 7.75 4.96862L10.8175 5.75912C10.8703 5.77367 10.9168 5.80513 10.9499 5.84866C10.9831 5.8922 11.001 5.94541 11.001 6.00012C11.001 6.05484 10.9831 6.10805 10.9499 6.15159C10.9168 6.19512 10.8703 6.22657 10.8175 6.24112L7.75 7.03162C7.57696 7.07626 7.41905 7.16646 7.29269 7.29282C7.16633 7.41918 7.07614 7.57709 7.0315 7.75012L6.2405 10.8176C6.2258 10.8702 6.19431 10.9165 6.15084 10.9494C6.10737 10.9824 6.05431 11.0002 5.99975 11.0002C5.94519 11.0002 5.89213 10.9824 5.84866 10.9494C5.80519 10.9165 5.7737 10.8702 5.759 10.8176L4.9685 7.75012Z\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M10 1.5V3.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M11 2.5H9\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M2 8.5V9.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M2.5 9H1.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g><defs><clipPath id=\"clip0_7415_11751\"><rect width=\"12\" height=\"12\" fill=\"white\"/></clipPath></defs></svg>\n {{ aiLabel }}\n </span>\n <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-font-bold cqa-text-dialog\">{{ aiCount }}</span>\n </div>\n <div class=\"cqa-bg-primary-surface cqa-w-[2px] cqa-h-full cqa-mx-[3.5px]\"></div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-items-center cqa-justify-center cqa-w-[60px]\">\n <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-bold cqa-text-dialog-secondary cqa-flex cqa-items-center cqa-gap-[2px]\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.5 10.5V9.5C9.5 8.96957 9.28929 8.46086 8.91421 8.08579C8.53914 7.71071 8.03043 7.5 7.5 7.5H4.5C3.96957 7.5 3.46086 7.71071 3.08579 8.08579C2.71071 8.46086 2.5 8.96957 2.5 9.5V10.5\" stroke=\"#3F43EE\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 5.5C7.10457 5.5 8 4.60457 8 3.5C8 2.39543 7.10457 1.5 6 1.5C4.89543 1.5 4 2.39543 4 3.5C4 4.60457 4.89543 5.5 6 5.5Z\" stroke=\"#3F43EE\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ humanLabel }}\n </span>\n <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-font-bold cqa-text-dialog\">{{ humanCount }}</span>\n </div>\n </div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted cqa-pt-[2px] cqa-pb-1\">Coverage</div>\n </div>\n </div>\n\n <!-- Body -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span class=\"md:cqa-w-full md:cqa-max-w-[216px] cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-secondary cqa-flex cqa-items-center cqa-gap-2\">\n <svg *ngIf=\"it.status=='success'\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.8333 6.46309V6.99976C12.8326 8.25767 12.4253 9.48165 11.6721 10.4892C10.9189 11.4967 9.86025 12.2337 8.65396 12.5904C7.44767 12.947 6.1584 12.9042 4.97844 12.4683C3.79848 12.0323 2.79105 11.2266 2.10639 10.1714C1.42174 9.11611 1.09654 7.8678 1.17931 6.61261C1.26208 5.35742 1.74837 4.16262 2.56566 3.20638C3.38295 2.25015 4.48746 1.58373 5.71444 1.30651C6.94143 1.02929 8.22515 1.15612 9.37417 1.66809\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M5.25 6.41634L7 8.16634L12.8333 2.33301\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <svg *ngIf=\"it.status=='error'\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 12.8337C10.2217 12.8337 12.8333 10.222 12.8333 7.00033C12.8333 3.77866 10.2217 1.16699 7 1.16699C3.77834 1.16699 1.16666 3.77866 1.16666 7.00033C1.16666 10.222 3.77834 12.8337 7 12.8337Z\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 4.66699V7.00033\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 9.33301H7.00583\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ it.label }}\n </span>\n <div class=\"cqa-flex-1 cqa-h-[6px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden\">\n <div class=\"cqa-h-full cqa-rounded-full\" [ngClass]=\"statusColorClass(it)\"\n [style.width]=\"formatPercent(it.percent)\"></div>\n </div>\n <span class=\"cqa-min-w-[40px] cqa-text-[12px] cqa-leading-[16px] cqa-font-bold\" [ngClass]=\"textColorClass(it)\">{{\n formatPercent(it.percent) }}</span>\n </div>\n </div>\n\n <!-- Footer -->\n <cqa-button variant=\"filled\" [customClass]=\"ctaButtonClass\" (click)=\"onAiCoverageClick()\">\n <ng-container *ngIf=\"!isGenerating; else generatingTpl\">\n <svg *ngIf=\"!isGenerating && !isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.01882 0C9.12979 0.0454767 9.17718 0.15653 9.22261 0.259691C9.24539 0.319799 9.26628 0.380234 9.28657 0.44115C9.29452 0.464493 9.30246 0.487836 9.31065 0.511886C9.41613 0.826009 9.51008 1.1435 9.60457 1.46076C9.62593 1.53238 9.64739 1.60397 9.66885 1.67557C9.7781 2.04007 9.88654 2.4048 9.99438 2.76969C10.0095 2.82093 10.0247 2.87218 10.0398 2.92342C10.0826 3.0679 10.1252 3.21239 10.1677 3.35694C10.2573 3.66239 10.3495 3.96695 10.4476 4.27002C10.4561 4.29653 10.4647 4.32305 10.4735 4.35036C10.7284 5.12999 11.0896 5.82875 11.6818 6.42393C11.6965 6.4394 11.7111 6.45488 11.7262 6.47083C11.979 6.72875 12.3034 6.93541 12.6276 7.10221C12.6441 7.11085 12.6606 7.11948 12.6776 7.12838C13.6317 7.61851 14.779 7.83407 15.8124 8.12101C16.2652 8.24681 16.7166 8.37658 17.1663 8.51206C17.1979 8.52157 17.2296 8.53107 17.2612 8.54055C17.3557 8.5689 17.45 8.59774 17.5442 8.62694C17.5662 8.63358 17.5882 8.64023 17.6108 8.64707C17.7406 8.68812 17.8648 8.73658 17.9713 8.82054C18.0038 8.88837 18.0038 8.88837 17.995 8.95619C17.8913 9.05472 17.7884 9.10092 17.6516 9.14599C17.632 9.15264 17.6124 9.1593 17.5923 9.16615C17.3612 9.24366 17.127 9.31149 16.8925 9.37871C16.8444 9.39261 16.7963 9.40651 16.7482 9.42042C16.4514 9.50603 16.1542 9.5898 15.8566 9.67263C15.4646 9.78175 15.0733 9.89268 14.6823 10.0049C14.6182 10.0232 14.5541 10.0416 14.49 10.0598C14.1534 10.1557 13.8185 10.2551 13.4863 10.3642C13.4587 10.3732 13.4312 10.3822 13.4028 10.3915C12.2902 10.7616 11.4422 11.4522 10.9114 12.462C10.6253 13.0295 10.4565 13.6432 10.2843 14.2489C10.2377 14.4124 10.1882 14.5749 10.1381 14.7374C10.0988 14.8652 10.0604 14.9933 10.023 15.1216C10.0185 15.1369 10.0141 15.1522 10.0095 15.1679C9.98788 15.2419 9.96638 15.3159 9.94503 15.3899C9.89039 15.5776 9.83156 15.7637 9.77111 15.9498C9.66383 16.2804 9.5662 16.6135 9.46917 16.947C9.32288 17.4491 9.32288 17.4491 9.23993 17.6905C9.23443 17.7067 9.22893 17.7229 9.22326 17.7396C9.19298 17.8256 9.16183 17.9047 9.10453 17.9774C9.01734 17.9958 9.01734 17.9958 8.93901 18C8.84946 17.8752 8.79016 17.7542 8.74265 17.6102C8.73574 17.5897 8.72882 17.5693 8.7217 17.5483C8.63368 17.285 8.55502 17.0189 8.47634 16.7529C8.45832 16.6921 8.44022 16.6313 8.42211 16.5705C8.2872 16.1173 8.15451 15.6635 8.02202 15.2096C7.47014 12.9645 7.47014 12.9645 6.078 11.1493C6.05569 11.1319 6.03338 11.1145 6.01039 11.0966C5.09826 10.398 3.89667 10.1394 2.7963 9.83627C2.52415 9.76124 2.2521 9.68587 1.98006 9.61046C1.95628 9.60386 1.95628 9.60386 1.93201 9.59714C1.53962 9.48834 1.14735 9.37925 0.756448 9.26566C0.739911 9.26089 0.723375 9.25612 0.706338 9.25121C0.105798 9.07767 0.105798 9.07767 0.00129307 8.95619C-0.00166252 8.90108 -0.00166252 8.90108 0.0249378 8.84315C0.134167 8.7408 0.240153 8.69696 0.38432 8.65238C0.405194 8.64567 0.426068 8.63897 0.447574 8.63206C0.511506 8.61164 0.575577 8.59169 0.639702 8.57183C0.658001 8.56609 0.676301 8.56035 0.695155 8.55443C0.82457 8.51385 0.95445 8.47479 1.08452 8.43618C1.11648 8.42665 1.11648 8.42665 1.14909 8.41693C1.70454 8.25174 2.26361 8.09801 2.82252 7.94392C3.23899 7.82909 3.65476 7.71236 4.06921 7.59097C4.08825 7.58542 4.1073 7.57987 4.12692 7.57415C5.087 7.29393 6.02557 6.89632 6.64547 6.1074C6.65475 6.09569 6.66403 6.08399 6.6736 6.07194C7.36395 5.1963 7.63315 4.13145 7.93391 3.09241C8.03285 2.75069 8.13298 2.40929 8.23345 2.06798C8.26127 1.97347 8.28906 1.87894 8.31673 1.78439C8.42788 1.40458 8.5407 1.02528 8.66 0.647727C8.67116 0.612372 8.68227 0.577001 8.69333 0.541614C8.86035 0.00797522 8.86035 0.00797522 9.01882 0Z\" fill=\"#FBFCFF\"/><path d=\"M14.4719 1.11069C14.5805 1.22817 14.6022 1.36624 14.636 1.51625C14.7487 1.98751 14.8786 2.42084 15.3293 2.6946C15.6074 2.84167 15.9389 2.90859 16.247 2.9718C16.3771 2.99902 16.4869 3.03515 16.5985 3.1074C16.6236 3.14555 16.6236 3.14555 16.6221 3.21197C16.5963 3.29273 16.5736 3.31878 16.5054 3.37165C16.4308 3.39549 16.4308 3.39549 16.3413 3.41404C16.3075 3.42147 16.2736 3.42898 16.2398 3.43656C16.2217 3.44058 16.2036 3.4446 16.1849 3.44874C15.6339 3.57062 15.6339 3.57062 15.1576 3.84645C15.1421 3.85837 15.1267 3.87029 15.1107 3.88257C14.7703 4.16959 14.6983 4.64703 14.5958 5.04699C14.59 5.06896 14.5841 5.09092 14.578 5.11355C14.573 5.133 14.5679 5.15244 14.5627 5.17248C14.5405 5.23185 14.5176 5.27057 14.4719 5.31607C14.3447 5.33152 14.3447 5.33152 14.2828 5.31607C14.1843 5.24309 14.1623 5.15997 14.1366 5.04828C14.1322 5.03099 14.1279 5.01369 14.1235 4.99587C14.1098 4.94064 14.0965 4.88531 14.0833 4.82996C13.9796 4.39891 13.8625 3.976 13.449 3.72333C13.1258 3.55101 12.7329 3.46951 12.3717 3.4037C12.2727 3.38399 12.216 3.3592 12.1547 3.28121C12.1414 3.20208 12.1414 3.20208 12.1547 3.12294C12.2489 3.02971 12.348 3.00696 12.4754 2.97881C12.5156 2.9693 12.5557 2.95973 12.5958 2.9501C12.6165 2.94516 12.6372 2.94022 12.6586 2.93512C12.7642 2.90911 12.8689 2.87995 12.9734 2.85021C12.9924 2.84494 13.0114 2.83967 13.031 2.83424C13.2436 2.77346 13.4271 2.69571 13.5971 2.5577C13.6129 2.54523 13.6288 2.53276 13.6451 2.5199C13.9096 2.29228 13.9995 1.95032 14.081 1.63124C14.0873 1.60702 14.0935 1.5828 14.0999 1.55784C14.1123 1.50918 14.1244 1.46046 14.1363 1.4117C14.1449 1.37776 14.1449 1.37776 14.1535 1.34315C14.1585 1.32288 14.1635 1.30261 14.1686 1.28172C14.1904 1.21719 14.219 1.16652 14.2591 1.11069C14.3362 1.07385 14.3903 1.0905 14.4719 1.11069Z\" fill=\"#FBFCFF\"/><path d=\"M3.59089 12.4942C3.61902 12.4944 3.61902 12.4944 3.64772 12.4946C3.84954 12.5004 3.98609 12.5623 4.13472 12.692C4.30767 12.8707 4.38753 13.0722 4.38299 13.313C4.36357 13.5082 4.24316 13.6787 4.09547 13.8107C3.92163 13.9448 3.74626 13.9892 3.52411 13.983C3.33681 13.9621 3.1606 13.877 3.02785 13.749C2.86276 13.5336 2.8145 13.3361 2.83869 13.0707C2.88867 12.8618 3.03274 12.6923 3.21701 12.5733C3.34502 12.5113 3.44798 12.493 3.59089 12.4942Z\" fill=\"#FBFCFF\"/></svg>\n <svg *ngIf=\"isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.8333 6.46309V6.99976C12.8326 8.25767 12.4253 9.48165 11.6721 10.4892C10.9189 11.4967 9.86025 12.2337 8.65396 12.5904C7.44767 12.947 6.1584 12.9042 4.97844 12.4683C3.79848 12.0323 2.79105 11.2266 2.10639 10.1714C1.42174 9.11611 1.09654 7.8678 1.17931 6.61261C1.26208 5.35742 1.74837 4.16262 2.56566 3.20638C3.38295 2.25015 4.48746 1.58373 5.71444 1.30651C6.94143 1.02929 8.22515 1.15612 9.37417 1.66809\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M5.25 6.41634L7 8.16634L12.8333 2.33301\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ ctaText }}\n </ng-container>\n <ng-template #generatingTpl>\n <span class=\"cqa-inline-flex cqa-items-center cqa-gap-2\">\n <svg *ngIf=\"!isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"currentColor\">\n <circle cx=\"9\" cy=\"9\" r=\"7\" stroke-width=\"2\" stroke-opacity=\"0.25\"/>\n <path d=\"M16 9a7 7 0 0 1-7 7\" stroke-width=\"2\">\n <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 9 9\" to=\"360 9 9\" dur=\"0.8s\" repeatCount=\"indefinite\"/>\n </path>\n </svg>\n <svg *ngIf=\"isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"currentColor\">\n <circle cx=\"9\" cy=\"9\" r=\"7\" stroke-width=\"2\" stroke-opacity=\"0.25\"/>\n <path d=\"M16 9a7 7 0 0 1-7 7\" stroke-width=\"2\">\n <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 9 9\" to=\"360 9 9\" dur=\"0.8s\" repeatCount=\"indefinite\"/>\n </path>\n </svg>\n Generating\n </span>\n </ng-template>\n </cqa-button>\n </div>\n</div>", components: [{ type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2044
2082
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CoverageModuleCardComponent, decorators: [{
|
|
2045
2083
|
type: Component,
|
|
2046
|
-
args: [{ selector: 'cqa-coverage-module-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-py-[10px] cqa-px-[17px] cqa-shadow-card\">\n <!-- Header -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-3\">\n <h3 class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-dialog\">{{ title }}</h3>\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span\n class=\"cqa-px-[10px] cqa-py-[4px] cqa-text-[12px] cqa-leading-[16px] cqa-flex cqa-items-center cqa-gap-1 cqa-rounded-full cqa-bg-warning-light cqa-text-danger\">\n {{ issues }} {{ issues === 1 ? 'issue' : 'issues' }}\n </span>\n <button type=\"button\"\n class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-primary cqa-flex cqa-items-center cqa-gap-1\"\n *ngIf=\"showViewAction\" (click)=\"view.emit()\">\n View\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 12L10 8L6 4\" stroke=\"#4F46E5\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n </button>\n </div>\n </div>\n\n <!-- Middle metrics row -->\n <div class=\"cqa-flex cqa-items-stretch cqa-justify-between cqa-gap-6 cqa-mb-4\">\n <!-- Left: Positive / Negative / Edge Case -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-6\">\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#10B981]\">{{ positiveCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ positiveLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#EF4444]\">{{ negativeCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ negativeLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-[#F59E0B]\">{{ edgeCaseCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ edgeCaseLabel }}</span>\n </div>\n </div>\n\n <!-- Divider -->\n <div class=\"cqa-w-px cqa-bg-[#E5E7EB]\"></div>\n\n <!-- Right: AI / Human -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-6\">\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-dialog\">{{ aiCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ aiLabel }}</span>\n </div>\n <div class=\"cqa-flex cqa-flex-col cqa-items-start\">\n <span class=\"cqa-text-[18px] cqa-leading-6 cqa-font-semibold cqa-text-dialog\">{{ humanCount }}</span>\n <span class=\"cqa-text-[12px] cqa-leading-4 cqa-text-danger\">{{ humanLabel }}</span>\n </div>\n </div>\n </div>\n\n <!-- Body -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-items-center cqa-gap-3\">\n <span class=\"cqa-min-w-[120px] cqa-text-[12px] cqa-leading-4 cqa-text-[#374151]\">{{ it.label }}</span>\n <div class=\"cqa-flex-1 cqa-h-[8px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden\">\n <div class=\"cqa-h-full cqa-rounded-full\" [ngClass]=\"statusColorClass(it)\"\n [style.width]=\"formatPercent(it.percent)\"></div>\n </div>\n <span class=\"cqa-w-[40px] cqa-text-right cqa-text-[12px] cqa-leading-4\" [ngClass]=\"textColorClass(it)\">{{\n formatPercent(it.percent) }}</span>\n </div>\n </div>\n\n <!-- Footer -->\n <div class=\"cqa-mt-4\">\n <button type=\"button\"\n class=\"cqa-w-full cqa-h-[40px] cqa-rounded-[8px] cqa-bg-[#4338CA] cqa-text-white cqa-text-[14px] cqa-leading-[20px] hover:cqa-bg-[#3730A3] disabled:cqa-opacity-50 disabled:cqa-cursor-not-allowed\"\n [disabled]=\"ctaDisabled\" (click)=\"ctaClicked.emit()\">\n \u2728 {{ ctaText }}\n </button>\n </div>\n </div>\n</div>", styles: [] }]
|
|
2084
|
+
args: [{ selector: 'cqa-coverage-module-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div\n class=\"cqa-w-full cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-solid cqa-border-[#E5E7EB] cqa-py-[10px] md:cqa-px-[17px] cqa-px-3 cqa-shadow-card\">\n <!-- Header -->\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-mb-3\">\n <h3 class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-dialog\">{{ title }}</h3>\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span (click)=\"issuesClicked.emit()\"\n class=\"cqa-cursor-pointer cqa-px-[10px] cqa-py-[4px] cqa-text-[12px] cqa-leading-[16px] cqa-flex cqa-items-center cqa-gap-1 cqa-rounded-full cqa-bg-warning-light cqa-text-danger\">\n {{ issues }} {{ issues === 1 ? 'issue' : 'issues' }}\n </span>\n <button type=\"button\"\n class=\"cqa-text-[14px] cqa-leading-[20px] cqa-text-primary cqa-flex cqa-items-center cqa-gap-1\"\n *ngIf=\"showViewAction\" (click)=\"view.emit()\">\n View\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 12L10 8L6 4\" stroke=\"#4F46E5\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n </button>\n </div>\n </div>\n\n <!-- Middle metrics row -->\n <div class=\"cqa-grid md:cqa-grid-cols-4 cqa-grid-cols-2 cqa-gap-3 cqa-mb-4 cqa-border-t cqa-border-b cqa-border-surface-[#F3F4F6] cqa-py-2\">\n <!-- Left: Positive / Negative / Edge Case -->\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#059669]\">{{ positiveCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ positiveLabel }}</div>\n </div>\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#EF4444]\">{{ negativeCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ negativeLabel }}</div>\n </div>\n <div class=\"cqa-text-center\">\n <div class=\"cqa-text-[18px] cqa-leading-[28px] cqa-font-bold cqa-text-[#F59E0B]\">{{ edgeCaseCount }}</div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted\">{{ edgeCaseLabel }}</div>\n </div>\n\n <!-- Right: AI / Human -->\n <div class=\"cqa-text-center cqa-flex cqa-items-center cqa-justify-center cqa-flex-col\">\n <div class=\"cqa-flex cqa-items-center cqa-justify-center\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-items-center cqa-justify-center cqa-w-[60px] cqa-cursor-pointer\">\n <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-bold cqa-text-primary cqa-flex cqa-items-center cqa-gap-[2px]\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(#clip0_7415_11751)\"><path d=\"M4.9685 7.75012C4.92386 7.57709 4.83367 7.41918 4.70731 7.29282C4.58095 7.16646 4.42304 7.07626 4.25 7.03162L1.1825 6.24062C1.13017 6.22577 1.08411 6.19425 1.05131 6.15085C1.01851 6.10744 1.00076 6.05453 1.00076 6.00012C1.00076 5.94572 1.01851 5.89281 1.05131 5.8494C1.08411 5.806 1.13017 5.77448 1.1825 5.75962L4.25 4.96812C4.42298 4.92353 4.58085 4.83341 4.7072 4.70714C4.83356 4.58088 4.92378 4.42307 4.9685 4.25012L5.7595 1.18262C5.7742 1.13008 5.80569 1.0838 5.84916 1.05082C5.89263 1.01785 5.94569 1 6.00025 1C6.05481 1 6.10787 1.01785 6.15134 1.05082C6.19481 1.0838 6.2263 1.13008 6.241 1.18262L7.0315 4.25012C7.07614 4.42316 7.16633 4.58107 7.29269 4.70743C7.41905 4.83379 7.57696 4.92399 7.75 4.96862L10.8175 5.75912C10.8703 5.77367 10.9168 5.80513 10.9499 5.84866C10.9831 5.8922 11.001 5.94541 11.001 6.00012C11.001 6.05484 10.9831 6.10805 10.9499 6.15159C10.9168 6.19512 10.8703 6.22657 10.8175 6.24112L7.75 7.03162C7.57696 7.07626 7.41905 7.16646 7.29269 7.29282C7.16633 7.41918 7.07614 7.57709 7.0315 7.75012L6.2405 10.8176C6.2258 10.8702 6.19431 10.9165 6.15084 10.9494C6.10737 10.9824 6.05431 11.0002 5.99975 11.0002C5.94519 11.0002 5.89213 10.9824 5.84866 10.9494C5.80519 10.9165 5.7737 10.8702 5.759 10.8176L4.9685 7.75012Z\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M10 1.5V3.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M11 2.5H9\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M2 8.5V9.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M2.5 9H1.5\" stroke=\"#7C3AED\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></g><defs><clipPath id=\"clip0_7415_11751\"><rect width=\"12\" height=\"12\" fill=\"white\"/></clipPath></defs></svg>\n {{ aiLabel }}\n </span>\n <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-font-bold cqa-text-dialog\">{{ aiCount }}</span>\n </div>\n <div class=\"cqa-bg-primary-surface cqa-w-[2px] cqa-h-full cqa-mx-[3.5px]\"></div>\n <div class=\"cqa-flex cqa-flex-col cqa-gap-1 cqa-items-center cqa-justify-center cqa-w-[60px]\">\n <span class=\"cqa-text-[12px] cqa-leading-[16px] cqa-font-bold cqa-text-dialog-secondary cqa-flex cqa-items-center cqa-gap-[2px]\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.5 10.5V9.5C9.5 8.96957 9.28929 8.46086 8.91421 8.08579C8.53914 7.71071 8.03043 7.5 7.5 7.5H4.5C3.96957 7.5 3.46086 7.71071 3.08579 8.08579C2.71071 8.46086 2.5 8.96957 2.5 9.5V10.5\" stroke=\"#3F43EE\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 5.5C7.10457 5.5 8 4.60457 8 3.5C8 2.39543 7.10457 1.5 6 1.5C4.89543 1.5 4 2.39543 4 3.5C4 4.60457 4.89543 5.5 6 5.5Z\" stroke=\"#3F43EE\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ humanLabel }}\n </span>\n <span class=\"cqa-text-[14px] cqa-leading-[20px] cqa-font-bold cqa-text-dialog\">{{ humanCount }}</span>\n </div>\n </div>\n <div class=\"cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-muted cqa-pt-[2px] cqa-pb-1\">Coverage</div>\n </div>\n </div>\n\n <!-- Body -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <span class=\"md:cqa-w-full md:cqa-max-w-[216px] cqa-text-[12px] cqa-leading-[16px] cqa-text-dialog-secondary cqa-flex cqa-items-center cqa-gap-2\">\n <svg *ngIf=\"it.status=='success'\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.8333 6.46309V6.99976C12.8326 8.25767 12.4253 9.48165 11.6721 10.4892C10.9189 11.4967 9.86025 12.2337 8.65396 12.5904C7.44767 12.947 6.1584 12.9042 4.97844 12.4683C3.79848 12.0323 2.79105 11.2266 2.10639 10.1714C1.42174 9.11611 1.09654 7.8678 1.17931 6.61261C1.26208 5.35742 1.74837 4.16262 2.56566 3.20638C3.38295 2.25015 4.48746 1.58373 5.71444 1.30651C6.94143 1.02929 8.22515 1.15612 9.37417 1.66809\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M5.25 6.41634L7 8.16634L12.8333 2.33301\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <svg *ngIf=\"it.status=='error'\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 12.8337C10.2217 12.8337 12.8333 10.222 12.8333 7.00033C12.8333 3.77866 10.2217 1.16699 7 1.16699C3.77834 1.16699 1.16666 3.77866 1.16666 7.00033C1.16666 10.222 3.77834 12.8337 7 12.8337Z\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 4.66699V7.00033\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 9.33301H7.00583\" stroke=\"#EF4444\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ it.label }}\n </span>\n <div class=\"cqa-flex-1 cqa-h-[6px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden\">\n <div class=\"cqa-h-full cqa-rounded-full\" [ngClass]=\"statusColorClass(it)\"\n [style.width]=\"formatPercent(it.percent)\"></div>\n </div>\n <span class=\"cqa-min-w-[40px] cqa-text-[12px] cqa-leading-[16px] cqa-font-bold\" [ngClass]=\"textColorClass(it)\">{{\n formatPercent(it.percent) }}</span>\n </div>\n </div>\n\n <!-- Footer -->\n <cqa-button variant=\"filled\" [customClass]=\"ctaButtonClass\" (click)=\"onAiCoverageClick()\">\n <ng-container *ngIf=\"!isGenerating; else generatingTpl\">\n <svg *ngIf=\"!isGenerating && !isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.01882 0C9.12979 0.0454767 9.17718 0.15653 9.22261 0.259691C9.24539 0.319799 9.26628 0.380234 9.28657 0.44115C9.29452 0.464493 9.30246 0.487836 9.31065 0.511886C9.41613 0.826009 9.51008 1.1435 9.60457 1.46076C9.62593 1.53238 9.64739 1.60397 9.66885 1.67557C9.7781 2.04007 9.88654 2.4048 9.99438 2.76969C10.0095 2.82093 10.0247 2.87218 10.0398 2.92342C10.0826 3.0679 10.1252 3.21239 10.1677 3.35694C10.2573 3.66239 10.3495 3.96695 10.4476 4.27002C10.4561 4.29653 10.4647 4.32305 10.4735 4.35036C10.7284 5.12999 11.0896 5.82875 11.6818 6.42393C11.6965 6.4394 11.7111 6.45488 11.7262 6.47083C11.979 6.72875 12.3034 6.93541 12.6276 7.10221C12.6441 7.11085 12.6606 7.11948 12.6776 7.12838C13.6317 7.61851 14.779 7.83407 15.8124 8.12101C16.2652 8.24681 16.7166 8.37658 17.1663 8.51206C17.1979 8.52157 17.2296 8.53107 17.2612 8.54055C17.3557 8.5689 17.45 8.59774 17.5442 8.62694C17.5662 8.63358 17.5882 8.64023 17.6108 8.64707C17.7406 8.68812 17.8648 8.73658 17.9713 8.82054C18.0038 8.88837 18.0038 8.88837 17.995 8.95619C17.8913 9.05472 17.7884 9.10092 17.6516 9.14599C17.632 9.15264 17.6124 9.1593 17.5923 9.16615C17.3612 9.24366 17.127 9.31149 16.8925 9.37871C16.8444 9.39261 16.7963 9.40651 16.7482 9.42042C16.4514 9.50603 16.1542 9.5898 15.8566 9.67263C15.4646 9.78175 15.0733 9.89268 14.6823 10.0049C14.6182 10.0232 14.5541 10.0416 14.49 10.0598C14.1534 10.1557 13.8185 10.2551 13.4863 10.3642C13.4587 10.3732 13.4312 10.3822 13.4028 10.3915C12.2902 10.7616 11.4422 11.4522 10.9114 12.462C10.6253 13.0295 10.4565 13.6432 10.2843 14.2489C10.2377 14.4124 10.1882 14.5749 10.1381 14.7374C10.0988 14.8652 10.0604 14.9933 10.023 15.1216C10.0185 15.1369 10.0141 15.1522 10.0095 15.1679C9.98788 15.2419 9.96638 15.3159 9.94503 15.3899C9.89039 15.5776 9.83156 15.7637 9.77111 15.9498C9.66383 16.2804 9.5662 16.6135 9.46917 16.947C9.32288 17.4491 9.32288 17.4491 9.23993 17.6905C9.23443 17.7067 9.22893 17.7229 9.22326 17.7396C9.19298 17.8256 9.16183 17.9047 9.10453 17.9774C9.01734 17.9958 9.01734 17.9958 8.93901 18C8.84946 17.8752 8.79016 17.7542 8.74265 17.6102C8.73574 17.5897 8.72882 17.5693 8.7217 17.5483C8.63368 17.285 8.55502 17.0189 8.47634 16.7529C8.45832 16.6921 8.44022 16.6313 8.42211 16.5705C8.2872 16.1173 8.15451 15.6635 8.02202 15.2096C7.47014 12.9645 7.47014 12.9645 6.078 11.1493C6.05569 11.1319 6.03338 11.1145 6.01039 11.0966C5.09826 10.398 3.89667 10.1394 2.7963 9.83627C2.52415 9.76124 2.2521 9.68587 1.98006 9.61046C1.95628 9.60386 1.95628 9.60386 1.93201 9.59714C1.53962 9.48834 1.14735 9.37925 0.756448 9.26566C0.739911 9.26089 0.723375 9.25612 0.706338 9.25121C0.105798 9.07767 0.105798 9.07767 0.00129307 8.95619C-0.00166252 8.90108 -0.00166252 8.90108 0.0249378 8.84315C0.134167 8.7408 0.240153 8.69696 0.38432 8.65238C0.405194 8.64567 0.426068 8.63897 0.447574 8.63206C0.511506 8.61164 0.575577 8.59169 0.639702 8.57183C0.658001 8.56609 0.676301 8.56035 0.695155 8.55443C0.82457 8.51385 0.95445 8.47479 1.08452 8.43618C1.11648 8.42665 1.11648 8.42665 1.14909 8.41693C1.70454 8.25174 2.26361 8.09801 2.82252 7.94392C3.23899 7.82909 3.65476 7.71236 4.06921 7.59097C4.08825 7.58542 4.1073 7.57987 4.12692 7.57415C5.087 7.29393 6.02557 6.89632 6.64547 6.1074C6.65475 6.09569 6.66403 6.08399 6.6736 6.07194C7.36395 5.1963 7.63315 4.13145 7.93391 3.09241C8.03285 2.75069 8.13298 2.40929 8.23345 2.06798C8.26127 1.97347 8.28906 1.87894 8.31673 1.78439C8.42788 1.40458 8.5407 1.02528 8.66 0.647727C8.67116 0.612372 8.68227 0.577001 8.69333 0.541614C8.86035 0.00797522 8.86035 0.00797522 9.01882 0Z\" fill=\"#FBFCFF\"/><path d=\"M14.4719 1.11069C14.5805 1.22817 14.6022 1.36624 14.636 1.51625C14.7487 1.98751 14.8786 2.42084 15.3293 2.6946C15.6074 2.84167 15.9389 2.90859 16.247 2.9718C16.3771 2.99902 16.4869 3.03515 16.5985 3.1074C16.6236 3.14555 16.6236 3.14555 16.6221 3.21197C16.5963 3.29273 16.5736 3.31878 16.5054 3.37165C16.4308 3.39549 16.4308 3.39549 16.3413 3.41404C16.3075 3.42147 16.2736 3.42898 16.2398 3.43656C16.2217 3.44058 16.2036 3.4446 16.1849 3.44874C15.6339 3.57062 15.6339 3.57062 15.1576 3.84645C15.1421 3.85837 15.1267 3.87029 15.1107 3.88257C14.7703 4.16959 14.6983 4.64703 14.5958 5.04699C14.59 5.06896 14.5841 5.09092 14.578 5.11355C14.573 5.133 14.5679 5.15244 14.5627 5.17248C14.5405 5.23185 14.5176 5.27057 14.4719 5.31607C14.3447 5.33152 14.3447 5.33152 14.2828 5.31607C14.1843 5.24309 14.1623 5.15997 14.1366 5.04828C14.1322 5.03099 14.1279 5.01369 14.1235 4.99587C14.1098 4.94064 14.0965 4.88531 14.0833 4.82996C13.9796 4.39891 13.8625 3.976 13.449 3.72333C13.1258 3.55101 12.7329 3.46951 12.3717 3.4037C12.2727 3.38399 12.216 3.3592 12.1547 3.28121C12.1414 3.20208 12.1414 3.20208 12.1547 3.12294C12.2489 3.02971 12.348 3.00696 12.4754 2.97881C12.5156 2.9693 12.5557 2.95973 12.5958 2.9501C12.6165 2.94516 12.6372 2.94022 12.6586 2.93512C12.7642 2.90911 12.8689 2.87995 12.9734 2.85021C12.9924 2.84494 13.0114 2.83967 13.031 2.83424C13.2436 2.77346 13.4271 2.69571 13.5971 2.5577C13.6129 2.54523 13.6288 2.53276 13.6451 2.5199C13.9096 2.29228 13.9995 1.95032 14.081 1.63124C14.0873 1.60702 14.0935 1.5828 14.0999 1.55784C14.1123 1.50918 14.1244 1.46046 14.1363 1.4117C14.1449 1.37776 14.1449 1.37776 14.1535 1.34315C14.1585 1.32288 14.1635 1.30261 14.1686 1.28172C14.1904 1.21719 14.219 1.16652 14.2591 1.11069C14.3362 1.07385 14.3903 1.0905 14.4719 1.11069Z\" fill=\"#FBFCFF\"/><path d=\"M3.59089 12.4942C3.61902 12.4944 3.61902 12.4944 3.64772 12.4946C3.84954 12.5004 3.98609 12.5623 4.13472 12.692C4.30767 12.8707 4.38753 13.0722 4.38299 13.313C4.36357 13.5082 4.24316 13.6787 4.09547 13.8107C3.92163 13.9448 3.74626 13.9892 3.52411 13.983C3.33681 13.9621 3.1606 13.877 3.02785 13.749C2.86276 13.5336 2.8145 13.3361 2.83869 13.0707C2.88867 12.8618 3.03274 12.6923 3.21701 12.5733C3.34502 12.5113 3.44798 12.493 3.59089 12.4942Z\" fill=\"#FBFCFF\"/></svg>\n <svg *ngIf=\"isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.8333 6.46309V6.99976C12.8326 8.25767 12.4253 9.48165 11.6721 10.4892C10.9189 11.4967 9.86025 12.2337 8.65396 12.5904C7.44767 12.947 6.1584 12.9042 4.97844 12.4683C3.79848 12.0323 2.79105 11.2266 2.10639 10.1714C1.42174 9.11611 1.09654 7.8678 1.17931 6.61261C1.26208 5.35742 1.74837 4.16262 2.56566 3.20638C3.38295 2.25015 4.48746 1.58373 5.71444 1.30651C6.94143 1.02929 8.22515 1.15612 9.37417 1.66809\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M5.25 6.41634L7 8.16634L12.8333 2.33301\" stroke=\"#10B981\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n {{ ctaText }}\n </ng-container>\n <ng-template #generatingTpl>\n <span class=\"cqa-inline-flex cqa-items-center cqa-gap-2\">\n <svg *ngIf=\"!isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"currentColor\">\n <circle cx=\"9\" cy=\"9\" r=\"7\" stroke-width=\"2\" stroke-opacity=\"0.25\"/>\n <path d=\"M16 9a7 7 0 0 1-7 7\" stroke-width=\"2\">\n <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 9 9\" to=\"360 9 9\" dur=\"0.8s\" repeatCount=\"indefinite\"/>\n </path>\n </svg>\n <svg *ngIf=\"isGenerated\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"currentColor\">\n <circle cx=\"9\" cy=\"9\" r=\"7\" stroke-width=\"2\" stroke-opacity=\"0.25\"/>\n <path d=\"M16 9a7 7 0 0 1-7 7\" stroke-width=\"2\">\n <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 9 9\" to=\"360 9 9\" dur=\"0.8s\" repeatCount=\"indefinite\"/>\n </path>\n </svg>\n Generating\n </span>\n </ng-template>\n </cqa-button>\n </div>\n</div>", styles: [] }]
|
|
2047
2085
|
}], propDecorators: { title: [{
|
|
2048
2086
|
type: Input
|
|
2049
2087
|
}], issues: [{
|
|
@@ -2076,10 +2114,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
2076
2114
|
type: Input
|
|
2077
2115
|
}], ctaDisabled: [{
|
|
2078
2116
|
type: Input
|
|
2117
|
+
}], generationMs: [{
|
|
2118
|
+
type: Input
|
|
2079
2119
|
}], view: [{
|
|
2080
2120
|
type: Output
|
|
2121
|
+
}], issuesClicked: [{
|
|
2122
|
+
type: Output
|
|
2081
2123
|
}], ctaClicked: [{
|
|
2082
2124
|
type: Output
|
|
2125
|
+
}], aiCoverageClick: [{
|
|
2126
|
+
type: Output
|
|
2083
2127
|
}] } });
|
|
2084
2128
|
|
|
2085
2129
|
class TestDistributionCardComponent {
|
|
@@ -2101,10 +2145,10 @@ class TestDistributionCardComponent {
|
|
|
2101
2145
|
}
|
|
2102
2146
|
}
|
|
2103
2147
|
TestDistributionCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TestDistributionCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2104
|
-
TestDistributionCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TestDistributionCardComponent, selector: "cqa-test-distribution-card", inputs: { title: "title", segments: "segments", items: "items" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-
|
|
2148
|
+
TestDistributionCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TestDistributionCardComponent, selector: "cqa-test-distribution-card", inputs: { title: "title", segments: "segments", items: "items" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-border-default cqa-py-[14.5px] cqa-px-[17px] cqa-shadow-card\">\n <!-- Title -->\n <h3 class=\"cqa-text-[16px] cqa-leading-6 cqa-text-[#111827] cqa-mb-2\">{{ title }}</h3>\n\n <!-- Stacked segments pill -->\n <div class=\"cqa-w-full cqa-h-[24px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden cqa-flex cqa-mb-2\">\n <ng-container *ngFor=\"let s of segments; let i = index; let last = last\">\n <div\n class=\"cqa-h-full cqa-flex cqa-items-center cqa-justify-center cqa-text-white cqa-text-[12px] cqa-leading-[16px]\"\n [ngClass]=\"[\n segmentColor(s, i === 0 ? 'cqa-bg-[#4F46E5]' : i === segments.length - 1 ? 'cqa-bg-[#059669]' : 'cqa-bg-[#9333EA]'),\n i === 0 ? 'cqa-rounded-l-full' : '',\n last ? 'cqa-rounded-r-full' : ''\n ]\" [style.width]=\"segmentWidth(s)\">\n {{ s.label }}\n </div>\n </ng-container>\n </div>\n\n <!-- Items list -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-[6px]\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-flex-col cqa-gap-[6px]\">\n <!-- Parent row -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between\">\n <div class=\"cqa-flex cqa-items-center\">\n <span class=\"cqa-w-[4px] cqa-h-[12px] cqa-rounded-full cqa-bg-[#4F46E5]\"></span>\n <div class=\"cqa-ml-[8px] cqa-mr-[6px]\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.00008 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00008 1.16699C3.77842 1.16699 1.16675 3.77866 1.16675 7.00033C1.16675 10.222 3.77842 12.8337 7.00008 12.8337Z\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.00008 1.16699C5.50222 2.73975 4.66675 4.82842 4.66675 7.00033C4.66675 9.17223 5.50222 11.2609 7.00008 12.8337C8.49794 11.2609 9.33341 9.17223 9.33341 7.00033C9.33341 4.82842 8.49794 2.73975 7.00008 1.16699Z\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M1.16675 7H12.8334\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <!-- <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.91675 1.16699H4.08341C3.43908 1.16699 2.91675 1.68933 2.91675 2.33366V11.667C2.91675 12.3113 3.43908 12.8337 4.08341 12.8337H9.91675C10.5611 12.8337 11.0834 12.3113 11.0834 11.667V2.33366C11.0834 1.68933 10.5611 1.16699 9.91675 1.16699Z\" stroke=\"#9333EA\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 10.5H7.00583\" stroke=\"#9333EA\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg> -->\n <!-- <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.33325 10.5L12.8333 7L9.33325 3.5\" stroke=\"#059669\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.66675 3.5L1.16675 7L4.66675 10.5\" stroke=\"#059669\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg> -->\n </div>\n <span class=\"cqa-text-[12px] cqa-leading-[18px] cqa-text-dialog-muted\">{{ it.label }}</span>\n </div>\n <div class=\"cqa-text-[12px] cqa-leading-4 cqa-font-bold\">{{ it.value | number }}</div>\n </div>\n\n <!-- Children rows -->\n <div *ngIf=\"it.children?.length\" class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div *ngFor=\"let ch of it.children\"\n class=\"cqa-flex cqa-items-center cqa-flex-1 cqa-rounded-[4px] cqa-bg-[#F9FAFB] cqa-border-l-4 cqa-border-[#9333EA]\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[10px] cqa-leading-[15px] cqa-text-[#4B5563]\">\n <div class=\"cqa-pl-2 cqa-pr-1\">{{ ch.label }}</div>\n <span class=\"cqa-font-bold cqa-text-[#111827]\">{{ ch.value }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "number": i2.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2105
2149
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TestDistributionCardComponent, decorators: [{
|
|
2106
2150
|
type: Component,
|
|
2107
|
-
args: [{ selector: 'cqa-test-distribution-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-
|
|
2151
|
+
args: [{ selector: 'cqa-test-distribution-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-bg-white cqa-rounded-[8px] cqa-border cqa-border-border-default cqa-py-[14.5px] cqa-px-[17px] cqa-shadow-card\">\n <!-- Title -->\n <h3 class=\"cqa-text-[16px] cqa-leading-6 cqa-text-[#111827] cqa-mb-2\">{{ title }}</h3>\n\n <!-- Stacked segments pill -->\n <div class=\"cqa-w-full cqa-h-[24px] cqa-rounded-full cqa-bg-[#F3F4F6] cqa-overflow-hidden cqa-flex cqa-mb-2\">\n <ng-container *ngFor=\"let s of segments; let i = index; let last = last\">\n <div\n class=\"cqa-h-full cqa-flex cqa-items-center cqa-justify-center cqa-text-white cqa-text-[12px] cqa-leading-[16px]\"\n [ngClass]=\"[\n segmentColor(s, i === 0 ? 'cqa-bg-[#4F46E5]' : i === segments.length - 1 ? 'cqa-bg-[#059669]' : 'cqa-bg-[#9333EA]'),\n i === 0 ? 'cqa-rounded-l-full' : '',\n last ? 'cqa-rounded-r-full' : ''\n ]\" [style.width]=\"segmentWidth(s)\">\n {{ s.label }}\n </div>\n </ng-container>\n </div>\n\n <!-- Items list -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-[6px]\">\n <div *ngFor=\"let it of items\" class=\"cqa-flex cqa-flex-col cqa-gap-[6px]\">\n <!-- Parent row -->\n <div class=\"cqa-flex cqa-items-center cqa-justify-between\">\n <div class=\"cqa-flex cqa-items-center\">\n <span class=\"cqa-w-[4px] cqa-h-[12px] cqa-rounded-full cqa-bg-[#4F46E5]\"></span>\n <div class=\"cqa-ml-[8px] cqa-mr-[6px]\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.00008 12.8337C10.2217 12.8337 12.8334 10.222 12.8334 7.00033C12.8334 3.77866 10.2217 1.16699 7.00008 1.16699C3.77842 1.16699 1.16675 3.77866 1.16675 7.00033C1.16675 10.222 3.77842 12.8337 7.00008 12.8337Z\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.00008 1.16699C5.50222 2.73975 4.66675 4.82842 4.66675 7.00033C4.66675 9.17223 5.50222 11.2609 7.00008 12.8337C8.49794 11.2609 9.33341 9.17223 9.33341 7.00033C9.33341 4.82842 8.49794 2.73975 7.00008 1.16699Z\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M1.16675 7H12.8334\" stroke=\"#4F46E5\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <!-- <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.91675 1.16699H4.08341C3.43908 1.16699 2.91675 1.68933 2.91675 2.33366V11.667C2.91675 12.3113 3.43908 12.8337 4.08341 12.8337H9.91675C10.5611 12.8337 11.0834 12.3113 11.0834 11.667V2.33366C11.0834 1.68933 10.5611 1.16699 9.91675 1.16699Z\" stroke=\"#9333EA\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7 10.5H7.00583\" stroke=\"#9333EA\" stroke-width=\"1.16667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg> -->\n <!-- <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.33325 10.5L12.8333 7L9.33325 3.5\" stroke=\"#059669\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M4.66675 3.5L1.16675 7L4.66675 10.5\" stroke=\"#059669\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg> -->\n </div>\n <span class=\"cqa-text-[12px] cqa-leading-[18px] cqa-text-dialog-muted\">{{ it.label }}</span>\n </div>\n <div class=\"cqa-text-[12px] cqa-leading-4 cqa-font-bold\">{{ it.value | number }}</div>\n </div>\n\n <!-- Children rows -->\n <div *ngIf=\"it.children?.length\" class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <div *ngFor=\"let ch of it.children\"\n class=\"cqa-flex cqa-items-center cqa-flex-1 cqa-rounded-[4px] cqa-bg-[#F9FAFB] cqa-border-l-4 cqa-border-[#9333EA]\">\n <div class=\"cqa-flex cqa-items-center cqa-text-[10px] cqa-leading-[15px] cqa-text-[#4B5563]\">\n <div class=\"cqa-pl-2 cqa-pr-1\">{{ ch.label }}</div>\n <span class=\"cqa-font-bold cqa-text-[#111827]\">{{ ch.value }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: [] }]
|
|
2108
2152
|
}], propDecorators: { title: [{
|
|
2109
2153
|
type: Input
|
|
2110
2154
|
}], segments: [{
|
|
@@ -2122,7 +2166,7 @@ class FailedTestCasesCardComponent {
|
|
|
2122
2166
|
/** Pill label (e.g., "failures") */
|
|
2123
2167
|
this.failuresLabel = 'failures';
|
|
2124
2168
|
/** Optional custom class for the pill background */
|
|
2125
|
-
this.pillClass = 'bg-[#
|
|
2169
|
+
this.pillClass = 'cqa-bg-[#F15F5F] cqa-text-[#FAFAFA]';
|
|
2126
2170
|
/** Root cause label (left part, emphasized) */
|
|
2127
2171
|
this.rootCauseLabel = 'Root cause';
|
|
2128
2172
|
/** If false, hide the root cause row */
|
|
@@ -2132,7 +2176,7 @@ class FailedTestCasesCardComponent {
|
|
|
2132
2176
|
/** Optional extra class for the outer card */
|
|
2133
2177
|
this.cardClass = '';
|
|
2134
2178
|
/** Left border accent class */
|
|
2135
|
-
this.leftAccentClass = 'border-l-[4px] border-[#EF4444]';
|
|
2179
|
+
this.leftAccentClass = 'cqa-border-l-[4px] cqa-border-[#EF4444]';
|
|
2136
2180
|
}
|
|
2137
2181
|
get rootCauseDisplay() {
|
|
2138
2182
|
return this.rootCause && this.rootCause.trim().length
|
|
@@ -2141,10 +2185,10 @@ class FailedTestCasesCardComponent {
|
|
|
2141
2185
|
}
|
|
2142
2186
|
}
|
|
2143
2187
|
FailedTestCasesCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2144
|
-
FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-
|
|
2188
|
+
FailedTestCasesCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FailedTestCasesCardComponent, selector: "cqa-failed-test-cases-card", inputs: { title: "title", failures: "failures", failuresLabel: "failuresLabel", pillClass: "pillClass", rootCause: "rootCause", rootCauseLabel: "rootCauseLabel", showRootCause: "showRootCause", lastFailed: "lastFailed", lastFailedLabel: "lastFailedLabel", cardClass: "cardClass", leftAccentClass: "leftAccentClass" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px]\"\n [ngClass]=\"[leftAccentClass, cardClass]\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n <!-- Title -->\n <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n <!-- Failures pill -->\n <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n [ngClass]=\"pillClass\">\n {{ failures | number }} {{ failuresLabel }}\n </span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n <!-- Root cause -->\n <div *ngIf=\"showRootCause\" class=\"md:cqa-px-[11px] cqa-py-[3px] cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F]\">\n <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n </div>\n\n <!-- Timestamp -->\n <div *ngIf=\"lastFailed\"\n class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n </div>\n </div>\n </div>\n</div>", directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "number": i2.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2145
2189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FailedTestCasesCardComponent, decorators: [{
|
|
2146
2190
|
type: Component,
|
|
2147
|
-
args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-
|
|
2191
|
+
args: [{ selector: 'cqa-failed-test-cases-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-w-full cqa-bg-[#FEF2F240] cqa-rounded-[10px] cqa-p-[10px] cqa-pl-[20px]\"\n [ngClass]=\"[leftAccentClass, cardClass]\">\n <div class=\"cqa-flex cqa-items-start cqa-justify-between cqa-gap-2 cqa-flex-wrap\">\n <!-- Title -->\n <h3 class=\"cqa-text-[14px] cqa-leading-[17px] cqa-font-semibold cqa-text-[#1A1A1A]\">{{ title }}</h3>\n\n <!-- Failures pill -->\n <span class=\"cqa-px-[11px] cqa-py-[3px] cqa-rounded-full cqa-text-[12px] cqa-leading-[16px] cqa-font-medium cqa-tracking-[0.3px]\"\n [ngClass]=\"pillClass\">\n {{ failures | number }} {{ failuresLabel }}\n </span>\n </div>\n\n <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-flex-wrap cqa-mt-2\">\n <!-- Root cause -->\n <div *ngIf=\"showRootCause\" class=\"md:cqa-px-[11px] cqa-py-[3px] cqa-text-[12px] cqa-leading-[15px] cqa-text-[#F15F5F]\">\n <span class=\"cqa-font-semibold\">{{ rootCauseLabel }}: </span>{{ rootCauseDisplay }}\n </div>\n\n <!-- Timestamp -->\n <div *ngIf=\"lastFailed\"\n class=\"cqa-py-[3px] cqa-flex cqa-items-center cqa-gap-1 cqa-text-[10px] cqa-leading-[15px] cqa-font-medium cqa-text-dialog-muted\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M6 3V6L8 7\" stroke=\"#6B7280\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <span>{{ lastFailedLabel }}: {{ lastFailed }}</span>\n </div>\n </div>\n </div>\n</div>", styles: [] }]
|
|
2148
2192
|
}], propDecorators: { title: [{
|
|
2149
2193
|
type: Input
|
|
2150
2194
|
}], failures: [{
|
|
@@ -2310,9 +2354,9 @@ class BadgeComponent {
|
|
|
2310
2354
|
if (!this.backgroundColor && !this.textColor) {
|
|
2311
2355
|
switch (this.variant) {
|
|
2312
2356
|
case 'error':
|
|
2313
|
-
return [...baseClasses, 'cqa-bg-
|
|
2357
|
+
return [...baseClasses, 'cqa-bg-[#FCD9D9]', 'cqa-text-[#9F2A2A]'].join(' ');
|
|
2314
2358
|
case 'warning':
|
|
2315
|
-
return [...baseClasses, 'cqa-bg-
|
|
2359
|
+
return [...baseClasses, 'cqa-bg-[#FFF9E9]', 'cqa-text-[#7E6012]'].join(' ');
|
|
2316
2360
|
case 'info':
|
|
2317
2361
|
return [...baseClasses, 'cqa-bg-blue-100', 'cqa-text-blue-800'].join(' ');
|
|
2318
2362
|
case 'success':
|
|
@@ -2565,12 +2609,12 @@ class InsightCardComponent {
|
|
|
2565
2609
|
return getMetadataValueStyle(key, value);
|
|
2566
2610
|
}
|
|
2567
2611
|
getSectionTitleClasses(section) {
|
|
2568
|
-
const baseClasses = ['cqa-text-sm', 'cqa-font-
|
|
2612
|
+
const baseClasses = ['cqa-text-sm', 'cqa-leading-[17px]', 'cqa-font-semibold'];
|
|
2569
2613
|
switch (section.variant) {
|
|
2570
2614
|
case 'warning':
|
|
2571
|
-
return [...baseClasses, 'cqa-text-
|
|
2615
|
+
return [...baseClasses, 'cqa-text-[#78350F]'].join(' ');
|
|
2572
2616
|
case 'error':
|
|
2573
|
-
return [...baseClasses, 'cqa-text-
|
|
2617
|
+
return [...baseClasses, 'cqa-text-[#881337]'].join(' ');
|
|
2574
2618
|
default:
|
|
2575
2619
|
return [...baseClasses, 'cqa-text-ink'].join(' ');
|
|
2576
2620
|
}
|
|
@@ -2578,19 +2622,19 @@ class InsightCardComponent {
|
|
|
2578
2622
|
getSectionIconColor(section) {
|
|
2579
2623
|
switch (section.variant) {
|
|
2580
2624
|
case 'warning':
|
|
2581
|
-
return 'cqa-text-
|
|
2625
|
+
return 'cqa-text-[#78350F]';
|
|
2582
2626
|
case 'error':
|
|
2583
|
-
return 'cqa-text-
|
|
2627
|
+
return 'cqa-text-[#881337]';
|
|
2584
2628
|
default:
|
|
2585
2629
|
return 'cqa-text-gray-400';
|
|
2586
2630
|
}
|
|
2587
2631
|
}
|
|
2588
2632
|
}
|
|
2589
2633
|
InsightCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InsightCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2590
|
-
InsightCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InsightCardComponent, selector: "cqa-insight-card", inputs: { title: "title", description: "description", badges: "badges", metadata: "metadata", prerequisiteSection: "prerequisiteSection", testDataSection: "testDataSection", metadataExpanded: "metadataExpanded", isPrerequisiteMissing: "isPrerequisiteMissing", isTestDataMissing: "isTestDataMissing" }, outputs: { metadataToggle: "metadataToggle", sectionToggle: "sectionToggle", sectionActionClick: "sectionActionClick", onApplySuggestionClick: "onApplySuggestionClick", onAttachPrerequisitesClick: "onAttachPrerequisitesClick", onImportTestDataClick: "onImportTestDataClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\" style=\"background-color: white; border-radius: 0.5rem; border: 1px solid #E5E7EB; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-4 cqa-px-[21px] cqa-py-3 cqa-border cqa-border-gray-200 cqa-rounded-2xl\">\n <!-- Section 1: Badges -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\" *ngIf=\"visibleBadges.length > 0\">\n <mat-icon *ngIf=\"isPrerequisiteMissing || isTestDataMissing\"\n class=\"cqa-text-yellow-500 cqa-w-6 cqa-h-6\">warning</mat-icon>\n <div class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n <cqa-badge \n *ngFor=\"let badge of visibleBadges\" \n [label]=\"badge.label\"\n [icon]=\"badge.icon\"\n [variant]=\"badge.variant || 'default'\"\n ></cqa-badge>\n </div>\n </div>\n\n <!-- Section 2: Title & Description -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <h2 class=\"cqa-font-medium cqa-text-lg cqa-text-title\">\n {{ title }}\n </h2>\n <p class=\"cqa-text-base cqa-font-normal cqa-text-description\">\n {{ description }}\n </p>\n </div>\n\n <!-- Section 3: Metadata Section (always visible) -->\n <div *ngIf=\"metadata\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div class=\"cqa-bg-surface-default cqa-rounded-xl cqa-border cqa-border-border-light cqa-px-4 cqa-py-3 cqa-border-t-2 cqa-border-t-primary-surface\">\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <ng-container *ngFor=\"let item of metadata | keyvalue; let last = last\">\n <div class=\"cqa-flex cqa-items-baseline cqa-gap-2\">\n <span class=\"cqa-text-xs cqa-font-normal cqa-tracking-normal cqa-font-inter cqa-text-metadata-key\">\n {{ item.key }}:\n </span>\n <span \n [ngClass]=\"getMetadataValueClasses(item.key, item.value)\" \n [ngStyle]=\"getMetadataValueStyle(item.key, item.value)\"\n class=\"cqa-font-normal cqa-leading-[18px] cqa-tracking-normal cqa-font-inter cqa-text-sm\">\n {{ getMetadataValue(item.value) }}\n </span>\n </div>\n <div *ngIf=\"!last\" class=\"cqa-h-4 cqa-w-px cqa-bg-gray-200\"></div>\n </ng-container>\n </div>\n </div>\n\n <!-- Section 4: Metadata toggle -->\n <button *ngIf=\"metadata && (isPrerequisiteMissing || isTestDataMissing)\" type=\"button\"\n class=\"cqa-text-sm cqa-text-primary-hover cqa-font-medium cqa-inline-flex cqa-items-center cqa-gap-1 cqa-cursor-pointer cqa-bg-transparent cqa-border-0 cqa-p-0 cqa-hover:cqa-text-primary cqa-transition-colors\"\n (click)=\"toggleMetadata()\">\n <span>{{ metadataExpanded ? 'Hide details' : 'Show details' }}</span>\n <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ metadataExpanded ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n\n <!-- Section 5: Sections (toggle visibility) -->\n <div *ngIf=\"metadataExpanded && visibleSections?.length\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div\n *ngFor=\"let section of visibleSections\"\n class=\"cqa-border cqa-border-gray-200 cqa-rounded-md cqa-bg-white cqa-overflow-hidden\"\n [ngClass]=\"getSectionBorderClass(section)\"\n >\n <div class=\"cqa-p-4 cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Section Title with Inline Collapse Button -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <h3 [ngClass]=\"getSectionTitleClasses(section)\" class=\"cqa-m-0\">\n {{ section.title }}\n </h3>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-inline-flex cqa-items-center cqa-justify-center cqa-cursor-pointer cqa-bg-transparent cqa-border-0 cqa-p-1 cqa-rounded-full cqa-hover:cqa-bg-gray-100 cqa-transition-colors\"\n (click)=\"toggleSection(section)\"\n [attr.aria-label]=\"section.expanded !== false ? 'Collapse section' : 'Expand section'\"\n >\n <mat-icon [ngClass]=\"getSectionIconColor(section)\" class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ section.expanded !== false ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n </div>\n\n <!-- Collapsible Content: Reason and Action Button -->\n <div *ngIf=\"section.expanded !== false\" class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Reason -->\n <p class=\"cqa-text-sm cqa-font-normal cqa-leading-4 cqa-text-neutral-600\">\n <strong>Reason:</strong> {{ section.reason }}\n </p>\n \n <!-- Action Button -->\n <div>\n <cqa-button\n variant=\"outlined\"\n (clicked)=\"onSectionAction(section.id)\"\n >\n {{ section.actionButtonLabel }}\n </cqa-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n \n <cqa-button\n variant=\"filled\"\n [icon]=\"isApplying ? 'hourglass_empty' : 'auto_awesome'\"\n iconPosition=\"start\"\n (clicked)=\"onMainAction()\"\n [fullWidth]=\"true\"\n [disabled]=\"isApplying\"\n [iconColor]=\"isApplying ? '#EAB308' : undefined\"\n >\n {{ isApplying ? 'Applying suggestion' : 'Apply suggestion' }}\n </cqa-button>\n </div>\n</div>\n \n", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: BadgeComponent, selector: "cqa-badge", inputs: ["label", "icon", "variant", "backgroundColor", "textColor", "iconBackgroundColor", "iconColor"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "keyvalue": i2.KeyValuePipe } });
|
|
2634
|
+
InsightCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: InsightCardComponent, selector: "cqa-insight-card", inputs: { title: "title", description: "description", badges: "badges", metadata: "metadata", prerequisiteSection: "prerequisiteSection", testDataSection: "testDataSection", metadataExpanded: "metadataExpanded", isPrerequisiteMissing: "isPrerequisiteMissing", isTestDataMissing: "isTestDataMissing" }, outputs: { metadataToggle: "metadataToggle", sectionToggle: "sectionToggle", sectionActionClick: "sectionActionClick", onApplySuggestionClick: "onApplySuggestionClick", onAttachPrerequisitesClick: "onAttachPrerequisitesClick", onImportTestDataClick: "onImportTestDataClick" }, ngImport: i0, template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-font-inter cqa-flex cqa-flex-col cqa-gap-4 cqa-px-[21px] cqa-py-3 cqa-border cqa-border-[#ECECEC] cqa-rounded-xl cqa-shadow-card\">\n <!-- Section 1: Badges -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqapy-[1.5]\" *ngIf=\"visibleBadges.length > 0\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M14.4866 12.0005L9.15329 2.66714C9.037 2.46194 8.86836 2.29127 8.66457 2.17252C8.46078 2.05378 8.22915 1.99121 7.99329 1.99121C7.75743 1.99121 7.52579 2.05378 7.322 2.17252C7.11822 2.29127 6.94958 2.46194 6.83329 2.66714L1.49995 12.0005C1.38241 12.204 1.32077 12.4351 1.32129 12.6701C1.32181 12.9052 1.38447 13.136 1.50292 13.339C1.62136 13.5421 1.79138 13.7102 1.99575 13.8264C2.20011 13.9425 2.43156 14.0026 2.66662 14.0005H13.3333C13.5672 14.0002 13.797 13.9385 13.9995 13.8213C14.202 13.7042 14.3701 13.5359 14.487 13.3332C14.6038 13.1306 14.6653 12.9007 14.6653 12.6668C14.6652 12.4329 14.6036 12.2031 14.4866 12.0005Z\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M8 6V8.66667\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M8 11.333H8.00667\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <div class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n <cqa-badge \n *ngFor=\"let badge of visibleBadges\" \n [label]=\"badge.label\"\n [icon]=\"badge.icon\"\n [variant]=\"badge.variant || 'default'\"\n ></cqa-badge>\n </div>\n </div>\n\n <!-- Section 2: Title & Description -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <h2 class=\"cqa-font-medium cqa-text-lg cqa-leading-[22px] cqa-text-title\">\n {{ title }}\n </h2>\n <p class=\"cqa-text-base cqa-font-normal cqa-text-description\">\n {{ description }}\n </p>\n </div>\n\n <!-- Section 3: Metadata Section (always visible) -->\n <div *ngIf=\"metadata\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div class=\"cqa-bg-surface-default cqa-rounded-[10px] cqa-px-4 cqa-py-3 cqa-border-t cqa-border-t-primary-surface\">\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-[25px]\">\n <ng-container *ngFor=\"let item of metadata | keyvalue; let last = last\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-[6px]\">\n <span class=\"cqa-text-xs cqa-font-normal cqa-font-inter cqa-text-metadata-key\">\n {{ item.key }}:\n </span>\n <span \n [ngClass]=\"getMetadataValueClasses(item.key, item.value)\" \n [ngStyle]=\"getMetadataValueStyle(item.key, item.value)\"\n class=\"cqa-font-normal cqa-leading-[18px] cqa-font-inter cqa-text-sm cqa-text-title\">\n {{ getMetadataValue(item.value) }}\n </span>\n </div>\n <div *ngIf=\"!last\" class=\"cqa-h-4 cqa-w-px cqa-bg-gray-200\"></div>\n </ng-container>\n </div>\n </div>\n\n <!-- Section 4: Metadata toggle -->\n <button *ngIf=\"metadata && (isPrerequisiteMissing || isTestDataMissing)\" type=\"button\"\n class=\"cqa-text-sm cqa-text-primary cqa-inline-flex cqa-font-inter cqa-items-center cqa-gap-[6px]\"\n (click)=\"toggleMetadata()\">\n <span>{{ metadataExpanded ? 'Hide details' : 'Show details' }}</span>\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-[14px] cqa-leading-[14px]\">\n {{ metadataExpanded ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n\n <!-- Section 5: Sections (toggle visibility) -->\n <div *ngIf=\"metadataExpanded && visibleSections?.length\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div\n *ngFor=\"let section of visibleSections\"\n class=\"cqa-border-l-4 cqa-border-[#FBBF24] cqa-rounded-[10px] cqa-overflow-hidden\"\n [ngClass]=\"getSectionBorderClass(section)\"\n >\n <div class=\"cqa-p-[10px] cqa-pl-[20px] cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Section Title with Inline Collapse Button -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <h3 [ngClass]=\"getSectionTitleClasses(section)\" class=\"\">\n {{ section.title }}\n </h3>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-inline-flex\"\n (click)=\"toggleSection(section)\"\n [attr.aria-label]=\"section.expanded !== false ? 'Collapse section' : 'Expand section'\"\n >\n <mat-icon [ngClass]=\"getSectionIconColor(section)\" class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ section.expanded !== false ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n </div>\n\n <!-- Collapsible Content: Reason and Action Button -->\n <div *ngIf=\"section.expanded !== false\" class=\"cqa-flex cqa-flex-col cqa-gap-[10px]\">\n <!-- Reason -->\n <p class=\"cqa-text-sm cqa-font-normal cqa-leading-[18px] cqa-text-neutral-600\">\n Reason: {{ section.reason }}\n </p>\n \n <!-- Action Button -->\n <div>\n <cqa-button\n variant=\"outlined\"\n (clicked)=\"onSectionAction(section.id)\"\n [customClass]=\"'cqa-py-[9px] cqa-text-[14px] cqa-leading-[17px] cqa-border-slate cqa-text-slate'\"\n >\n {{ section.actionButtonLabel }}\n </cqa-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n \n <cqa-button\n variant=\"filled\"\n (clicked)=\"onMainAction()\"\n [disabled]=\"isApplying\"\n [customClass]=\"'!cqa-w-full !cqa-text-[14px] !cqa-leading-[20px] !cqa-font-semibold'\"\n >\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.01882 0C9.12979 0.0454767 9.17718 0.15653 9.22261 0.259691C9.24539 0.319799 9.26628 0.380234 9.28657 0.44115C9.29452 0.464493 9.30246 0.487836 9.31065 0.511886C9.41613 0.826009 9.51008 1.1435 9.60457 1.46076C9.62593 1.53238 9.64739 1.60397 9.66885 1.67557C9.7781 2.04007 9.88654 2.4048 9.99438 2.76969C10.0095 2.82093 10.0247 2.87218 10.0398 2.92342C10.0826 3.0679 10.1252 3.21239 10.1677 3.35694C10.2573 3.66239 10.3495 3.96695 10.4476 4.27002C10.4561 4.29653 10.4647 4.32305 10.4735 4.35036C10.7284 5.12999 11.0896 5.82875 11.6818 6.42393C11.6965 6.4394 11.7111 6.45488 11.7262 6.47083C11.979 6.72875 12.3034 6.93541 12.6276 7.10221C12.6441 7.11085 12.6606 7.11948 12.6776 7.12838C13.6317 7.61851 14.779 7.83407 15.8124 8.12101C16.2652 8.24681 16.7166 8.37658 17.1663 8.51206C17.1979 8.52157 17.2296 8.53107 17.2612 8.54055C17.3557 8.5689 17.45 8.59774 17.5442 8.62694C17.5662 8.63358 17.5882 8.64023 17.6108 8.64707C17.7406 8.68812 17.8648 8.73658 17.9713 8.82054C18.0038 8.88837 18.0038 8.88837 17.995 8.95619C17.8913 9.05472 17.7884 9.10092 17.6516 9.14599C17.632 9.15264 17.6124 9.1593 17.5923 9.16615C17.3612 9.24366 17.127 9.31149 16.8925 9.37871C16.8444 9.39261 16.7963 9.40651 16.7482 9.42042C16.4514 9.50603 16.1542 9.5898 15.8566 9.67263C15.4646 9.78175 15.0733 9.89268 14.6823 10.0049C14.6182 10.0232 14.5541 10.0416 14.49 10.0598C14.1534 10.1557 13.8185 10.2551 13.4863 10.3642C13.4587 10.3732 13.4312 10.3822 13.4028 10.3915C12.2902 10.7616 11.4422 11.4522 10.9114 12.462C10.6253 13.0295 10.4565 13.6432 10.2843 14.2489C10.2377 14.4124 10.1882 14.5749 10.1381 14.7374C10.0988 14.8652 10.0604 14.9933 10.023 15.1216C10.0185 15.1369 10.0141 15.1522 10.0095 15.1679C9.98788 15.2419 9.96638 15.3159 9.94503 15.3899C9.89039 15.5776 9.83156 15.7637 9.77111 15.9498C9.66383 16.2804 9.5662 16.6135 9.46917 16.947C9.32288 17.4491 9.32288 17.4491 9.23993 17.6905C9.23443 17.7067 9.22893 17.7229 9.22326 17.7396C9.19298 17.8256 9.16183 17.9047 9.10453 17.9774C9.01734 17.9958 9.01734 17.9958 8.93901 18C8.84946 17.8752 8.79016 17.7542 8.74265 17.6102C8.73574 17.5897 8.72882 17.5693 8.7217 17.5483C8.63368 17.285 8.55502 17.0189 8.47634 16.7529C8.45832 16.6921 8.44022 16.6313 8.42211 16.5705C8.2872 16.1173 8.15451 15.6635 8.02202 15.2096C7.47014 12.9645 7.47014 12.9645 6.078 11.1493C6.05569 11.1319 6.03338 11.1145 6.01039 11.0966C5.09826 10.398 3.89667 10.1394 2.7963 9.83627C2.52415 9.76124 2.2521 9.68587 1.98006 9.61046C1.95628 9.60386 1.95628 9.60386 1.93201 9.59714C1.53962 9.48834 1.14735 9.37925 0.756448 9.26566C0.739911 9.26089 0.723375 9.25612 0.706338 9.25121C0.105798 9.07767 0.105798 9.07767 0.00129307 8.95619C-0.00166252 8.90108 -0.00166252 8.90108 0.0249378 8.84315C0.134167 8.7408 0.240153 8.69696 0.38432 8.65238C0.405194 8.64567 0.426068 8.63897 0.447574 8.63206C0.511506 8.61164 0.575577 8.59169 0.639702 8.57183C0.658001 8.56609 0.676301 8.56035 0.695155 8.55443C0.82457 8.51385 0.95445 8.47479 1.08452 8.43618C1.11648 8.42665 1.11648 8.42665 1.14909 8.41693C1.70454 8.25174 2.26361 8.09801 2.82252 7.94392C3.23899 7.82909 3.65476 7.71236 4.06921 7.59097C4.08825 7.58542 4.1073 7.57987 4.12692 7.57415C5.087 7.29393 6.02557 6.89632 6.64547 6.1074C6.65475 6.09569 6.66403 6.08399 6.6736 6.07194C7.36395 5.1963 7.63315 4.13145 7.93391 3.09241C8.03285 2.75069 8.13298 2.40929 8.23345 2.06798C8.26127 1.97347 8.28906 1.87894 8.31673 1.78439C8.42788 1.40458 8.5407 1.02528 8.66 0.647727C8.67116 0.612372 8.68227 0.577001 8.69333 0.541614C8.86035 0.00797522 8.86035 0.00797522 9.01882 0Z\" fill=\"#FBFCFF\"/><path d=\"M14.4719 1.11069C14.5805 1.22817 14.6022 1.36624 14.636 1.51625C14.7487 1.98751 14.8786 2.42084 15.3293 2.6946C15.6074 2.84167 15.9389 2.90859 16.247 2.9718C16.3771 2.99902 16.4869 3.03515 16.5985 3.1074C16.6236 3.14555 16.6236 3.14555 16.6221 3.21197C16.5963 3.29273 16.5736 3.31878 16.5054 3.37165C16.4308 3.39549 16.4308 3.39549 16.3413 3.41404C16.3075 3.42147 16.2736 3.42898 16.2398 3.43656C16.2217 3.44058 16.2036 3.4446 16.1849 3.44874C15.6339 3.57062 15.6339 3.57062 15.1576 3.84645C15.1421 3.85837 15.1267 3.87029 15.1107 3.88257C14.7703 4.16959 14.6983 4.64703 14.5958 5.04699C14.59 5.06896 14.5841 5.09092 14.578 5.11355C14.573 5.133 14.5679 5.15244 14.5627 5.17248C14.5405 5.23185 14.5176 5.27057 14.4719 5.31607C14.3447 5.33152 14.3447 5.33152 14.2828 5.31607C14.1843 5.24309 14.1623 5.15997 14.1366 5.04828C14.1322 5.03099 14.1279 5.01369 14.1235 4.99587C14.1098 4.94064 14.0965 4.88531 14.0833 4.82996C13.9796 4.39891 13.8625 3.976 13.449 3.72333C13.1258 3.55101 12.7329 3.46951 12.3717 3.4037C12.2727 3.38399 12.216 3.3592 12.1547 3.28121C12.1414 3.20208 12.1414 3.20208 12.1547 3.12294C12.2489 3.02971 12.348 3.00696 12.4754 2.97881C12.5156 2.9693 12.5557 2.95973 12.5958 2.9501C12.6165 2.94516 12.6372 2.94022 12.6586 2.93512C12.7642 2.90911 12.8689 2.87995 12.9734 2.85021C12.9924 2.84494 13.0114 2.83967 13.031 2.83424C13.2436 2.77346 13.4271 2.69571 13.5971 2.5577C13.6129 2.54523 13.6288 2.53276 13.6451 2.5199C13.9096 2.29228 13.9995 1.95032 14.081 1.63124C14.0873 1.60702 14.0935 1.5828 14.0999 1.55784C14.1123 1.50918 14.1244 1.46046 14.1363 1.4117C14.1449 1.37776 14.1449 1.37776 14.1535 1.34315C14.1585 1.32288 14.1635 1.30261 14.1686 1.28172C14.1904 1.21719 14.219 1.16652 14.2591 1.11069C14.3362 1.07385 14.3903 1.0905 14.4719 1.11069Z\" fill=\"#FBFCFF\"/><path d=\"M3.59089 12.4942C3.61902 12.4944 3.61902 12.4944 3.64772 12.4946C3.84954 12.5004 3.98609 12.5623 4.13472 12.692C4.30767 12.8707 4.38753 13.0722 4.38299 13.313C4.36357 13.5082 4.24316 13.6787 4.09547 13.8107C3.92163 13.9448 3.74626 13.9892 3.52411 13.983C3.33681 13.9621 3.1606 13.877 3.02785 13.749C2.86276 13.5336 2.8145 13.3361 2.83869 13.0707C2.88867 12.8618 3.03274 12.6923 3.21701 12.5733C3.34502 12.5113 3.44798 12.493 3.59089 12.4942Z\" fill=\"#FBFCFF\"/></svg>\n {{ isApplying ? 'Applying suggestion' : 'Apply suggestion' }}\n </cqa-button>\n </div>\n</div>\n \n", components: [{ type: BadgeComponent, selector: "cqa-badge", inputs: ["label", "icon", "variant", "backgroundColor", "textColor", "iconBackgroundColor", "iconColor"] }, { type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass"], outputs: ["clicked"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "keyvalue": i2.KeyValuePipe } });
|
|
2591
2635
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: InsightCardComponent, decorators: [{
|
|
2592
2636
|
type: Component,
|
|
2593
|
-
args: [{ selector: 'cqa-insight-card', template: "<div id=\"cqa-ui-root\" style=\"background-color: white; border-radius: 0.5rem; border: 1px solid #E5E7EB; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\">\n <div class=\"cqa-flex cqa-flex-col cqa-gap-4 cqa-px-[21px] cqa-py-3 cqa-border cqa-border-gray-200 cqa-rounded-2xl\">\n <!-- Section 1: Badges -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\" *ngIf=\"visibleBadges.length > 0\">\n <mat-icon *ngIf=\"isPrerequisiteMissing || isTestDataMissing\"\n class=\"cqa-text-yellow-500 cqa-w-6 cqa-h-6\">warning</mat-icon>\n <div class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n <cqa-badge \n *ngFor=\"let badge of visibleBadges\" \n [label]=\"badge.label\"\n [icon]=\"badge.icon\"\n [variant]=\"badge.variant || 'default'\"\n ></cqa-badge>\n </div>\n </div>\n\n <!-- Section 2: Title & Description -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <h2 class=\"cqa-font-medium cqa-text-lg cqa-text-title\">\n {{ title }}\n </h2>\n <p class=\"cqa-text-base cqa-font-normal cqa-text-description\">\n {{ description }}\n </p>\n </div>\n\n <!-- Section 3: Metadata Section (always visible) -->\n <div *ngIf=\"metadata\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div class=\"cqa-bg-surface-default cqa-rounded-xl cqa-border cqa-border-border-light cqa-px-4 cqa-py-3 cqa-border-t-2 cqa-border-t-primary-surface\">\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-3\">\n <ng-container *ngFor=\"let item of metadata | keyvalue; let last = last\">\n <div class=\"cqa-flex cqa-items-baseline cqa-gap-2\">\n <span class=\"cqa-text-xs cqa-font-normal cqa-tracking-normal cqa-font-inter cqa-text-metadata-key\">\n {{ item.key }}:\n </span>\n <span \n [ngClass]=\"getMetadataValueClasses(item.key, item.value)\" \n [ngStyle]=\"getMetadataValueStyle(item.key, item.value)\"\n class=\"cqa-font-normal cqa-leading-[18px] cqa-tracking-normal cqa-font-inter cqa-text-sm\">\n {{ getMetadataValue(item.value) }}\n </span>\n </div>\n <div *ngIf=\"!last\" class=\"cqa-h-4 cqa-w-px cqa-bg-gray-200\"></div>\n </ng-container>\n </div>\n </div>\n\n <!-- Section 4: Metadata toggle -->\n <button *ngIf=\"metadata && (isPrerequisiteMissing || isTestDataMissing)\" type=\"button\"\n class=\"cqa-text-sm cqa-text-primary-hover cqa-font-medium cqa-inline-flex cqa-items-center cqa-gap-1 cqa-cursor-pointer cqa-bg-transparent cqa-border-0 cqa-p-0 cqa-hover:cqa-text-primary cqa-transition-colors\"\n (click)=\"toggleMetadata()\">\n <span>{{ metadataExpanded ? 'Hide details' : 'Show details' }}</span>\n <mat-icon class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ metadataExpanded ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n\n <!-- Section 5: Sections (toggle visibility) -->\n <div *ngIf=\"metadataExpanded && visibleSections?.length\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div\n *ngFor=\"let section of visibleSections\"\n class=\"cqa-border cqa-border-gray-200 cqa-rounded-md cqa-bg-white cqa-overflow-hidden\"\n [ngClass]=\"getSectionBorderClass(section)\"\n >\n <div class=\"cqa-p-4 cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Section Title with Inline Collapse Button -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <h3 [ngClass]=\"getSectionTitleClasses(section)\" class=\"cqa-m-0\">\n {{ section.title }}\n </h3>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-inline-flex cqa-items-center cqa-justify-center cqa-cursor-pointer cqa-bg-transparent cqa-border-0 cqa-p-1 cqa-rounded-full cqa-hover:cqa-bg-gray-100 cqa-transition-colors\"\n (click)=\"toggleSection(section)\"\n [attr.aria-label]=\"section.expanded !== false ? 'Collapse section' : 'Expand section'\"\n >\n <mat-icon [ngClass]=\"getSectionIconColor(section)\" class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ section.expanded !== false ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n </div>\n\n <!-- Collapsible Content: Reason and Action Button -->\n <div *ngIf=\"section.expanded !== false\" class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Reason -->\n <p class=\"cqa-text-sm cqa-font-normal cqa-leading-4 cqa-text-neutral-600\">\n <strong>Reason:</strong> {{ section.reason }}\n </p>\n \n <!-- Action Button -->\n <div>\n <cqa-button\n variant=\"outlined\"\n (clicked)=\"onSectionAction(section.id)\"\n >\n {{ section.actionButtonLabel }}\n </cqa-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n \n <cqa-button\n variant=\"filled\"\n [icon]=\"isApplying ? 'hourglass_empty' : 'auto_awesome'\"\n iconPosition=\"start\"\n (clicked)=\"onMainAction()\"\n [fullWidth]=\"true\"\n [disabled]=\"isApplying\"\n [iconColor]=\"isApplying ? '#EAB308' : undefined\"\n >\n {{ isApplying ? 'Applying suggestion' : 'Apply suggestion' }}\n </cqa-button>\n </div>\n</div>\n \n", styles: [] }]
|
|
2637
|
+
args: [{ selector: 'cqa-insight-card', template: "<div id=\"cqa-ui-root\">\n <div class=\"cqa-font-inter cqa-flex cqa-flex-col cqa-gap-4 cqa-px-[21px] cqa-py-3 cqa-border cqa-border-[#ECECEC] cqa-rounded-xl cqa-shadow-card\">\n <!-- Section 1: Badges -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-3 cqapy-[1.5]\" *ngIf=\"visibleBadges.length > 0\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M14.4866 12.0005L9.15329 2.66714C9.037 2.46194 8.86836 2.29127 8.66457 2.17252C8.46078 2.05378 8.22915 1.99121 7.99329 1.99121C7.75743 1.99121 7.52579 2.05378 7.322 2.17252C7.11822 2.29127 6.94958 2.46194 6.83329 2.66714L1.49995 12.0005C1.38241 12.204 1.32077 12.4351 1.32129 12.6701C1.32181 12.9052 1.38447 13.136 1.50292 13.339C1.62136 13.5421 1.79138 13.7102 1.99575 13.8264C2.20011 13.9425 2.43156 14.0026 2.66662 14.0005H13.3333C13.5672 14.0002 13.797 13.9385 13.9995 13.8213C14.202 13.7042 14.3701 13.5359 14.487 13.3332C14.6038 13.1306 14.6653 12.9007 14.6653 12.6668C14.6652 12.4329 14.6036 12.2031 14.4866 12.0005Z\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M8 6V8.66667\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M8 11.333H8.00667\" stroke=\"#E2AC20\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>\n <div class=\"cqa-flex cqa-flex-wrap cqa-gap-2\">\n <cqa-badge \n *ngFor=\"let badge of visibleBadges\" \n [label]=\"badge.label\"\n [icon]=\"badge.icon\"\n [variant]=\"badge.variant || 'default'\"\n ></cqa-badge>\n </div>\n </div>\n\n <!-- Section 2: Title & Description -->\n <div class=\"cqa-flex cqa-flex-col cqa-gap-3\">\n <h2 class=\"cqa-font-medium cqa-text-lg cqa-leading-[22px] cqa-text-title\">\n {{ title }}\n </h2>\n <p class=\"cqa-text-base cqa-font-normal cqa-text-description\">\n {{ description }}\n </p>\n </div>\n\n <!-- Section 3: Metadata Section (always visible) -->\n <div *ngIf=\"metadata\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div class=\"cqa-bg-surface-default cqa-rounded-[10px] cqa-px-4 cqa-py-3 cqa-border-t cqa-border-t-primary-surface\">\n <div class=\"cqa-flex cqa-flex-wrap cqa-items-center cqa-gap-[25px]\">\n <ng-container *ngFor=\"let item of metadata | keyvalue; let last = last\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-[6px]\">\n <span class=\"cqa-text-xs cqa-font-normal cqa-font-inter cqa-text-metadata-key\">\n {{ item.key }}:\n </span>\n <span \n [ngClass]=\"getMetadataValueClasses(item.key, item.value)\" \n [ngStyle]=\"getMetadataValueStyle(item.key, item.value)\"\n class=\"cqa-font-normal cqa-leading-[18px] cqa-font-inter cqa-text-sm cqa-text-title\">\n {{ getMetadataValue(item.value) }}\n </span>\n </div>\n <div *ngIf=\"!last\" class=\"cqa-h-4 cqa-w-px cqa-bg-gray-200\"></div>\n </ng-container>\n </div>\n </div>\n\n <!-- Section 4: Metadata toggle -->\n <button *ngIf=\"metadata && (isPrerequisiteMissing || isTestDataMissing)\" type=\"button\"\n class=\"cqa-text-sm cqa-text-primary cqa-inline-flex cqa-font-inter cqa-items-center cqa-gap-[6px]\"\n (click)=\"toggleMetadata()\">\n <span>{{ metadataExpanded ? 'Hide details' : 'Show details' }}</span>\n <mat-icon class=\"cqa-w-[14px] cqa-h-[14px] cqa-text-[14px] cqa-leading-[14px]\">\n {{ metadataExpanded ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n\n <!-- Section 5: Sections (toggle visibility) -->\n <div *ngIf=\"metadataExpanded && visibleSections?.length\" class=\"cqa-flex cqa-flex-col cqa-gap-4\">\n <div\n *ngFor=\"let section of visibleSections\"\n class=\"cqa-border-l-4 cqa-border-[#FBBF24] cqa-rounded-[10px] cqa-overflow-hidden\"\n [ngClass]=\"getSectionBorderClass(section)\"\n >\n <div class=\"cqa-p-[10px] cqa-pl-[20px] cqa-flex cqa-flex-col cqa-gap-3\">\n <!-- Section Title with Inline Collapse Button -->\n <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n <h3 [ngClass]=\"getSectionTitleClasses(section)\" class=\"\">\n {{ section.title }}\n </h3>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-inline-flex\"\n (click)=\"toggleSection(section)\"\n [attr.aria-label]=\"section.expanded !== false ? 'Collapse section' : 'Expand section'\"\n >\n <mat-icon [ngClass]=\"getSectionIconColor(section)\" class=\"cqa-w-4 cqa-h-4 cqa-text-[16px] cqa-leading-[16px]\">\n {{ section.expanded !== false ? 'expand_less' : 'expand_more' }}\n </mat-icon>\n </button>\n </div>\n\n <!-- Collapsible Content: Reason and Action Button -->\n <div *ngIf=\"section.expanded !== false\" class=\"cqa-flex cqa-flex-col cqa-gap-[10px]\">\n <!-- Reason -->\n <p class=\"cqa-text-sm cqa-font-normal cqa-leading-[18px] cqa-text-neutral-600\">\n Reason: {{ section.reason }}\n </p>\n \n <!-- Action Button -->\n <div>\n <cqa-button\n variant=\"outlined\"\n (clicked)=\"onSectionAction(section.id)\"\n [customClass]=\"'cqa-py-[9px] cqa-text-[14px] cqa-leading-[17px] cqa-border-slate cqa-text-slate'\"\n >\n {{ section.actionButtonLabel }}\n </cqa-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n \n <cqa-button\n variant=\"filled\"\n (clicked)=\"onMainAction()\"\n [disabled]=\"isApplying\"\n [customClass]=\"'!cqa-w-full !cqa-text-[14px] !cqa-leading-[20px] !cqa-font-semibold'\"\n >\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.01882 0C9.12979 0.0454767 9.17718 0.15653 9.22261 0.259691C9.24539 0.319799 9.26628 0.380234 9.28657 0.44115C9.29452 0.464493 9.30246 0.487836 9.31065 0.511886C9.41613 0.826009 9.51008 1.1435 9.60457 1.46076C9.62593 1.53238 9.64739 1.60397 9.66885 1.67557C9.7781 2.04007 9.88654 2.4048 9.99438 2.76969C10.0095 2.82093 10.0247 2.87218 10.0398 2.92342C10.0826 3.0679 10.1252 3.21239 10.1677 3.35694C10.2573 3.66239 10.3495 3.96695 10.4476 4.27002C10.4561 4.29653 10.4647 4.32305 10.4735 4.35036C10.7284 5.12999 11.0896 5.82875 11.6818 6.42393C11.6965 6.4394 11.7111 6.45488 11.7262 6.47083C11.979 6.72875 12.3034 6.93541 12.6276 7.10221C12.6441 7.11085 12.6606 7.11948 12.6776 7.12838C13.6317 7.61851 14.779 7.83407 15.8124 8.12101C16.2652 8.24681 16.7166 8.37658 17.1663 8.51206C17.1979 8.52157 17.2296 8.53107 17.2612 8.54055C17.3557 8.5689 17.45 8.59774 17.5442 8.62694C17.5662 8.63358 17.5882 8.64023 17.6108 8.64707C17.7406 8.68812 17.8648 8.73658 17.9713 8.82054C18.0038 8.88837 18.0038 8.88837 17.995 8.95619C17.8913 9.05472 17.7884 9.10092 17.6516 9.14599C17.632 9.15264 17.6124 9.1593 17.5923 9.16615C17.3612 9.24366 17.127 9.31149 16.8925 9.37871C16.8444 9.39261 16.7963 9.40651 16.7482 9.42042C16.4514 9.50603 16.1542 9.5898 15.8566 9.67263C15.4646 9.78175 15.0733 9.89268 14.6823 10.0049C14.6182 10.0232 14.5541 10.0416 14.49 10.0598C14.1534 10.1557 13.8185 10.2551 13.4863 10.3642C13.4587 10.3732 13.4312 10.3822 13.4028 10.3915C12.2902 10.7616 11.4422 11.4522 10.9114 12.462C10.6253 13.0295 10.4565 13.6432 10.2843 14.2489C10.2377 14.4124 10.1882 14.5749 10.1381 14.7374C10.0988 14.8652 10.0604 14.9933 10.023 15.1216C10.0185 15.1369 10.0141 15.1522 10.0095 15.1679C9.98788 15.2419 9.96638 15.3159 9.94503 15.3899C9.89039 15.5776 9.83156 15.7637 9.77111 15.9498C9.66383 16.2804 9.5662 16.6135 9.46917 16.947C9.32288 17.4491 9.32288 17.4491 9.23993 17.6905C9.23443 17.7067 9.22893 17.7229 9.22326 17.7396C9.19298 17.8256 9.16183 17.9047 9.10453 17.9774C9.01734 17.9958 9.01734 17.9958 8.93901 18C8.84946 17.8752 8.79016 17.7542 8.74265 17.6102C8.73574 17.5897 8.72882 17.5693 8.7217 17.5483C8.63368 17.285 8.55502 17.0189 8.47634 16.7529C8.45832 16.6921 8.44022 16.6313 8.42211 16.5705C8.2872 16.1173 8.15451 15.6635 8.02202 15.2096C7.47014 12.9645 7.47014 12.9645 6.078 11.1493C6.05569 11.1319 6.03338 11.1145 6.01039 11.0966C5.09826 10.398 3.89667 10.1394 2.7963 9.83627C2.52415 9.76124 2.2521 9.68587 1.98006 9.61046C1.95628 9.60386 1.95628 9.60386 1.93201 9.59714C1.53962 9.48834 1.14735 9.37925 0.756448 9.26566C0.739911 9.26089 0.723375 9.25612 0.706338 9.25121C0.105798 9.07767 0.105798 9.07767 0.00129307 8.95619C-0.00166252 8.90108 -0.00166252 8.90108 0.0249378 8.84315C0.134167 8.7408 0.240153 8.69696 0.38432 8.65238C0.405194 8.64567 0.426068 8.63897 0.447574 8.63206C0.511506 8.61164 0.575577 8.59169 0.639702 8.57183C0.658001 8.56609 0.676301 8.56035 0.695155 8.55443C0.82457 8.51385 0.95445 8.47479 1.08452 8.43618C1.11648 8.42665 1.11648 8.42665 1.14909 8.41693C1.70454 8.25174 2.26361 8.09801 2.82252 7.94392C3.23899 7.82909 3.65476 7.71236 4.06921 7.59097C4.08825 7.58542 4.1073 7.57987 4.12692 7.57415C5.087 7.29393 6.02557 6.89632 6.64547 6.1074C6.65475 6.09569 6.66403 6.08399 6.6736 6.07194C7.36395 5.1963 7.63315 4.13145 7.93391 3.09241C8.03285 2.75069 8.13298 2.40929 8.23345 2.06798C8.26127 1.97347 8.28906 1.87894 8.31673 1.78439C8.42788 1.40458 8.5407 1.02528 8.66 0.647727C8.67116 0.612372 8.68227 0.577001 8.69333 0.541614C8.86035 0.00797522 8.86035 0.00797522 9.01882 0Z\" fill=\"#FBFCFF\"/><path d=\"M14.4719 1.11069C14.5805 1.22817 14.6022 1.36624 14.636 1.51625C14.7487 1.98751 14.8786 2.42084 15.3293 2.6946C15.6074 2.84167 15.9389 2.90859 16.247 2.9718C16.3771 2.99902 16.4869 3.03515 16.5985 3.1074C16.6236 3.14555 16.6236 3.14555 16.6221 3.21197C16.5963 3.29273 16.5736 3.31878 16.5054 3.37165C16.4308 3.39549 16.4308 3.39549 16.3413 3.41404C16.3075 3.42147 16.2736 3.42898 16.2398 3.43656C16.2217 3.44058 16.2036 3.4446 16.1849 3.44874C15.6339 3.57062 15.6339 3.57062 15.1576 3.84645C15.1421 3.85837 15.1267 3.87029 15.1107 3.88257C14.7703 4.16959 14.6983 4.64703 14.5958 5.04699C14.59 5.06896 14.5841 5.09092 14.578 5.11355C14.573 5.133 14.5679 5.15244 14.5627 5.17248C14.5405 5.23185 14.5176 5.27057 14.4719 5.31607C14.3447 5.33152 14.3447 5.33152 14.2828 5.31607C14.1843 5.24309 14.1623 5.15997 14.1366 5.04828C14.1322 5.03099 14.1279 5.01369 14.1235 4.99587C14.1098 4.94064 14.0965 4.88531 14.0833 4.82996C13.9796 4.39891 13.8625 3.976 13.449 3.72333C13.1258 3.55101 12.7329 3.46951 12.3717 3.4037C12.2727 3.38399 12.216 3.3592 12.1547 3.28121C12.1414 3.20208 12.1414 3.20208 12.1547 3.12294C12.2489 3.02971 12.348 3.00696 12.4754 2.97881C12.5156 2.9693 12.5557 2.95973 12.5958 2.9501C12.6165 2.94516 12.6372 2.94022 12.6586 2.93512C12.7642 2.90911 12.8689 2.87995 12.9734 2.85021C12.9924 2.84494 13.0114 2.83967 13.031 2.83424C13.2436 2.77346 13.4271 2.69571 13.5971 2.5577C13.6129 2.54523 13.6288 2.53276 13.6451 2.5199C13.9096 2.29228 13.9995 1.95032 14.081 1.63124C14.0873 1.60702 14.0935 1.5828 14.0999 1.55784C14.1123 1.50918 14.1244 1.46046 14.1363 1.4117C14.1449 1.37776 14.1449 1.37776 14.1535 1.34315C14.1585 1.32288 14.1635 1.30261 14.1686 1.28172C14.1904 1.21719 14.219 1.16652 14.2591 1.11069C14.3362 1.07385 14.3903 1.0905 14.4719 1.11069Z\" fill=\"#FBFCFF\"/><path d=\"M3.59089 12.4942C3.61902 12.4944 3.61902 12.4944 3.64772 12.4946C3.84954 12.5004 3.98609 12.5623 4.13472 12.692C4.30767 12.8707 4.38753 13.0722 4.38299 13.313C4.36357 13.5082 4.24316 13.6787 4.09547 13.8107C3.92163 13.9448 3.74626 13.9892 3.52411 13.983C3.33681 13.9621 3.1606 13.877 3.02785 13.749C2.86276 13.5336 2.8145 13.3361 2.83869 13.0707C2.88867 12.8618 3.03274 12.6923 3.21701 12.5733C3.34502 12.5113 3.44798 12.493 3.59089 12.4942Z\" fill=\"#FBFCFF\"/></svg>\n {{ isApplying ? 'Applying suggestion' : 'Apply suggestion' }}\n </cqa-button>\n </div>\n</div>\n \n", styles: [] }]
|
|
2594
2638
|
}], propDecorators: { title: [{
|
|
2595
2639
|
type: Input
|
|
2596
2640
|
}], description: [{
|