@cqa-lib/cqa-ui 1.1.122 → 1.1.124

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

@@ -11836,6 +11836,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                 type: Output
             }] } });
 
+class ErrorModalComponent {
+    constructor() {
+        this.isOpen = false;
+        this.title = 'Error';
+        this.errorMessage = '';
+        this.totalSteps = 0;
+        this.completedSteps = 0;
+        this.totalTime = '';
+        this.appTime = '';
+        this.toolTime = '';
+        this.buttons = [];
+        this.buttonClick = new EventEmitter();
+        this.closeModal = new EventEmitter();
+    }
+    onBackdropClick(event) {
+        const target = event.target;
+        const currentTarget = event.currentTarget;
+        if (target === currentTarget || target.classList.contains('modal-backdrop')) {
+            this.onClose();
+        }
+    }
+    onButtonClick(button) {
+        this.buttonClick.emit(button.action);
+    }
+    onClose() {
+        this.closeModal.emit();
+    }
+    get stepsBackgroundClass() {
+        return 'cqa-bg-[#EE3F3F1A]';
+    }
+    get stepsBorderClass() {
+        return '#FECACA';
+    }
+    get hasTimingData() {
+        return !!(this.totalSteps || this.totalTime || this.appTime || this.toolTime);
+    }
+    getNonTextButtons() {
+        return this.buttons.filter(button => button.variant !== 'text');
+    }
+    getTextButtons() {
+        return this.buttons.filter(button => button.variant === 'text');
+    }
+}
+ErrorModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ErrorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ErrorModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ErrorModalComponent, selector: "cqa-error-modal", inputs: { isOpen: "isOpen", title: "title", instructionalMessage: "instructionalMessage", errorMessage: "errorMessage", totalSteps: "totalSteps", completedSteps: "completedSteps", totalTime: "totalTime", appTime: "appTime", toolTime: "toolTime", buttons: "buttons" }, outputs: { buttonClick: "buttonClick", closeModal: "closeModal" }, ngImport: i0, template: "<div *ngIf=\"isOpen\"\n  class=\"modal-backdrop cqa-fixed cqa-inset-0 cqa-bg-black cqa-bg-opacity-50 cqa-z-50 cqa-flex cqa-items-center cqa-justify-center cqa-p-4\"\n  (click)=\"onBackdropClick($event)\">\n  <div\n    class=\"cqa-rounded-lg cqa-bg-white cqa-shadow-xl cqa-w-full cqa-max-w-[500px] cqa-overflow-hidden cqa-p-6 cqa-flex cqa-flex-col cqa-gap-2\"\n    style=\"box-shadow: 0px 8px 8px -4px #10182808;\" (click)=\"$event.stopPropagation()\">\n\n    <div class=\"cqa-flex cqa-flex-col cqa-items-center\">\n      <div>\n        <svg width=\"93\" height=\"93\" viewBox=\"0 0 93 93\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <rect x=\"4\" y=\"4\" width=\"85\" height=\"85\" rx=\"42.5\" fill=\"#F15F5F\"/>\n          <rect x=\"4\" y=\"4\" width=\"85\" height=\"85\" rx=\"42.5\" stroke=\"#FCD9D9\" stroke-width=\"8\"/>\n          <path d=\"M32.3815 62.4437H60.619C63.5065 62.4437 65.3065 59.3125 63.8627 56.8188L49.744 32.425C48.3002 29.9313 44.7002 29.9313 43.2565 32.425L29.1377 56.8188C27.694 59.3125 29.494 62.4437 32.3815 62.4437ZM46.5002 49.3188C45.469 49.3188 44.6252 48.475 44.6252 47.4438V43.6938C44.6252 42.6625 45.469 41.8188 46.5002 41.8188C47.5315 41.8188 48.3752 42.6625 48.3752 43.6938V47.4438C48.3752 48.475 47.5315 49.3188 46.5002 49.3188ZM48.3752 56.8188H44.6252V53.0688H48.3752V56.8188Z\" fill=\"white\"/>\n          </svg>\n      </div>\n\n      <h2 class=\"cqa-text-[22px] cqa-font-semibold cqa-text-[#0B0B0C] cqa-mt-[20px] cqa-leading-[28px]\">\n        {{ title }}\n      </h2>\n\n      <!-- Instructional Message -->\n      <p *ngIf=\"instructionalMessage\" class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mt-2 cqa-text-center\">\n        {{ instructionalMessage }}\n      </p>\n    </div>\n\n    <!-- <div *ngIf=\"hasTimingData\" class=\"cqa-rounded-lg cqa-border cqa-p-[17px] cqa-my-4\" [ngClass]=\"stepsBackgroundClass\"\n      style=\"border: 1px solid;\" [style.border-color]=\"stepsBorderClass\">\n      <div\n        class=\"cqa-grid sm:cqa-flex sm:cqa-justify-between sm:cqa-items-center cqa-grid-cols-2 sm:cqa-grid-cols-4 cqa-gap-4 sm:cqa-gap-2\">\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"totalSteps\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Total Steps</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ completedSteps }} / {{ totalSteps }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"totalTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Total Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ totalTime }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"appTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">App Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ appTime }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"toolTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Tool Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ toolTime }}\n          </span>\n        </div>\n      </div>\n    </div> -->\n\n    <!-- Error Message Section -->\n    <div *ngIf=\"errorMessage\" class=\"cqa-my-4 cqa-p-4 cqa-rounded-lg cqa-bg-white\"\n      style=\"border: 1px solid #E5E7EB;\">\n      <div class=\"cqa-text-xs cqa-text-[#9CA3AF] cqa-mb-2 cqa-font-medium\">\n        Error Message\n      </div>\n      <div class=\"cqa-text-sm cqa-text-[#111827] cqa-font-semibold cqa-whitespace-normal cqa-break-anywhere\"\n        style=\"word-break: break-word; white-space: pre-line;\">\n        {{ errorMessage }}\n      </div>\n    </div>\n\n    <!-- Buttons -->\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-[20px]\">\n      <ng-container *ngFor=\"let button of buttons; let i = index\">\n        <cqa-button\n          [variant]=\"button.variant\"\n          [text]=\"button.label\"\n          [icon]=\"button.icon\"\n          [btnSize]=\"button.btnSize || 'lg'\"\n          [fullWidth]=\"button.fullWidth !== undefined ? button.fullWidth : true\"\n          (clicked)=\"onButtonClick(button)\">\n        </cqa-button>\n      </ng-container>\n    </div>\n  </div>\n</div>", components: [{ type: ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ErrorModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cqa-error-modal', template: "<div *ngIf=\"isOpen\"\n  class=\"modal-backdrop cqa-fixed cqa-inset-0 cqa-bg-black cqa-bg-opacity-50 cqa-z-50 cqa-flex cqa-items-center cqa-justify-center cqa-p-4\"\n  (click)=\"onBackdropClick($event)\">\n  <div\n    class=\"cqa-rounded-lg cqa-bg-white cqa-shadow-xl cqa-w-full cqa-max-w-[500px] cqa-overflow-hidden cqa-p-6 cqa-flex cqa-flex-col cqa-gap-2\"\n    style=\"box-shadow: 0px 8px 8px -4px #10182808;\" (click)=\"$event.stopPropagation()\">\n\n    <div class=\"cqa-flex cqa-flex-col cqa-items-center\">\n      <div>\n        <svg width=\"93\" height=\"93\" viewBox=\"0 0 93 93\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <rect x=\"4\" y=\"4\" width=\"85\" height=\"85\" rx=\"42.5\" fill=\"#F15F5F\"/>\n          <rect x=\"4\" y=\"4\" width=\"85\" height=\"85\" rx=\"42.5\" stroke=\"#FCD9D9\" stroke-width=\"8\"/>\n          <path d=\"M32.3815 62.4437H60.619C63.5065 62.4437 65.3065 59.3125 63.8627 56.8188L49.744 32.425C48.3002 29.9313 44.7002 29.9313 43.2565 32.425L29.1377 56.8188C27.694 59.3125 29.494 62.4437 32.3815 62.4437ZM46.5002 49.3188C45.469 49.3188 44.6252 48.475 44.6252 47.4438V43.6938C44.6252 42.6625 45.469 41.8188 46.5002 41.8188C47.5315 41.8188 48.3752 42.6625 48.3752 43.6938V47.4438C48.3752 48.475 47.5315 49.3188 46.5002 49.3188ZM48.3752 56.8188H44.6252V53.0688H48.3752V56.8188Z\" fill=\"white\"/>\n          </svg>\n      </div>\n\n      <h2 class=\"cqa-text-[22px] cqa-font-semibold cqa-text-[#0B0B0C] cqa-mt-[20px] cqa-leading-[28px]\">\n        {{ title }}\n      </h2>\n\n      <!-- Instructional Message -->\n      <p *ngIf=\"instructionalMessage\" class=\"cqa-text-sm cqa-text-[#4A5565] cqa-mt-2 cqa-text-center\">\n        {{ instructionalMessage }}\n      </p>\n    </div>\n\n    <!-- <div *ngIf=\"hasTimingData\" class=\"cqa-rounded-lg cqa-border cqa-p-[17px] cqa-my-4\" [ngClass]=\"stepsBackgroundClass\"\n      style=\"border: 1px solid;\" [style.border-color]=\"stepsBorderClass\">\n      <div\n        class=\"cqa-grid sm:cqa-flex sm:cqa-justify-between sm:cqa-items-center cqa-grid-cols-2 sm:cqa-grid-cols-4 cqa-gap-4 sm:cqa-gap-2\">\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"totalSteps\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Total Steps</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ completedSteps }} / {{ totalSteps }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"totalTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Total Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ totalTime }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"appTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">App Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ appTime }}\n          </span>\n        </div>\n\n        <div class=\"cqa-flex cqa-flex-col\" *ngIf=\"toolTime\">\n          <span class=\"cqa-text-xs cqa-text-[#4A5565] cqa-mb-1\">Tool Time</span>\n          <span class=\"cqa-text-[18px] cqa-font-medium cqa-text-[#101828]\">\n            {{ toolTime }}\n          </span>\n        </div>\n      </div>\n    </div> -->\n\n    <!-- Error Message Section -->\n    <div *ngIf=\"errorMessage\" class=\"cqa-my-4 cqa-p-4 cqa-rounded-lg cqa-bg-white\"\n      style=\"border: 1px solid #E5E7EB;\">\n      <div class=\"cqa-text-xs cqa-text-[#9CA3AF] cqa-mb-2 cqa-font-medium\">\n        Error Message\n      </div>\n      <div class=\"cqa-text-sm cqa-text-[#111827] cqa-font-semibold cqa-whitespace-normal cqa-break-anywhere\"\n        style=\"word-break: break-word; white-space: pre-line;\">\n        {{ errorMessage }}\n      </div>\n    </div>\n\n    <!-- Buttons -->\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-[20px]\">\n      <ng-container *ngFor=\"let button of buttons; let i = index\">\n        <cqa-button\n          [variant]=\"button.variant\"\n          [text]=\"button.label\"\n          [icon]=\"button.icon\"\n          [btnSize]=\"button.btnSize || 'lg'\"\n          [fullWidth]=\"button.fullWidth !== undefined ? button.fullWidth : true\"\n          (clicked)=\"onButtonClick(button)\">\n        </cqa-button>\n      </ng-container>\n    </div>\n  </div>\n</div>", styles: [] }]
+        }], propDecorators: { isOpen: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], instructionalMessage: [{
+                type: Input
+            }], errorMessage: [{
+                type: Input
+            }], totalSteps: [{
+                type: Input
+            }], completedSteps: [{
+                type: Input
+            }], totalTime: [{
+                type: Input
+            }], appTime: [{
+                type: Input
+            }], toolTime: [{
+                type: Input
+            }], buttons: [{
+                type: Input
+            }], buttonClick: [{
+                type: Output
+            }], closeModal: [{
+                type: Output
+            }] } });
+
 class ProgressIndicatorComponent {
     constructor() {
         this.variant = 'progress';
@@ -12723,6 +12797,7 @@ UiKitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
         CustomTextareaComponent,
         AiReasoningComponent,
         ExecutionResultModalComponent,
+        ErrorModalComponent,
         ProgressIndicatorComponent,
         StepProgressCardComponent,
         StepStatusCardComponent,
@@ -12808,6 +12883,7 @@ UiKitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
         CustomTextareaComponent,
         AiReasoningComponent,
         ExecutionResultModalComponent,
+        ErrorModalComponent,
         ProgressIndicatorComponent,
         StepProgressCardComponent,
         StepStatusCardComponent,
@@ -12921,6 +12997,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                         CustomTextareaComponent,
                         AiReasoningComponent,
                         ExecutionResultModalComponent,
+                        ErrorModalComponent,
                         ProgressIndicatorComponent,
                         StepProgressCardComponent,
                         StepStatusCardComponent,
@@ -13012,6 +13089,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                         CustomTextareaComponent,
                         AiReasoningComponent,
                         ExecutionResultModalComponent,
+                        ErrorModalComponent,
                         ProgressIndicatorComponent,
                         StepProgressCardComponent,
                         StepStatusCardComponent,
@@ -13176,5 +13254,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AIAgentStepComponent, ActionMenuButtonComponent, AiDebugAlertComponent, AiReasoningComponent, ApiStepComponent, BadgeComponent, BasicStepComponent, ButtonComponent, ChartCardComponent, ColumnVisibilityComponent, CompareRunsComponent, ConditionStepComponent, ConfigurationCardComponent, ConsoleAlertComponent, CoverageModuleCardComponent, CustomInputComponent, CustomTextareaComponent, DEFAULT_METADATA_COLOR, DIALOG_DATA, DIALOG_REF, DashboardHeaderComponent, DaterangepickerComponent, DaterangepickerDirective, DbQueryExecutionItemComponent, DbVerificationStepComponent, DialogComponent, DialogRef, DialogService, DocumentVerificationStepComponent, DropdownButtonComponent, DynamicCellContainerDirective, DynamicCellTemplateDirective, DynamicFilterComponent, DynamicHeaderTemplateDirective, DynamicSelectFieldComponent, DynamicTableComponent, EMPTY_STATE_IMAGES, EMPTY_STATE_PRESETS, EmptyStateComponent, ExecutionResultModalComponent, FailedStepCardComponent, FailedStepComponent, FailedTestCasesCardComponent, FileDownloadStepComponent, FullTableLoaderComponent, HeatErrorMapCellComponent, InsightCardComponent, IterationsLoopComponent, LiveConversationComponent, LiveExecutionStepComponent, LoopStepComponent, MainStepCollapseComponent, MetricsCardComponent, NetworkRequestComponent, OtherButtonComponent, PRIORITY_COLORS, PaginationComponent, ProgressIndicatorComponent, ProgressTextCardComponent, RESULT_COLORS, RunHistoryCardComponent, STATUS_COLORS, SearchBarComponent, SegmentControlComponent, SelectedFiltersComponent, SelfHealAnalysisComponent, SimulatorComponent, StepGroupComponent, StepProgressCardComponent, StepRendererComponent, StepStatusCardComponent, TableActionToolbarComponent, TableDataLoaderComponent, TableTemplateComponent, TailwindOverlayContainer, TestDistributionCardComponent, UiKitModule, UpdatedFailedStepComponent, ViewMoreFailedStepButtonComponent, VisualComparisonComponent, VisualDifferenceModalComponent, getEmptyStatePreset, getMetadataColor, getMetadataValueStyle };
+export { AIAgentStepComponent, ActionMenuButtonComponent, AiDebugAlertComponent, AiReasoningComponent, ApiStepComponent, BadgeComponent, BasicStepComponent, ButtonComponent, ChartCardComponent, ColumnVisibilityComponent, CompareRunsComponent, ConditionStepComponent, ConfigurationCardComponent, ConsoleAlertComponent, CoverageModuleCardComponent, CustomInputComponent, CustomTextareaComponent, DEFAULT_METADATA_COLOR, DIALOG_DATA, DIALOG_REF, DashboardHeaderComponent, DaterangepickerComponent, DaterangepickerDirective, DbQueryExecutionItemComponent, DbVerificationStepComponent, DialogComponent, DialogRef, DialogService, DocumentVerificationStepComponent, DropdownButtonComponent, DynamicCellContainerDirective, DynamicCellTemplateDirective, DynamicFilterComponent, DynamicHeaderTemplateDirective, DynamicSelectFieldComponent, DynamicTableComponent, EMPTY_STATE_IMAGES, EMPTY_STATE_PRESETS, EmptyStateComponent, ErrorModalComponent, ExecutionResultModalComponent, FailedStepCardComponent, FailedStepComponent, FailedTestCasesCardComponent, FileDownloadStepComponent, FullTableLoaderComponent, HeatErrorMapCellComponent, InsightCardComponent, IterationsLoopComponent, LiveConversationComponent, LiveExecutionStepComponent, LoopStepComponent, MainStepCollapseComponent, MetricsCardComponent, NetworkRequestComponent, OtherButtonComponent, PRIORITY_COLORS, PaginationComponent, ProgressIndicatorComponent, ProgressTextCardComponent, RESULT_COLORS, RunHistoryCardComponent, STATUS_COLORS, SearchBarComponent, SegmentControlComponent, SelectedFiltersComponent, SelfHealAnalysisComponent, SimulatorComponent, StepGroupComponent, StepProgressCardComponent, StepRendererComponent, StepStatusCardComponent, TableActionToolbarComponent, TableDataLoaderComponent, TableTemplateComponent, TailwindOverlayContainer, TestDistributionCardComponent, UiKitModule, UpdatedFailedStepComponent, ViewMoreFailedStepButtonComponent, VisualComparisonComponent, VisualDifferenceModalComponent, getEmptyStatePreset, getMetadataColor, getMetadataValueStyle };
 //# sourceMappingURL=cqa-lib-cqa-ui.mjs.map