@cqa-lib/cqa-ui 1.1.180 → 1.1.182

package/esm2020/lib/step-builder/step-builder-ai-agent/step-builder-ai-agent.component.mjs

@@ -0,0 +1,136 @@
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { Validators } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "../../custom-textarea/custom-textarea.component";
+import * as i3 from "../../dynamic-select/dynamic-select-field.component";
+import * as i4 from "../../custom-input/custom-input.component";
+import * as i5 from "@angular/material/icon";
+import * as i6 from "../../custom-toggle/custom-toggle.component";
+import * as i7 from "../../button/button.component";
+import * as i8 from "@angular/common";
+export class StepBuilderAiAgentComponent {
+    constructor(fb) {
+        this.fb = fb;
+        /** Options for type dropdown */
+        this.typeOptions = [];
+        /** Options for environments dropdown */
+        this.environmentOptions = [];
+        /** Options for retry count dropdown */
+        this.retryCountOptions = [];
+        /** Options for iframe locator dropdown */
+        this.iframeLocatorOptions = [];
+        /** Options for other locators dropdown */
+        this.otherLocatorsOptions = [];
+        /** Emit when step is created */
+        this.createStep = new EventEmitter();
+        /** Emit when cancelled */
+        this.cancelled = new EventEmitter();
+        this.showAdvanced = false;
+        this.aiAgentForm = this.fb.group({
+            query: ['', Validators.required],
+            type: ['', Validators.required],
+            environments: ['', Validators.required],
+            metadata: [''],
+            description: [''],
+            continueOnError: [false],
+            disabled: [false],
+            retryCount: [''],
+            iframeLocator: [''],
+            otherLocators: ['']
+        });
+    }
+    ngOnInit() {
+        // Component initialization
+    }
+    getTypeConfig() {
+        return {
+            key: 'type',
+            placeholder: 'Select type',
+            multiple: false,
+            searchable: false,
+            options: this.typeOptions
+        };
+    }
+    getEnvironmentConfig() {
+        return {
+            key: 'environments',
+            placeholder: 'Select environment',
+            multiple: false,
+            searchable: false,
+            options: this.environmentOptions
+        };
+    }
+    getRetryCountConfig() {
+        return {
+            key: 'retryCount',
+            placeholder: 'Dynamic search selector from library or manual',
+            multiple: false,
+            searchable: true,
+            options: this.retryCountOptions
+        };
+    }
+    getIframeLocatorConfig() {
+        return {
+            key: 'iframeLocator',
+            placeholder: 'Dynamic search selector from library or manual',
+            multiple: false,
+            searchable: true,
+            options: this.iframeLocatorOptions
+        };
+    }
+    getOtherLocatorsConfig() {
+        return {
+            key: 'otherLocators',
+            placeholder: 'Dynamic search selector from library or manual',
+            multiple: false,
+            searchable: true,
+            options: this.otherLocatorsOptions
+        };
+    }
+    toggleAdvanced() {
+        this.showAdvanced = !this.showAdvanced;
+    }
+    onCancel() {
+        this.cancelled.emit();
+    }
+    onCreateStep() {
+        if (this.aiAgentForm.valid) {
+            const formValue = this.aiAgentForm.value;
+            const stepData = {
+                query: formValue.query || '',
+                type: formValue.type || '',
+                environments: formValue.environments || '',
+                metadata: formValue.metadata || '',
+                description: formValue.description || '',
+                continueOnError: formValue.continueOnError || false,
+                disabled: formValue.disabled || false,
+                retryCount: formValue.retryCount || '',
+                iframeLocator: formValue.iframeLocator || '',
+                otherLocators: formValue.otherLocators || ''
+            };
+            this.createStep.emit(stepData);
+        }
+    }
+}
+StepBuilderAiAgentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderAiAgentComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+StepBuilderAiAgentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: StepBuilderAiAgentComponent, selector: "cqa-step-builder-ai-agent", inputs: { typeOptions: "typeOptions", environmentOptions: "environmentOptions", retryCountOptions: "retryCountOptions", iframeLocatorOptions: "iframeLocatorOptions", otherLocatorsOptions: "otherLocatorsOptions" }, outputs: { createStep: "createStep", cancelled: "cancelled" }, host: { classAttribute: "cqa-ui-root" }, ngImport: i0, template: "<div class=\"cqa-flex cqa-flex-col cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Create AI Step\n  </h2>\n\n  <div class=\"cqa-flex cqa-flex-col cqa-flex-1 cqa-max-h-[500px] cqa-overflow-y-auto\">\n    <!-- What should the agent achieve? -->\n    <div class=\"cqa-mb-6\">\n      <label class=\"cqa-text-[12px] cqa-font-medium cqa-text-gray-700 cqa-mb-1 cqa-block\">\n        What should the agent achieve?\n      </label>\n      <cqa-custom-textarea\n       class=\"cqa-step-builder-ai-agent-textarea\"\n        [placeholder]=\"'What should the agent achieve?'\"\n        [value]=\"aiAgentForm.get('query')?.value\"\n        [fullWidth]=\"true\"\n        [rows]=\"4\"\n        (valueChange)=\"aiAgentForm.get('query')?.setValue($event)\">\n      </cqa-custom-textarea>\n      <p class=\"cqa-text-[10px] cqa-text-[#0A0A0A] \">\n        Tip: Use numbered steps or bullet points for complex tasks.\n      </p>\n    </div>\n    <div class=\"cqa-flex cqa-flex-wrap cqa-custom-form-fields\">\n    <!-- Type Dropdown -->\n    <div class=\"cqa-mb-6 cqa-w-1/2 cqa-pr-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Type\n      </label>\n      <cqa-dynamic-select class=\"cqa-w-full\" [form]=\"aiAgentForm\" [config]=\"getTypeConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Environments Dropdown -->\n    <div class=\"cqa-mb-6 cqa-w-1/2 cqa-pl-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Envioronments\n      </label>\n      <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getEnvironmentConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Metadata Input -->\n    <div class=\"cqa-mb-2 cqa-w-1/2 cqa-pr-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Metadata\n      </label>\n      <cqa-custom-input\n        [placeholder]=\"'Text Input'\"\n        [value]=\"aiAgentForm.get('metadata')?.value\"\n        [fullWidth]=\"true\"\n        (valueChange)=\"aiAgentForm.get('metadata')?.setValue($event)\">\n      </cqa-custom-input>\n    </div>\n\n    <!-- Description Input -->\n    <div class=\"cqa-w-1/2 cqa-pl-2 \">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Description\n      </label>\n      <cqa-custom-input\n        [placeholder]=\"'Text Input'\"\n        [value]=\"aiAgentForm.get('description')?.value\"\n        [fullWidth]=\"true\"\n        (valueChange)=\"aiAgentForm.get('description')?.setValue($event)\">\n      </cqa-custom-input>\n    </div>\n    </div>\n\n\n    <!-- Advanced Section -->\n    <div class=\"cqa-mb-2\">\n      <button\n        type=\"button\"\n        class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-text-left cqa-text-[12px] cqa-font-medium cqa-text-gray-700 cqa-py-2 cqa-border-b cqa-border-gray-200\"\n        (click)=\"toggleAdvanced()\">\n        <span class=\"cqa-text-[10px]\">Advanced</span>\n        <mat-icon class=\"cqa-text-lg cqa-transition-transform\" [class.cqa-rotate-180]=\"showAdvanced\">\n          expand_more\n        </mat-icon>\n      </button>\n      <div *ngIf=\"showAdvanced\" class=\" cqa-custom-form-fields cqa-flex cqa-flex-col\">\n        <!-- Continue on Error -->\n        <div>\n          <span class=\"cqa-text-[10px] cqa-font-medium cqa-text-[#737373]\">Continue on Error</span>\n        </div>\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n          <cqa-custom-toggle\n            [checked]=\"aiAgentForm.get('continueOnError')?.value || false\"\n            (checkedChange)=\"aiAgentForm.get('continueOnError')?.setValue($event)\">\n          </cqa-custom-toggle>\n          <label class=\"cqa-text-[12px] cqa-font-normal cqa-text-[#0A0A0A]\">\n            Don't fail the test if this step fails.\n          </label>\n        </div>\n\n        <!-- Disabled -->\n        <div>\n          <span class=\"cqa-text-[10px] cqa-font-medium cqa-text-[#737373]\">Disabled</span>\n        </div>\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-4\">\n          <cqa-custom-toggle\n            [checked]=\"aiAgentForm.get('disabled')?.value || false\"\n            (checkedChange)=\"aiAgentForm.get('disabled')?.setValue($event)\">\n          </cqa-custom-toggle>\n          <label class=\"cqa-text-[12px] cqa-font-normal cqa-text-[#0A0A0A]\">\n            Skip this step during execution.\n          </label>\n        </div>\n\n        <!-- Retry Count -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Retry Count\n          </label>\n          <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getRetryCountConfig()\">\n          </cqa-dynamic-select>\n        </div>\n\n        <!-- Iframe locator -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Iframe locator\n          </label>\n          <cqa-dynamic-select class=\"cqa-text-[#414146]\" [form]=\"aiAgentForm\" [config]=\"getIframeLocatorConfig()\">\n          </cqa-dynamic-select>\n        </div>\n\n        <!-- Other Locators -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Other Locators\n          </label>\n          <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getOtherLocatorsConfig()\">\n          </cqa-dynamic-select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button class=\"cqa-w-1/2 cqa-rounded-[10px]\" variant=\"outlined\" text=\"Cancel\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button class=\"cqa-border-solid cqa-rounded-[9px] cqa-w-1/2 cqa-border cqa-border-[#3F43EE]\" variant=\"filled\" text=\"Create Step\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", components: [{ type: i2.CustomTextareaComponent, selector: "cqa-custom-textarea", inputs: ["label", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "rows", "cols", "resize", "textareaInlineStyle", "labelInlineStyle", "customClass"], outputs: ["valueChange", "blurred", "focused"] }, { type: i3.DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: i4.CustomInputComponent, selector: "cqa-custom-input", inputs: ["label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6.CustomToggleComponent, selector: "cqa-custom-toggle", inputs: ["checked", "disabled", "ariaLabel"], outputs: ["checkedChange", "change"] }, { type: i7.ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderAiAgentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cqa-step-builder-ai-agent', host: { class: 'cqa-ui-root' }, template: "<div class=\"cqa-flex cqa-flex-col cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Create AI Step\n  </h2>\n\n  <div class=\"cqa-flex cqa-flex-col cqa-flex-1 cqa-max-h-[500px] cqa-overflow-y-auto\">\n    <!-- What should the agent achieve? -->\n    <div class=\"cqa-mb-6\">\n      <label class=\"cqa-text-[12px] cqa-font-medium cqa-text-gray-700 cqa-mb-1 cqa-block\">\n        What should the agent achieve?\n      </label>\n      <cqa-custom-textarea\n       class=\"cqa-step-builder-ai-agent-textarea\"\n        [placeholder]=\"'What should the agent achieve?'\"\n        [value]=\"aiAgentForm.get('query')?.value\"\n        [fullWidth]=\"true\"\n        [rows]=\"4\"\n        (valueChange)=\"aiAgentForm.get('query')?.setValue($event)\">\n      </cqa-custom-textarea>\n      <p class=\"cqa-text-[10px] cqa-text-[#0A0A0A] \">\n        Tip: Use numbered steps or bullet points for complex tasks.\n      </p>\n    </div>\n    <div class=\"cqa-flex cqa-flex-wrap cqa-custom-form-fields\">\n    <!-- Type Dropdown -->\n    <div class=\"cqa-mb-6 cqa-w-1/2 cqa-pr-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Type\n      </label>\n      <cqa-dynamic-select class=\"cqa-w-full\" [form]=\"aiAgentForm\" [config]=\"getTypeConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Environments Dropdown -->\n    <div class=\"cqa-mb-6 cqa-w-1/2 cqa-pl-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Envioronments\n      </label>\n      <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getEnvironmentConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Metadata Input -->\n    <div class=\"cqa-mb-2 cqa-w-1/2 cqa-pr-2\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Metadata\n      </label>\n      <cqa-custom-input\n        [placeholder]=\"'Text Input'\"\n        [value]=\"aiAgentForm.get('metadata')?.value\"\n        [fullWidth]=\"true\"\n        (valueChange)=\"aiAgentForm.get('metadata')?.setValue($event)\">\n      </cqa-custom-input>\n    </div>\n\n    <!-- Description Input -->\n    <div class=\"cqa-w-1/2 cqa-pl-2 \">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Description\n      </label>\n      <cqa-custom-input\n        [placeholder]=\"'Text Input'\"\n        [value]=\"aiAgentForm.get('description')?.value\"\n        [fullWidth]=\"true\"\n        (valueChange)=\"aiAgentForm.get('description')?.setValue($event)\">\n      </cqa-custom-input>\n    </div>\n    </div>\n\n\n    <!-- Advanced Section -->\n    <div class=\"cqa-mb-2\">\n      <button\n        type=\"button\"\n        class=\"cqa-flex cqa-items-center cqa-justify-between cqa-w-full cqa-text-left cqa-text-[12px] cqa-font-medium cqa-text-gray-700 cqa-py-2 cqa-border-b cqa-border-gray-200\"\n        (click)=\"toggleAdvanced()\">\n        <span class=\"cqa-text-[10px]\">Advanced</span>\n        <mat-icon class=\"cqa-text-lg cqa-transition-transform\" [class.cqa-rotate-180]=\"showAdvanced\">\n          expand_more\n        </mat-icon>\n      </button>\n      <div *ngIf=\"showAdvanced\" class=\" cqa-custom-form-fields cqa-flex cqa-flex-col\">\n        <!-- Continue on Error -->\n        <div>\n          <span class=\"cqa-text-[10px] cqa-font-medium cqa-text-[#737373]\">Continue on Error</span>\n        </div>\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n          <cqa-custom-toggle\n            [checked]=\"aiAgentForm.get('continueOnError')?.value || false\"\n            (checkedChange)=\"aiAgentForm.get('continueOnError')?.setValue($event)\">\n          </cqa-custom-toggle>\n          <label class=\"cqa-text-[12px] cqa-font-normal cqa-text-[#0A0A0A]\">\n            Don't fail the test if this step fails.\n          </label>\n        </div>\n\n        <!-- Disabled -->\n        <div>\n          <span class=\"cqa-text-[10px] cqa-font-medium cqa-text-[#737373]\">Disabled</span>\n        </div>\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2 cqa-mb-4\">\n          <cqa-custom-toggle\n            [checked]=\"aiAgentForm.get('disabled')?.value || false\"\n            (checkedChange)=\"aiAgentForm.get('disabled')?.setValue($event)\">\n          </cqa-custom-toggle>\n          <label class=\"cqa-text-[12px] cqa-font-normal cqa-text-[#0A0A0A]\">\n            Skip this step during execution.\n          </label>\n        </div>\n\n        <!-- Retry Count -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Retry Count\n          </label>\n          <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getRetryCountConfig()\">\n          </cqa-dynamic-select>\n        </div>\n\n        <!-- Iframe locator -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Iframe locator\n          </label>\n          <cqa-dynamic-select class=\"cqa-text-[#414146]\" [form]=\"aiAgentForm\" [config]=\"getIframeLocatorConfig()\">\n          </cqa-dynamic-select>\n        </div>\n\n        <!-- Other Locators -->\n        <div class=\"cqa-flex cqa-flex-col cqa-mb-4\">\n          <label class=\"cqa-leading-[100%] cqa-text-[14px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n            Other Locators\n          </label>\n          <cqa-dynamic-select [form]=\"aiAgentForm\" [config]=\"getOtherLocatorsConfig()\">\n          </cqa-dynamic-select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button class=\"cqa-w-1/2 cqa-rounded-[10px]\" variant=\"outlined\" text=\"Cancel\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button class=\"cqa-border-solid cqa-rounded-[9px] cqa-w-1/2 cqa-border cqa-border-[#3F43EE]\" variant=\"filled\" text=\"Create Step\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", styles: [] }]
+        }], ctorParameters: function () { return [{ type: i1.FormBuilder }]; }, propDecorators: { typeOptions: [{
+                type: Input
+            }], environmentOptions: [{
+                type: Input
+            }], retryCountOptions: [{
+                type: Input
+            }], iframeLocatorOptions: [{
+                type: Input
+            }], otherLocatorsOptions: [{
+                type: Input
+            }], createStep: [{
+                type: Output
+            }], cancelled: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcC1idWlsZGVyLWFpLWFnZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvc3RlcC1idWlsZGVyL3N0ZXAtYnVpbGRlci1haS1hZ2VudC9zdGVwLWJ1aWxkZXItYWktYWdlbnQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvc3RlcC1idWlsZGVyLWFpLWFnZW50L3N0ZXAtYnVpbGRlci1haS1hZ2VudC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBMEIsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7Ozs7QUFzQnBFLE1BQU0sT0FBTywyQkFBMkI7SUF5QnRDLFlBQW9CLEVBQWU7UUFBZixPQUFFLEdBQUYsRUFBRSxDQUFhO1FBeEJuQyxnQ0FBZ0M7UUFDdkIsZ0JBQVcsR0FBbUIsRUFBRSxDQUFDO1FBRTFDLHdDQUF3QztRQUMvQix1QkFBa0IsR0FBbUIsRUFBRSxDQUFDO1FBRWpELHVDQUF1QztRQUM5QixzQkFBaUIsR0FBbUIsRUFBRSxDQUFDO1FBRWhELDBDQUEwQztRQUNqQyx5QkFBb0IsR0FBbUIsRUFBRSxDQUFDO1FBRW5ELDBDQUEwQztRQUNqQyx5QkFBb0IsR0FBbUIsRUFBRSxDQUFDO1FBRW5ELGdDQUFnQztRQUN0QixlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQW1CLENBQUM7UUFFM0QsMEJBQTBCO1FBQ2hCLGNBQVMsR0FBRyxJQUFJLFlBQVksRUFBUSxDQUFDO1FBRy9DLGlCQUFZLEdBQVksS0FBSyxDQUFDO1FBRzVCLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUM7WUFDL0IsS0FBSyxFQUFFLENBQUMsRUFBRSxFQUFFLFVBQVUsQ0FBQyxRQUFRLENBQUM7WUFDaEMsSUFBSSxFQUFFLENBQUMsRUFBRSxFQUFFLFVBQVUsQ0FBQyxRQUFRLENBQUM7WUFDL0IsWUFBWSxFQUFFLENBQUMsRUFBRSxFQUFFLFVBQVUsQ0FBQyxRQUFRLENBQUM7WUFDdkMsUUFBUSxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ2QsV0FBVyxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ2pCLGVBQWUsRUFBRSxDQUFDLEtBQUssQ0FBQztZQUN4QixRQUFRLEVBQUUsQ0FBQyxLQUFLLENBQUM7WUFDakIsVUFBVSxFQUFFLENBQUMsRUFBRSxDQUFDO1lBQ2hCLGFBQWEsRUFBRSxDQUFDLEVBQUUsQ0FBQztZQUNuQixhQUFhLEVBQUUsQ0FBQyxFQUFFLENBQUM7U0FDcEIsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELFFBQVE7UUFDTiwyQkFBMkI7SUFDN0IsQ0FBQztJQUVELGFBQWE7UUFDWCxPQUFPO1lBQ0wsR0FBRyxFQUFFLE1BQU07WUFDWCxXQUFXLEVBQUUsYUFBYTtZQUMxQixRQUFRLEVBQUUsS0FBSztZQUNmLFVBQVUsRUFBRSxLQUFLO1lBQ2pCLE9BQU8sRUFBRSxJQUFJLENBQUMsV0FBVztTQUMxQixDQUFDO0lBQ0osQ0FBQztJQUVELG9CQUFvQjtRQUNsQixPQUFPO1lBQ0wsR0FBRyxFQUFFLGNBQWM7WUFDbkIsV0FBVyxFQUFFLG9CQUFvQjtZQUNqQyxRQUFRLEVBQUUsS0FBSztZQUNmLFVBQVUsRUFBRSxLQUFLO1lBQ2pCLE9BQU8sRUFBRSxJQUFJLENBQUMsa0JBQWtCO1NBQ2pDLENBQUM7SUFDSixDQUFDO0lBRUQsbUJBQW1CO1FBQ2pCLE9BQU87WUFDTCxHQUFHLEVBQUUsWUFBWTtZQUNqQixXQUFXLEVBQUUsZ0RBQWdEO1lBQzdELFFBQVEsRUFBRSxLQUFLO1lBQ2YsVUFBVSxFQUFFLElBQUk7WUFDaEIsT0FBTyxFQUFFLElBQUksQ0FBQyxpQkFBaUI7U0FDaEMsQ0FBQztJQUNKLENBQUM7SUFFRCxzQkFBc0I7UUFDcEIsT0FBTztZQUNMLEdBQUcsRUFBRSxlQUFlO1lBQ3BCLFdBQVcsRUFBRSxnREFBZ0Q7WUFDN0QsUUFBUSxFQUFFLEtBQUs7WUFDZixVQUFVLEVBQUUsSUFBSTtZQUNoQixPQUFPLEVBQUUsSUFBSSxDQUFDLG9CQUFvQjtTQUNuQyxDQUFDO0lBQ0osQ0FBQztJQUVELHNCQUFzQjtRQUNwQixPQUFPO1lBQ0wsR0FBRyxFQUFFLGVBQWU7WUFDcEIsV0FBVyxFQUFFLGdEQUFnRDtZQUM3RCxRQUFRLEVBQUUsS0FBSztZQUNmLFVBQVUsRUFBRSxJQUFJO1lBQ2hCLE9BQU8sRUFBRSxJQUFJLENBQUMsb0JBQW9CO1NBQ25DLENBQUM7SUFDSixDQUFDO0lBRUQsY0FBYztRQUNaLElBQUksQ0FBQyxZQUFZLEdBQUcsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDO0lBQ3pDLENBQUM7SUFFRCxRQUFRO1FBQ04sSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN4QixDQUFDO0lBRUQsWUFBWTtRQUNWLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLEVBQUU7WUFDMUIsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUM7WUFDekMsTUFBTSxRQUFRLEdBQW9CO2dCQUNoQyxLQUFLLEVBQUUsU0FBUyxDQUFDLEtBQUssSUFBSSxFQUFFO2dCQUM1QixJQUFJLEVBQUUsU0FBUyxDQUFDLElBQUksSUFBSSxFQUFFO2dCQUMxQixZQUFZLEVBQUUsU0FBUyxDQUFDLFlBQVksSUFBSSxFQUFFO2dCQUMxQyxRQUFRLEVBQUUsU0FBUyxDQUFDLFFBQVEsSUFBSSxFQUFFO2dCQUNsQyxXQUFXLEVBQUUsU0FBUyxDQUFDLFdBQVcsSUFBSSxFQUFFO2dCQUN4QyxlQUFlLEVBQUUsU0FBUyxDQUFDLGVBQWUsSUFBSSxLQUFLO2dCQUNuRCxRQUFRLEVBQUUsU0FBUyxDQUFDLFFBQVEsSUFBSSxLQUFLO2dCQUNyQyxVQUFVLEVBQUUsU0FBUyxDQUFDLFVBQVUsSUFBSSxFQUFFO2dCQUN0QyxhQUFhLEVBQUUsU0FBUyxDQUFDLGFBQWEsSUFBSSxFQUFFO2dCQUM1QyxhQUFhLEVBQUUsU0FBUyxDQUFDLGFBQWEsSUFBSSxFQUFFO2FBQzdDLENBQUM7WUFDRixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUNoQztJQUNILENBQUM7O3dIQXZIVSwyQkFBMkI7NEdBQTNCLDJCQUEyQiwrWEN2QnhDLG0zTUF3SkE7MkZEaklhLDJCQUEyQjtrQkFOdkMsU0FBUzsrQkFDRSwyQkFBMkIsUUFHL0IsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFO2tHQUlyQixXQUFXO3NCQUFuQixLQUFLO2dCQUdHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFHRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBR0csb0JBQW9CO3NCQUE1QixLQUFLO2dCQUdHLG9CQUFvQjtzQkFBNUIsS0FBSztnQkFHSSxVQUFVO3NCQUFuQixNQUFNO2dCQUdHLFNBQVM7c0JBQWxCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQnVpbGRlciwgRm9ybUdyb3VwLCBWYWxpZGF0b3JzIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRHluYW1pY1NlbGVjdEZpZWxkQ29uZmlnLCBTZWxlY3RPcHRpb24gfSBmcm9tICcuLi8uLi9keW5hbWljLXNlbGVjdC9keW5hbWljLXNlbGVjdC1maWVsZC5jb21wb25lbnQnO1xuXG5leHBvcnQgaW50ZXJmYWNlIEFpQWdlbnRGb3JtRGF0YSB7XG4gIHF1ZXJ5OiBzdHJpbmc7XG4gIHR5cGU6IHN0cmluZztcbiAgZW52aXJvbm1lbnRzOiBzdHJpbmc7XG4gIG1ldGFkYXRhPzogc3RyaW5nO1xuICBkZXNjcmlwdGlvbj86IHN0cmluZztcbiAgY29udGludWVPbkVycm9yPzogYm9vbGVhbjtcbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xuICByZXRyeUNvdW50Pzogc3RyaW5nO1xuICBpZnJhbWVMb2NhdG9yPzogc3RyaW5nO1xuICBvdGhlckxvY2F0b3JzPzogc3RyaW5nO1xufVxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjcWEtc3RlcC1idWlsZGVyLWFpLWFnZW50JyxcbiAgdGVtcGxhdGVVcmw6ICcuL3N0ZXAtYnVpbGRlci1haS1hZ2VudC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogW10sXG4gIGhvc3Q6IHsgY2xhc3M6ICdjcWEtdWktcm9vdCcgfVxufSlcbmV4cG9ydCBjbGFzcyBTdGVwQnVpbGRlckFpQWdlbnRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICAvKiogT3B0aW9ucyBmb3IgdHlwZSBkcm9wZG93biAqL1xuICBASW5wdXQoKSB0eXBlT3B0aW9uczogU2VsZWN0T3B0aW9uW10gPSBbXTtcblxuICAvKiogT3B0aW9ucyBmb3IgZW52aXJvbm1lbnRzIGRyb3Bkb3duICovXG4gIEBJbnB1dCgpIGVudmlyb25tZW50T3B0aW9uczogU2VsZWN0T3B0aW9uW10gPSBbXTtcblxuICAvKiogT3B0aW9ucyBmb3IgcmV0cnkgY291bnQgZHJvcGRvd24gKi9cbiAgQElucHV0KCkgcmV0cnlDb3VudE9wdGlvbnM6IFNlbGVjdE9wdGlvbltdID0gW107XG5cbiAgLyoqIE9wdGlvbnMgZm9yIGlmcmFtZSBsb2NhdG9yIGRyb3Bkb3duICovXG4gIEBJbnB1dCgpIGlmcmFtZUxvY2F0b3JPcHRpb25zOiBTZWxlY3RPcHRpb25bXSA9IFtdO1xuXG4gIC8qKiBPcHRpb25zIGZvciBvdGhlciBsb2NhdG9ycyBkcm9wZG93biAqL1xuICBASW5wdXQoKSBvdGhlckxvY2F0b3JzT3B0aW9uczogU2VsZWN0T3B0aW9uW10gPSBbXTtcblxuICAvKiogRW1pdCB3aGVuIHN0ZXAgaXMgY3JlYXRlZCAqL1xuICBAT3V0cHV0KCkgY3JlYXRlU3RlcCA9IG5ldyBFdmVudEVtaXR0ZXI8QWlBZ2VudEZvcm1EYXRhPigpO1xuXG4gIC8qKiBFbWl0IHdoZW4gY2FuY2VsbGVkICovXG4gIEBPdXRwdXQoKSBjYW5jZWxsZWQgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG5cbiAgYWlBZ2VudEZvcm06IEZvcm1Hcm91cDtcbiAgc2hvd0FkdmFuY2VkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBmYjogRm9ybUJ1aWxkZXIpIHtcbiAgICB0aGlzLmFpQWdlbnRGb3JtID0gdGhpcy5mYi5ncm91cCh7XG4gICAgICBxdWVyeTogWycnLCBWYWxpZGF0b3JzLnJlcXVpcmVkXSxcbiAgICAgIHR5cGU6IFsnJywgVmFsaWRhdG9ycy5yZXF1aXJlZF0sXG4gICAgICBlbnZpcm9ubWVudHM6IFsnJywgVmFsaWRhdG9ycy5yZXF1aXJlZF0sXG4gICAgICBtZXRhZGF0YTogWycnXSxcbiAgICAgIGRlc2NyaXB0aW9uOiBbJyddLFxuICAgICAgY29udGludWVPbkVycm9yOiBbZmFsc2VdLFxuICAgICAgZGlzYWJsZWQ6IFtmYWxzZV0sXG4gICAgICByZXRyeUNvdW50OiBbJyddLFxuICAgICAgaWZyYW1lTG9jYXRvcjogWycnXSxcbiAgICAgIG90aGVyTG9jYXRvcnM6IFsnJ11cbiAgICB9KTtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIC8vIENvbXBvbmVudCBpbml0aWFsaXphdGlvblxuICB9XG5cbiAgZ2V0VHlwZUNvbmZpZygpOiBEeW5hbWljU2VsZWN0RmllbGRDb25maWcge1xuICAgIHJldHVybiB7XG4gICAgICBrZXk6ICd0eXBlJyxcbiAgICAgIHBsYWNlaG9sZGVyOiAnU2VsZWN0IHR5cGUnLFxuICAgICAgbXVsdGlwbGU6IGZhbHNlLFxuICAgICAgc2VhcmNoYWJsZTogZmFsc2UsXG4gICAgICBvcHRpb25zOiB0aGlzLnR5cGVPcHRpb25zXG4gICAgfTtcbiAgfVxuXG4gIGdldEVudmlyb25tZW50Q29uZmlnKCk6IER5bmFtaWNTZWxlY3RGaWVsZENvbmZpZyB7XG4gICAgcmV0dXJuIHtcbiAgICAgIGtleTogJ2Vudmlyb25tZW50cycsXG4gICAgICBwbGFjZWhvbGRlcjogJ1NlbGVjdCBlbnZpcm9ubWVudCcsXG4gICAgICBtdWx0aXBsZTogZmFsc2UsXG4gICAgICBzZWFyY2hhYmxlOiBmYWxzZSxcbiAgICAgIG9wdGlvbnM6IHRoaXMuZW52aXJvbm1lbnRPcHRpb25zXG4gICAgfTtcbiAgfVxuXG4gIGdldFJldHJ5Q291bnRDb25maWcoKTogRHluYW1pY1NlbGVjdEZpZWxkQ29uZmlnIHtcbiAgICByZXR1cm4ge1xuICAgICAga2V5OiAncmV0cnlDb3VudCcsXG4gICAgICBwbGFjZWhvbGRlcjogJ0R5bmFtaWMgc2VhcmNoIHNlbGVjdG9yIGZyb20gbGlicmFyeSBvciBtYW51YWwnLFxuICAgICAgbXVsdGlwbGU6IGZhbHNlLFxuICAgICAgc2VhcmNoYWJsZTogdHJ1ZSxcbiAgICAgIG9wdGlvbnM6IHRoaXMucmV0cnlDb3VudE9wdGlvbnNcbiAgICB9O1xuICB9XG5cbiAgZ2V0SWZyYW1lTG9jYXRvckNvbmZpZygpOiBEeW5hbWljU2VsZWN0RmllbGRDb25maWcge1xuICAgIHJldHVybiB7XG4gICAgICBrZXk6ICdpZnJhbWVMb2NhdG9yJyxcbiAgICAgIHBsYWNlaG9sZGVyOiAnRHluYW1pYyBzZWFyY2ggc2VsZWN0b3IgZnJvbSBsaWJyYXJ5IG9yIG1hbnVhbCcsXG4gICAgICBtdWx0aXBsZTogZmFsc2UsXG4gICAgICBzZWFyY2hhYmxlOiB0cnVlLFxuICAgICAgb3B0aW9uczogdGhpcy5pZnJhbWVMb2NhdG9yT3B0aW9uc1xuICAgIH07XG4gIH1cblxuICBnZXRPdGhlckxvY2F0b3JzQ29uZmlnKCk6IER5bmFtaWNTZWxlY3RGaWVsZENvbmZpZyB7XG4gICAgcmV0dXJuIHtcbiAgICAgIGtleTogJ290aGVyTG9jYXRvcnMnLFxuICAgICAgcGxhY2Vob2xkZXI6ICdEeW5hbWljIHNlYXJjaCBzZWxlY3RvciBmcm9tIGxpYnJhcnkgb3IgbWFudWFsJyxcbiAgICAgIG11bHRpcGxlOiBmYWxzZSxcbiAgICAgIHNlYXJjaGFibGU6IHRydWUsXG4gICAgICBvcHRpb25zOiB0aGlzLm90aGVyTG9jYXRvcnNPcHRpb25zXG4gICAgfTtcbiAgfVxuXG4gIHRvZ2dsZUFkdmFuY2VkKCk6IHZvaWQge1xuICAgIHRoaXMuc2hvd0FkdmFuY2VkID0gIXRoaXMuc2hvd0FkdmFuY2VkO1xuICB9XG5cbiAgb25DYW5jZWwoKTogdm9pZCB7XG4gICAgdGhpcy5jYW5jZWxsZWQuZW1pdCgpO1xuICB9XG5cbiAgb25DcmVhdGVTdGVwKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmFpQWdlbnRGb3JtLnZhbGlkKSB7XG4gICAgICBjb25zdCBmb3JtVmFsdWUgPSB0aGlzLmFpQWdlbnRGb3JtLnZhbHVlO1xuICAgICAgY29uc3Qgc3RlcERhdGE6IEFpQWdlbnRGb3JtRGF0YSA9IHtcbiAgICAgICAgcXVlcnk6IGZvcm1WYWx1ZS5xdWVyeSB8fCAnJyxcbiAgICAgICAgdHlwZTogZm9ybVZhbHVlLnR5cGUgfHwgJycsXG4gICAgICAgIGVudmlyb25tZW50czogZm9ybVZhbHVlLmVudmlyb25tZW50cyB8fCAnJyxcbiAgICAgICAgbWV0YWRhdGE6IGZvcm1WYWx1ZS5tZXRhZGF0YSB8fCAnJyxcbiAgICAgICAgZGVzY3JpcHRpb246IGZvcm1WYWx1ZS5kZXNjcmlwdGlvbiB8fCAnJyxcbiAgICAgICAgY29udGludWVPbkVycm9yOiBmb3JtVmFsdWUuY29udGludWVPbkVycm9yIHx8IGZhbHNlLFxuICAgICAgICBkaXNhYmxlZDogZm9ybVZhbHVlLmRpc2FibGVkIHx8IGZhbHNlLFxuICAgICAgICByZXRyeUNvdW50OiBmb3JtVmFsdWUucmV0cnlDb3VudCB8fCAnJyxcbiAgICAgICAgaWZyYW1lTG9jYXRvcjogZm9ybVZhbHVlLmlmcmFtZUxvY2F0b3IgfHwgJycsXG4gICAgICAgIG90aGVyTG9jYXRvcnM6IGZvcm1WYWx1ZS5vdGhlckxvY2F0b3JzIHx8ICcnXG4gICAgICB9O1xuICAgICAgdGhpcy5jcmVhdGVTdGVwLmVtaXQoc3RlcERhdGEpO1xuICAgIH1cbiAgfVxufVxuXG4iLCI8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1iZy13aGl0ZSBjcWEtcHgtNCBjcWEtcHktMlwiPlxuICA8IS0tIEhlYWRlciAtLT5cbiAgPGgyIGNsYXNzPVwiY3FhLXRleHQtWzEycHhdIGNxYS1mb250LXNlbWlib2xkIGNxYS10ZXh0LWJsYWNrLTEwMCBjcWEtbWItNFwiPlxuICAgIENyZWF0ZSBBSSBTdGVwXG4gIDwvaDI+XG5cbiAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1mbGV4LWNvbCBjcWEtZmxleC0xIGNxYS1tYXgtaC1bNTAwcHhdIGNxYS1vdmVyZmxvdy15LWF1dG9cIj5cbiAgICA8IS0tIFdoYXQgc2hvdWxkIHRoZSBhZ2VudCBhY2hpZXZlPyAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLW1iLTZcIj5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtZ3JheS03MDAgY3FhLW1iLTEgY3FhLWJsb2NrXCI+XG4gICAgICAgIFdoYXQgc2hvdWxkIHRoZSBhZ2VudCBhY2hpZXZlP1xuICAgICAgPC9sYWJlbD5cbiAgICAgIDxjcWEtY3VzdG9tLXRleHRhcmVhXG4gICAgICAgY2xhc3M9XCJjcWEtc3RlcC1idWlsZGVyLWFpLWFnZW50LXRleHRhcmVhXCJcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidXaGF0IHNob3VsZCB0aGUgYWdlbnQgYWNoaWV2ZT8nXCJcbiAgICAgICAgW3ZhbHVlXT1cImFpQWdlbnRGb3JtLmdldCgncXVlcnknKT8udmFsdWVcIlxuICAgICAgICBbZnVsbFdpZHRoXT1cInRydWVcIlxuICAgICAgICBbcm93c109XCI0XCJcbiAgICAgICAgKHZhbHVlQ2hhbmdlKT1cImFpQWdlbnRGb3JtLmdldCgncXVlcnknKT8uc2V0VmFsdWUoJGV2ZW50KVwiPlxuICAgICAgPC9jcWEtY3VzdG9tLXRleHRhcmVhPlxuICAgICAgPHAgY2xhc3M9XCJjcWEtdGV4dC1bMTBweF0gY3FhLXRleHQtWyMwQTBBMEFdIFwiPlxuICAgICAgICBUaXA6IFVzZSBudW1iZXJlZCBzdGVwcyBvciBidWxsZXQgcG9pbnRzIGZvciBjb21wbGV4IHRhc2tzLlxuICAgICAgPC9wPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZmxleC13cmFwIGNxYS1jdXN0b20tZm9ybS1maWVsZHNcIj5cbiAgICA8IS0tIFR5cGUgRHJvcGRvd24gLS0+XG4gICAgPGRpdiBjbGFzcz1cImNxYS1tYi02IGNxYS13LTEvMiBjcWEtcHItMlwiPlxuICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS1ibG9jayBjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LVsjMTYxNjE3XSBjcWEtbWItMVwiPlxuICAgICAgICBUeXBlXG4gICAgICA8L2xhYmVsPlxuICAgICAgPGNxYS1keW5hbWljLXNlbGVjdCBjbGFzcz1cImNxYS13LWZ1bGxcIiBbZm9ybV09XCJhaUFnZW50Rm9ybVwiIFtjb25maWddPVwiZ2V0VHlwZUNvbmZpZygpXCI+XG4gICAgICA8L2NxYS1keW5hbWljLXNlbGVjdD5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gRW52aXJvbm1lbnRzIERyb3Bkb3duIC0tPlxuICAgIDxkaXYgY2xhc3M9XCJjcWEtbWItNiBjcWEtdy0xLzIgY3FhLXBsLTJcIj5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS1sZWFkaW5nLVsxMDAlXSBjcWEtYmxvY2sgY3FhLXRleHQtWzEycHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1bIzE2MTYxN10gY3FhLW1iLTFcIj5cbiAgICAgICAgRW52aW9yb25tZW50c1xuICAgICAgPC9sYWJlbD5cbiAgICAgIDxjcWEtZHluYW1pYy1zZWxlY3QgW2Zvcm1dPVwiYWlBZ2VudEZvcm1cIiBbY29uZmlnXT1cImdldEVudmlyb25tZW50Q29uZmlnKClcIj5cbiAgICAgIDwvY3FhLWR5bmFtaWMtc2VsZWN0PlxuICAgIDwvZGl2PlxuXG4gICAgPCEtLSBNZXRhZGF0YSBJbnB1dCAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLW1iLTIgY3FhLXctMS8yIGNxYS1wci0yXCI+XG4gICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtbGVhZGluZy1bMTAwJV0gY3FhLWJsb2NrIGNxYS10ZXh0LVsxMnB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtWyMxNjE2MTddIGNxYS1tYi0xXCI+XG4gICAgICAgIE1ldGFkYXRhXG4gICAgICA8L2xhYmVsPlxuICAgICAgPGNxYS1jdXN0b20taW5wdXRcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidUZXh0IElucHV0J1wiXG4gICAgICAgIFt2YWx1ZV09XCJhaUFnZW50Rm9ybS5nZXQoJ21ldGFkYXRhJyk/LnZhbHVlXCJcbiAgICAgICAgW2Z1bGxXaWR0aF09XCJ0cnVlXCJcbiAgICAgICAgKHZhbHVlQ2hhbmdlKT1cImFpQWdlbnRGb3JtLmdldCgnbWV0YWRhdGEnKT8uc2V0VmFsdWUoJGV2ZW50KVwiPlxuICAgICAgPC9jcWEtY3VzdG9tLWlucHV0PlxuICAgIDwvZGl2PlxuXG4gICAgPCEtLSBEZXNjcmlwdGlvbiBJbnB1dCAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLXctMS8yIGNxYS1wbC0yIFwiPlxuICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS1ibG9jayBjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LVsjMTYxNjE3XSBjcWEtbWItMVwiPlxuICAgICAgICBEZXNjcmlwdGlvblxuICAgICAgPC9sYWJlbD5cbiAgICAgIDxjcWEtY3VzdG9tLWlucHV0XG4gICAgICAgIFtwbGFjZWhvbGRlcl09XCInVGV4dCBJbnB1dCdcIlxuICAgICAgICBbdmFsdWVdPVwiYWlBZ2VudEZvcm0uZ2V0KCdkZXNjcmlwdGlvbicpPy52YWx1ZVwiXG4gICAgICAgIFtmdWxsV2lkdGhdPVwidHJ1ZVwiXG4gICAgICAgICh2YWx1ZUNoYW5nZSk9XCJhaUFnZW50Rm9ybS5nZXQoJ2Rlc2NyaXB0aW9uJyk/LnNldFZhbHVlKCRldmVudClcIj5cbiAgICAgIDwvY3FhLWN1c3RvbS1pbnB1dD5cbiAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuXG4gICAgPCEtLSBBZHZhbmNlZCBTZWN0aW9uIC0tPlxuICAgIDxkaXYgY2xhc3M9XCJjcWEtbWItMlwiPlxuICAgICAgPGJ1dHRvblxuICAgICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgICAgY2xhc3M9XCJjcWEtZmxleCBjcWEtaXRlbXMtY2VudGVyIGNxYS1qdXN0aWZ5LWJldHdlZW4gY3FhLXctZnVsbCBjcWEtdGV4dC1sZWZ0IGNxYS10ZXh0LVsxMnB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtZ3JheS03MDAgY3FhLXB5LTIgY3FhLWJvcmRlci1iIGNxYS1ib3JkZXItZ3JheS0yMDBcIlxuICAgICAgICAoY2xpY2spPVwidG9nZ2xlQWR2YW5jZWQoKVwiPlxuICAgICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMHB4XVwiPkFkdmFuY2VkPC9zcGFuPlxuICAgICAgICA8bWF0LWljb24gY2xhc3M9XCJjcWEtdGV4dC1sZyBjcWEtdHJhbnNpdGlvbi10cmFuc2Zvcm1cIiBbY2xhc3MuY3FhLXJvdGF0ZS0xODBdPVwic2hvd0FkdmFuY2VkXCI+XG4gICAgICAgICAgZXhwYW5kX21vcmVcbiAgICAgICAgPC9tYXQtaWNvbj5cbiAgICAgIDwvYnV0dG9uPlxuICAgICAgPGRpdiAqbmdJZj1cInNob3dBZHZhbmNlZFwiIGNsYXNzPVwiIGNxYS1jdXN0b20tZm9ybS1maWVsZHMgY3FhLWZsZXggY3FhLWZsZXgtY29sXCI+XG4gICAgICAgIDwhLS0gQ29udGludWUgb24gRXJyb3IgLS0+XG4gICAgICAgIDxkaXY+XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJjcWEtdGV4dC1bMTBweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LVsjNzM3MzczXVwiPkNvbnRpbnVlIG9uIEVycm9yPC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1pdGVtcy1jZW50ZXIgY3FhLWdhcC0yXCI+XG4gICAgICAgICAgPGNxYS1jdXN0b20tdG9nZ2xlXG4gICAgICAgICAgICBbY2hlY2tlZF09XCJhaUFnZW50Rm9ybS5nZXQoJ2NvbnRpbnVlT25FcnJvcicpPy52YWx1ZSB8fCBmYWxzZVwiXG4gICAgICAgICAgICAoY2hlY2tlZENoYW5nZSk9XCJhaUFnZW50Rm9ybS5nZXQoJ2NvbnRpbnVlT25FcnJvcicpPy5zZXRWYWx1ZSgkZXZlbnQpXCI+XG4gICAgICAgICAgPC9jcWEtY3VzdG9tLXRvZ2dsZT5cbiAgICAgICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbm9ybWFsIGNxYS10ZXh0LVsjMEEwQTBBXVwiPlxuICAgICAgICAgICAgRG9uJ3QgZmFpbCB0aGUgdGVzdCBpZiB0aGlzIHN0ZXAgZmFpbHMuXG4gICAgICAgICAgPC9sYWJlbD5cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPCEtLSBEaXNhYmxlZCAtLT5cbiAgICAgICAgPGRpdj5cbiAgICAgICAgICA8c3BhbiBjbGFzcz1cImNxYS10ZXh0LVsxMHB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtWyM3MzczNzNdXCI+RGlzYWJsZWQ8L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWl0ZW1zLWNlbnRlciBjcWEtZ2FwLTIgY3FhLW1iLTRcIj5cbiAgICAgICAgICA8Y3FhLWN1c3RvbS10b2dnbGVcbiAgICAgICAgICAgIFtjaGVja2VkXT1cImFpQWdlbnRGb3JtLmdldCgnZGlzYWJsZWQnKT8udmFsdWUgfHwgZmFsc2VcIlxuICAgICAgICAgICAgKGNoZWNrZWRDaGFuZ2UpPVwiYWlBZ2VudEZvcm0uZ2V0KCdkaXNhYmxlZCcpPy5zZXRWYWx1ZSgkZXZlbnQpXCI+XG4gICAgICAgICAgPC9jcWEtY3VzdG9tLXRvZ2dsZT5cbiAgICAgICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbm9ybWFsIGNxYS10ZXh0LVsjMEEwQTBBXVwiPlxuICAgICAgICAgICAgU2tpcCB0aGlzIHN0ZXAgZHVyaW5nIGV4ZWN1dGlvbi5cbiAgICAgICAgICA8L2xhYmVsPlxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8IS0tIFJldHJ5IENvdW50IC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1tYi00XCI+XG4gICAgICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS10ZXh0LVsxNHB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtWyMxNjE2MTddIGNxYS1tYi0xIGNxYS1ibG9ja1wiPlxuICAgICAgICAgICAgUmV0cnkgQ291bnRcbiAgICAgICAgICA8L2xhYmVsPlxuICAgICAgICAgIDxjcWEtZHluYW1pYy1zZWxlY3QgW2Zvcm1dPVwiYWlBZ2VudEZvcm1cIiBbY29uZmlnXT1cImdldFJldHJ5Q291bnRDb25maWcoKVwiPlxuICAgICAgICAgIDwvY3FhLWR5bmFtaWMtc2VsZWN0PlxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8IS0tIElmcmFtZSBsb2NhdG9yIC0tPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY3FhLWZsZXggY3FhLWZsZXgtY29sIGNxYS1tYi00XCI+XG4gICAgICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS10ZXh0LVsxNHB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtWyMxNjE2MTddIGNxYS1tYi0xIGNxYS1ibG9ja1wiPlxuICAgICAgICAgICAgSWZyYW1lIGxvY2F0b3JcbiAgICAgICAgICA8L2xhYmVsPlxuICAgICAgICAgIDxjcWEtZHluYW1pYy1zZWxlY3QgY2xhc3M9XCJjcWEtdGV4dC1bIzQxNDE0Nl1cIiBbZm9ybV09XCJhaUFnZW50Rm9ybVwiIFtjb25maWddPVwiZ2V0SWZyYW1lTG9jYXRvckNvbmZpZygpXCI+XG4gICAgICAgICAgPC9jcWEtZHluYW1pYy1zZWxlY3Q+XG4gICAgICAgIDwvZGl2PlxuXG4gICAgICAgIDwhLS0gT3RoZXIgTG9jYXRvcnMgLS0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZmxleC1jb2wgY3FhLW1iLTRcIj5cbiAgICAgICAgICA8bGFiZWwgY2xhc3M9XCJjcWEtbGVhZGluZy1bMTAwJV0gY3FhLXRleHQtWzE0cHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1bIzE2MTYxN10gY3FhLW1iLTEgY3FhLWJsb2NrXCI+XG4gICAgICAgICAgICBPdGhlciBMb2NhdG9yc1xuICAgICAgICAgIDwvbGFiZWw+XG4gICAgICAgICAgPGNxYS1keW5hbWljLXNlbGVjdCBbZm9ybV09XCJhaUFnZW50Rm9ybVwiIFtjb25maWddPVwiZ2V0T3RoZXJMb2NhdG9yc0NvbmZpZygpXCI+XG4gICAgICAgICAgPC9jcWEtZHluYW1pYy1zZWxlY3Q+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuXG4gIDwhLS0gQWN0aW9uIEJ1dHRvbnMgLS0+XG4gIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtdy1mdWxsIGNxYS1nYXAtMiBjcWEtbXQtYXV0byBjcWEtcHQtNCBjcWEtYm9yZGVyLXQgY3FhLWJvcmRlci1ncmF5LTIwMFwiPlxuICAgIDxjcWEtYnV0dG9uIGNsYXNzPVwiY3FhLXctMS8yIGNxYS1yb3VuZGVkLVsxMHB4XVwiIHZhcmlhbnQ9XCJvdXRsaW5lZFwiIHRleHQ9XCJDYW5jZWxcIiBbY3VzdG9tQ2xhc3NdPVwiJ2NxYS1mbGV4LTEgY3FhLXctZnVsbCdcIlxuICAgICAgKGNsaWNrZWQpPVwib25DYW5jZWwoKVwiPlxuICAgIDwvY3FhLWJ1dHRvbj5cbiAgICA8Y3FhLWJ1dHRvbiBjbGFzcz1cImNxYS1ib3JkZXItc29saWQgY3FhLXJvdW5kZWQtWzlweF0gY3FhLXctMS8yIGNxYS1ib3JkZXIgY3FhLWJvcmRlci1bIzNGNDNFRV1cIiB2YXJpYW50PVwiZmlsbGVkXCIgdGV4dD1cIkNyZWF0ZSBTdGVwXCIgW2N1c3RvbUNsYXNzXT1cIidjcWEtZmxleC0xIGNxYS13LWZ1bGwnXCJcbiAgICAgIChjbGlja2VkKT1cIm9uQ3JlYXRlU3RlcCgpXCI+XG4gICAgPC9jcWEtYnV0dG9uPlxuICA8L2Rpdj5cbjwvZGl2PlxuXG4iXX0=

package/esm2020/lib/step-builder/step-builder-custom-code/step-builder-custom-code.component.mjs

@@ -0,0 +1,65 @@
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { Validators } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "../../dynamic-select/dynamic-select-field.component";
+import * as i3 from "../../custom-textarea/custom-textarea.component";
+import * as i4 from "../../custom-input/custom-input.component";
+import * as i5 from "../../button/button.component";
+export class StepBuilderCustomCodeComponent {
+    constructor(fb) {
+        this.fb = fb;
+        /** Options for language dropdown */
+        this.languageOptions = [];
+        /** Emit when step is created */
+        this.createStep = new EventEmitter();
+        /** Emit when cancelled */
+        this.cancelled = new EventEmitter();
+        this.customCodeForm = this.fb.group({
+            language: ['', Validators.required],
+            code: ['', Validators.required],
+            metadata: [''],
+            description: ['']
+        });
+    }
+    ngOnInit() {
+        // Component initialization
+    }
+    getLanguageConfig() {
+        return {
+            key: 'language',
+            placeholder: '...',
+            multiple: false,
+            searchable: false,
+            options: this.languageOptions
+        };
+    }
+    onCancel() {
+        this.cancelled.emit();
+    }
+    onCreateStep() {
+        if (this.customCodeForm.valid) {
+            const formValue = this.customCodeForm.value;
+            const stepData = {
+                language: formValue.language || '',
+                code: formValue.code || '',
+                metadata: formValue.metadata || '',
+                description: formValue.description || ''
+            };
+            this.createStep.emit(stepData);
+        }
+    }
+}
+StepBuilderCustomCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderCustomCodeComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+StepBuilderCustomCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: StepBuilderCustomCodeComponent, selector: "cqa-step-builder-custom-code", inputs: { languageOptions: "languageOptions" }, outputs: { createStep: "createStep", cancelled: "cancelled" }, host: { classAttribute: "cqa-ui-root" }, ngImport: i0, template: "<div class=\"cqa-flex cqa-flex-col cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Custom Code Step\n  </h2>\n\n  <div class=\"cqa-flex cqa-flex-col cqa-flex-1 cqa-max-h-[500px] cqa-overflow-y-auto\">\n    <!-- Language Dropdown -->\n    <div class=\"cqa-mb-3\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Language\n      </label>\n      <cqa-dynamic-select class=\"cqa-w-full\" [form]=\"customCodeForm\" [config]=\"getLanguageConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Code Textarea -->\n    <div class=\"cqa-mb-3\">\n      <label class=\"cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n        Code\n      </label>\n      <cqa-custom-textarea\n        class=\"cqa-step-builder-custom-code-textarea\"\n        [placeholder]=\"'// Write your code here...'\"\n        [value]=\"customCodeForm.get('code')?.value\"\n        [fullWidth]=\"true\"\n        [rows]=\"4\"\n        (valueChange)=\"customCodeForm.get('code')?.setValue($event)\">\n      </cqa-custom-textarea>\n    </div>\n\n    <div class=\"cqa-flex cqa-flex-wrap cqa-custom-form-fields\">\n      <!-- Metadata Input -->\n      <div class=\"cqa-mb-2 cqa-w-1/2 cqa-pr-2\">\n        <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n          Metadata\n        </label>\n        <cqa-custom-input\n          [placeholder]=\"'Text Input'\"\n          [value]=\"customCodeForm.get('metadata')?.value\"\n          [fullWidth]=\"true\"\n          (valueChange)=\"customCodeForm.get('metadata')?.setValue($event)\">\n        </cqa-custom-input>\n      </div>\n\n      <!-- Description Input -->\n      <div class=\"cqa-w-1/2 cqa-pl-2\">\n        <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n          Description\n        </label>\n        <cqa-custom-input\n          [placeholder]=\"'Text Input'\"\n          [value]=\"customCodeForm.get('description')?.value\"\n          [fullWidth]=\"true\"\n          (valueChange)=\"customCodeForm.get('description')?.setValue($event)\">\n        </cqa-custom-input>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button class=\"cqa-w-1/2 cqa-rounded-[10px]\" variant=\"outlined\" text=\"Cancel\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button class=\"cqa-border-solid cqa-rounded-[9px] cqa-w-1/2 cqa-border cqa-border-[#3F43EE]\" variant=\"filled\" text=\"Create Step\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", components: [{ type: i2.DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: i3.CustomTextareaComponent, selector: "cqa-custom-textarea", inputs: ["label", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "rows", "cols", "resize", "textareaInlineStyle", "labelInlineStyle", "customClass"], outputs: ["valueChange", "blurred", "focused"] }, { type: i4.CustomInputComponent, selector: "cqa-custom-input", inputs: ["label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i5.ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderCustomCodeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cqa-step-builder-custom-code', host: { class: 'cqa-ui-root' }, template: "<div class=\"cqa-flex cqa-flex-col cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Custom Code Step\n  </h2>\n\n  <div class=\"cqa-flex cqa-flex-col cqa-flex-1 cqa-max-h-[500px] cqa-overflow-y-auto\">\n    <!-- Language Dropdown -->\n    <div class=\"cqa-mb-3\">\n      <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n        Language\n      </label>\n      <cqa-dynamic-select class=\"cqa-w-full\" [form]=\"customCodeForm\" [config]=\"getLanguageConfig()\">\n      </cqa-dynamic-select>\n    </div>\n\n    <!-- Code Textarea -->\n    <div class=\"cqa-mb-3\">\n      <label class=\"cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1 cqa-block\">\n        Code\n      </label>\n      <cqa-custom-textarea\n        class=\"cqa-step-builder-custom-code-textarea\"\n        [placeholder]=\"'// Write your code here...'\"\n        [value]=\"customCodeForm.get('code')?.value\"\n        [fullWidth]=\"true\"\n        [rows]=\"4\"\n        (valueChange)=\"customCodeForm.get('code')?.setValue($event)\">\n      </cqa-custom-textarea>\n    </div>\n\n    <div class=\"cqa-flex cqa-flex-wrap cqa-custom-form-fields\">\n      <!-- Metadata Input -->\n      <div class=\"cqa-mb-2 cqa-w-1/2 cqa-pr-2\">\n        <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n          Metadata\n        </label>\n        <cqa-custom-input\n          [placeholder]=\"'Text Input'\"\n          [value]=\"customCodeForm.get('metadata')?.value\"\n          [fullWidth]=\"true\"\n          (valueChange)=\"customCodeForm.get('metadata')?.setValue($event)\">\n        </cqa-custom-input>\n      </div>\n\n      <!-- Description Input -->\n      <div class=\"cqa-w-1/2 cqa-pl-2\">\n        <label class=\"cqa-leading-[100%] cqa-block cqa-text-[12px] cqa-font-medium cqa-text-[#161617] cqa-mb-1\">\n          Description\n        </label>\n        <cqa-custom-input\n          [placeholder]=\"'Text Input'\"\n          [value]=\"customCodeForm.get('description')?.value\"\n          [fullWidth]=\"true\"\n          (valueChange)=\"customCodeForm.get('description')?.setValue($event)\">\n        </cqa-custom-input>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button class=\"cqa-w-1/2 cqa-rounded-[10px]\" variant=\"outlined\" text=\"Cancel\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button class=\"cqa-border-solid cqa-rounded-[9px] cqa-w-1/2 cqa-border cqa-border-[#3F43EE]\" variant=\"filled\" text=\"Create Step\" [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", styles: [] }]
+        }], ctorParameters: function () { return [{ type: i1.FormBuilder }]; }, propDecorators: { languageOptions: [{
+                type: Input
+            }], createStep: [{
+                type: Output
+            }], cancelled: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcC1idWlsZGVyLWN1c3RvbS1jb2RlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvc3RlcC1idWlsZGVyL3N0ZXAtYnVpbGRlci1jdXN0b20tY29kZS9zdGVwLWJ1aWxkZXItY3VzdG9tLWNvZGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9zdGVwLWJ1aWxkZXIvc3RlcC1idWlsZGVyLWN1c3RvbS1jb2RlL3N0ZXAtYnVpbGRlci1jdXN0b20tY29kZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBMEIsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFnQnBFLE1BQU0sT0FBTyw4QkFBOEI7SUFZekMsWUFBb0IsRUFBZTtRQUFmLE9BQUUsR0FBRixFQUFFLENBQWE7UUFYbkMsb0NBQW9DO1FBQzNCLG9CQUFlLEdBQW1CLEVBQUUsQ0FBQztRQUU5QyxnQ0FBZ0M7UUFDdEIsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFzQixDQUFDO1FBRTlELDBCQUEwQjtRQUNoQixjQUFTLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUs3QyxJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDO1lBQ2xDLFFBQVEsRUFBRSxDQUFDLEVBQUUsRUFBRSxVQUFVLENBQUMsUUFBUSxDQUFDO1lBQ25DLElBQUksRUFBRSxDQUFDLEVBQUUsRUFBRSxVQUFVLENBQUMsUUFBUSxDQUFDO1lBQy9CLFFBQVEsRUFBRSxDQUFDLEVBQUUsQ0FBQztZQUNkLFdBQVcsRUFBRSxDQUFDLEVBQUUsQ0FBQztTQUNsQixDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsUUFBUTtRQUNOLDJCQUEyQjtJQUM3QixDQUFDO0lBRUQsaUJBQWlCO1FBQ2YsT0FBTztZQUNMLEdBQUcsRUFBRSxVQUFVO1lBQ2YsV0FBVyxFQUFFLEtBQUs7WUFDbEIsUUFBUSxFQUFFLEtBQUs7WUFDZixVQUFVLEVBQUUsS0FBSztZQUNqQixPQUFPLEVBQUUsSUFBSSxDQUFDLGVBQWU7U0FDOUIsQ0FBQztJQUNKLENBQUM7SUFFRCxRQUFRO1FBQ04sSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN4QixDQUFDO0lBRUQsWUFBWTtRQUNWLElBQUksSUFBSSxDQUFDLGNBQWMsQ0FBQyxLQUFLLEVBQUU7WUFDN0IsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUM7WUFDNUMsTUFBTSxRQUFRLEdBQXVCO2dCQUNuQyxRQUFRLEVBQUUsU0FBUyxDQUFDLFFBQVEsSUFBSSxFQUFFO2dCQUNsQyxJQUFJLEVBQUUsU0FBUyxDQUFDLElBQUksSUFBSSxFQUFFO2dCQUMxQixRQUFRLEVBQUUsU0FBUyxDQUFDLFFBQVEsSUFBSSxFQUFFO2dCQUNsQyxXQUFXLEVBQUUsU0FBUyxDQUFDLFdBQVcsSUFBSSxFQUFFO2FBQ3pDLENBQUM7WUFDRixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUNoQztJQUNILENBQUM7OzJIQWxEVSw4QkFBOEI7K0dBQTlCLDhCQUE4Qiw0TkNqQjNDLHMyRkF1RUE7MkZEdERhLDhCQUE4QjtrQkFOMUMsU0FBUzsrQkFDRSw4QkFBOEIsUUFHbEMsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFO2tHQUlyQixlQUFlO3NCQUF2QixLQUFLO2dCQUdJLFVBQVU7c0JBQW5CLE1BQU07Z0JBR0csU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1CdWlsZGVyLCBGb3JtR3JvdXAsIFZhbGlkYXRvcnMgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBEeW5hbWljU2VsZWN0RmllbGRDb25maWcsIFNlbGVjdE9wdGlvbiB9IGZyb20gJy4uLy4uL2R5bmFtaWMtc2VsZWN0L2R5bmFtaWMtc2VsZWN0LWZpZWxkLmNvbXBvbmVudCc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ3VzdG9tQ29kZUZvcm1EYXRhIHtcbiAgbGFuZ3VhZ2U6IHN0cmluZztcbiAgY29kZTogc3RyaW5nO1xuICBtZXRhZGF0YT86IHN0cmluZztcbiAgZGVzY3JpcHRpb24/OiBzdHJpbmc7XG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NxYS1zdGVwLWJ1aWxkZXItY3VzdG9tLWNvZGUnLFxuICB0ZW1wbGF0ZVVybDogJy4vc3RlcC1idWlsZGVyLWN1c3RvbS1jb2RlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbXSxcbiAgaG9zdDogeyBjbGFzczogJ2NxYS11aS1yb290JyB9XG59KVxuZXhwb3J0IGNsYXNzIFN0ZXBCdWlsZGVyQ3VzdG9tQ29kZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIC8qKiBPcHRpb25zIGZvciBsYW5ndWFnZSBkcm9wZG93biAqL1xuICBASW5wdXQoKSBsYW5ndWFnZU9wdGlvbnM6IFNlbGVjdE9wdGlvbltdID0gW107XG5cbiAgLyoqIEVtaXQgd2hlbiBzdGVwIGlzIGNyZWF0ZWQgKi9cbiAgQE91dHB1dCgpIGNyZWF0ZVN0ZXAgPSBuZXcgRXZlbnRFbWl0dGVyPEN1c3RvbUNvZGVGb3JtRGF0YT4oKTtcblxuICAvKiogRW1pdCB3aGVuIGNhbmNlbGxlZCAqL1xuICBAT3V0cHV0KCkgY2FuY2VsbGVkID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuXG4gIGN1c3RvbUNvZGVGb3JtOiBGb3JtR3JvdXA7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBmYjogRm9ybUJ1aWxkZXIpIHtcbiAgICB0aGlzLmN1c3RvbUNvZGVGb3JtID0gdGhpcy5mYi5ncm91cCh7XG4gICAgICBsYW5ndWFnZTogWycnLCBWYWxpZGF0b3JzLnJlcXVpcmVkXSxcbiAgICAgIGNvZGU6IFsnJywgVmFsaWRhdG9ycy5yZXF1aXJlZF0sXG4gICAgICBtZXRhZGF0YTogWycnXSxcbiAgICAgIGRlc2NyaXB0aW9uOiBbJyddXG4gICAgfSk7XG4gIH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICAvLyBDb21wb25lbnQgaW5pdGlhbGl6YXRpb25cbiAgfVxuXG4gIGdldExhbmd1YWdlQ29uZmlnKCk6IER5bmFtaWNTZWxlY3RGaWVsZENvbmZpZyB7XG4gICAgcmV0dXJuIHtcbiAgICAgIGtleTogJ2xhbmd1YWdlJyxcbiAgICAgIHBsYWNlaG9sZGVyOiAnLi4uJyxcbiAgICAgIG11bHRpcGxlOiBmYWxzZSxcbiAgICAgIHNlYXJjaGFibGU6IGZhbHNlLFxuICAgICAgb3B0aW9uczogdGhpcy5sYW5ndWFnZU9wdGlvbnNcbiAgICB9O1xuICB9XG5cbiAgb25DYW5jZWwoKTogdm9pZCB7XG4gICAgdGhpcy5jYW5jZWxsZWQuZW1pdCgpO1xuICB9XG5cbiAgb25DcmVhdGVTdGVwKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmN1c3RvbUNvZGVGb3JtLnZhbGlkKSB7XG4gICAgICBjb25zdCBmb3JtVmFsdWUgPSB0aGlzLmN1c3RvbUNvZGVGb3JtLnZhbHVlO1xuICAgICAgY29uc3Qgc3RlcERhdGE6IEN1c3RvbUNvZGVGb3JtRGF0YSA9IHtcbiAgICAgICAgbGFuZ3VhZ2U6IGZvcm1WYWx1ZS5sYW5ndWFnZSB8fCAnJyxcbiAgICAgICAgY29kZTogZm9ybVZhbHVlLmNvZGUgfHwgJycsXG4gICAgICAgIG1ldGFkYXRhOiBmb3JtVmFsdWUubWV0YWRhdGEgfHwgJycsXG4gICAgICAgIGRlc2NyaXB0aW9uOiBmb3JtVmFsdWUuZGVzY3JpcHRpb24gfHwgJydcbiAgICAgIH07XG4gICAgICB0aGlzLmNyZWF0ZVN0ZXAuZW1pdChzdGVwRGF0YSk7XG4gICAgfVxuICB9XG59XG5cbiIsIjxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZmxleC1jb2wgY3FhLWJnLXdoaXRlIGNxYS1weC00IGNxYS1weS0yXCI+XG4gIDwhLS0gSGVhZGVyIC0tPlxuICA8aDIgY2xhc3M9XCJjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtc2VtaWJvbGQgY3FhLXRleHQtYmxhY2stMTAwIGNxYS1tYi00XCI+XG4gICAgQ3VzdG9tIENvZGUgU3RlcFxuICA8L2gyPlxuXG4gIDxkaXYgY2xhc3M9XCJjcWEtZmxleCBjcWEtZmxleC1jb2wgY3FhLWZsZXgtMSBjcWEtbWF4LWgtWzUwMHB4XSBjcWEtb3ZlcmZsb3cteS1hdXRvXCI+XG4gICAgPCEtLSBMYW5ndWFnZSBEcm9wZG93biAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLW1iLTNcIj5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS1sZWFkaW5nLVsxMDAlXSBjcWEtYmxvY2sgY3FhLXRleHQtWzEycHhdIGNxYS1mb250LW1lZGl1bSBjcWEtdGV4dC1bIzE2MTYxN10gY3FhLW1iLTFcIj5cbiAgICAgICAgTGFuZ3VhZ2VcbiAgICAgIDwvbGFiZWw+XG4gICAgICA8Y3FhLWR5bmFtaWMtc2VsZWN0IGNsYXNzPVwiY3FhLXctZnVsbFwiIFtmb3JtXT1cImN1c3RvbUNvZGVGb3JtXCIgW2NvbmZpZ109XCJnZXRMYW5ndWFnZUNvbmZpZygpXCI+XG4gICAgICA8L2NxYS1keW5hbWljLXNlbGVjdD5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gQ29kZSBUZXh0YXJlYSAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3FhLW1iLTNcIj5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImNxYS10ZXh0LVsxMnB4XSBjcWEtZm9udC1tZWRpdW0gY3FhLXRleHQtWyMxNjE2MTddIGNxYS1tYi0xIGNxYS1ibG9ja1wiPlxuICAgICAgICBDb2RlXG4gICAgICA8L2xhYmVsPlxuICAgICAgPGNxYS1jdXN0b20tdGV4dGFyZWFcbiAgICAgICAgY2xhc3M9XCJjcWEtc3RlcC1idWlsZGVyLWN1c3RvbS1jb2RlLXRleHRhcmVhXCJcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cIicvLyBXcml0ZSB5b3VyIGNvZGUgaGVyZS4uLidcIlxuICAgICAgICBbdmFsdWVdPVwiY3VzdG9tQ29kZUZvcm0uZ2V0KCdjb2RlJyk/LnZhbHVlXCJcbiAgICAgICAgW2Z1bGxXaWR0aF09XCJ0cnVlXCJcbiAgICAgICAgW3Jvd3NdPVwiNFwiXG4gICAgICAgICh2YWx1ZUNoYW5nZSk9XCJjdXN0b21Db2RlRm9ybS5nZXQoJ2NvZGUnKT8uc2V0VmFsdWUoJGV2ZW50KVwiPlxuICAgICAgPC9jcWEtY3VzdG9tLXRleHRhcmVhPlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS1mbGV4LXdyYXAgY3FhLWN1c3RvbS1mb3JtLWZpZWxkc1wiPlxuICAgICAgPCEtLSBNZXRhZGF0YSBJbnB1dCAtLT5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtbWItMiBjcWEtdy0xLzIgY3FhLXByLTJcIj5cbiAgICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS1ibG9jayBjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LVsjMTYxNjE3XSBjcWEtbWItMVwiPlxuICAgICAgICAgIE1ldGFkYXRhXG4gICAgICAgIDwvbGFiZWw+XG4gICAgICAgIDxjcWEtY3VzdG9tLWlucHV0XG4gICAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidUZXh0IElucHV0J1wiXG4gICAgICAgICAgW3ZhbHVlXT1cImN1c3RvbUNvZGVGb3JtLmdldCgnbWV0YWRhdGEnKT8udmFsdWVcIlxuICAgICAgICAgIFtmdWxsV2lkdGhdPVwidHJ1ZVwiXG4gICAgICAgICAgKHZhbHVlQ2hhbmdlKT1cImN1c3RvbUNvZGVGb3JtLmdldCgnbWV0YWRhdGEnKT8uc2V0VmFsdWUoJGV2ZW50KVwiPlxuICAgICAgICA8L2NxYS1jdXN0b20taW5wdXQ+XG4gICAgICA8L2Rpdj5cblxuICAgICAgPCEtLSBEZXNjcmlwdGlvbiBJbnB1dCAtLT5cbiAgICAgIDxkaXYgY2xhc3M9XCJjcWEtdy0xLzIgY3FhLXBsLTJcIj5cbiAgICAgICAgPGxhYmVsIGNsYXNzPVwiY3FhLWxlYWRpbmctWzEwMCVdIGNxYS1ibG9jayBjcWEtdGV4dC1bMTJweF0gY3FhLWZvbnQtbWVkaXVtIGNxYS10ZXh0LVsjMTYxNjE3XSBjcWEtbWItMVwiPlxuICAgICAgICAgIERlc2NyaXB0aW9uXG4gICAgICAgIDwvbGFiZWw+XG4gICAgICAgIDxjcWEtY3VzdG9tLWlucHV0XG4gICAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidUZXh0IElucHV0J1wiXG4gICAgICAgICAgW3ZhbHVlXT1cImN1c3RvbUNvZGVGb3JtLmdldCgnZGVzY3JpcHRpb24nKT8udmFsdWVcIlxuICAgICAgICAgIFtmdWxsV2lkdGhdPVwidHJ1ZVwiXG4gICAgICAgICAgKHZhbHVlQ2hhbmdlKT1cImN1c3RvbUNvZGVGb3JtLmdldCgnZGVzY3JpcHRpb24nKT8uc2V0VmFsdWUoJGV2ZW50KVwiPlxuICAgICAgICA8L2NxYS1jdXN0b20taW5wdXQ+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG5cbiAgPCEtLSBBY3Rpb24gQnV0dG9ucyAtLT5cbiAgPGRpdiBjbGFzcz1cImNxYS1mbGV4IGNxYS13LWZ1bGwgY3FhLWdhcC0yIGNxYS1tdC1hdXRvIGNxYS1wdC00IGNxYS1ib3JkZXItdCBjcWEtYm9yZGVyLWdyYXktMjAwXCI+XG4gICAgPGNxYS1idXR0b24gY2xhc3M9XCJjcWEtdy0xLzIgY3FhLXJvdW5kZWQtWzEwcHhdXCIgdmFyaWFudD1cIm91dGxpbmVkXCIgdGV4dD1cIkNhbmNlbFwiIFtjdXN0b21DbGFzc109XCInY3FhLWZsZXgtMSBjcWEtdy1mdWxsJ1wiXG4gICAgICAoY2xpY2tlZCk9XCJvbkNhbmNlbCgpXCI+XG4gICAgPC9jcWEtYnV0dG9uPlxuICAgIDxjcWEtYnV0dG9uIGNsYXNzPVwiY3FhLWJvcmRlci1zb2xpZCBjcWEtcm91bmRlZC1bOXB4XSBjcWEtdy0xLzIgY3FhLWJvcmRlciBjcWEtYm9yZGVyLVsjM0Y0M0VFXVwiIHZhcmlhbnQ9XCJmaWxsZWRcIiB0ZXh0PVwiQ3JlYXRlIFN0ZXBcIiBbY3VzdG9tQ2xhc3NdPVwiJ2NxYS1mbGV4LTEgY3FhLXctZnVsbCdcIlxuICAgICAgKGNsaWNrZWQpPVwib25DcmVhdGVTdGVwKClcIj5cbiAgICA8L2NxYS1idXR0b24+XG4gIDwvZGl2PlxuPC9kaXY+XG5cbiJdfQ==

package/esm2020/lib/step-builder/step-builder-database/step-builder-database.component.mjs

@@ -179,7 +179,7 @@ export class StepBuilderDatabaseComponent {
     }
 }
 StepBuilderDatabaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderDatabaseComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-StepBuilderDatabaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: StepBuilderDatabaseComponent, selector: "cqa-step-builder-database", inputs: { dbEnvironmentOptions: "dbEnvironmentOptions", queries: "queries", queryResults: "queryResults", isLoading: "isLoading" }, outputs: { createStep: "createStep", cancelled: "cancelled", runQuery: "runQuery", addQuery: "addQuery", deleteQuery: "deleteQuery" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-flex-col cqa-h-full cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Create Database Test Step\n  </h2>\n\n  <!-- DB Environment Section -->\n  <div class=\"cqa-flex cqa-items-start cqa-gap-4 cqa-mb-6\">\n    <div class=\"cqa-flex-1\">\n      <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n        DB Environment <span class=\"cqa-text-red-500\">*</span>\n      </label>\n      <cqa-dynamic-select\n        [form]=\"databaseForm\"\n        [config]=\"getDbEnvironmentConfig()\">\n      </cqa-dynamic-select>\n      <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n        Uses Database environments from Environments.\n      </p>\n    </div>\n    <div class=\"cqa-flex cqa-items-end cqa-mb-1\">\n      <cqa-button\n        variant=\"filled\"\n        text=\"Run Query\"\n        [customClass]=\"'cqa-whitespace-nowrap'\"\n        (clicked)=\"onRunQuery()\"\n        [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n      </cqa-button>\n    </div>\n  </div>\n\n  <!-- Main Content: Two Column Layout -->\n  <div class=\"cqa-flex cqa-gap-4 cqa-flex-1 cqa-overflow-hidden cqa-mb-6\">\n    <!-- Left Panel: Query List -->\n    <div class=\"cqa-w-64 cqa-flex-shrink-0 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Queries</h3>\n      </div>\n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-2\">\n        <div *ngFor=\"let query of queries; let i = index\"\n             class=\"cqa-flex cqa-items-center cqa-justify-between cqa-p-2 cqa-rounded cqa-cursor-pointer cqa-mb-1\"\n             [class.cqa-bg-blue-50]=\"selectedQueryIndex === i\"\n             [class.cqa-border]=\"selectedQueryIndex === i\"\n             [class.cqa-border-blue-500]=\"selectedQueryIndex === i\"\n             (click)=\"onSelectQuery(i)\">\n          <span class=\"cqa-text-sm cqa-font-medium cqa-text-gray-900\">Query {{ i + 1 }}</span>\n          <cqa-badge\n            *ngIf=\"query.status\"\n            [label]=\"query.status === 'passed' ? 'Passed' : query.status === 'failed' ? 'Failed' : 'Pending'\"\n            [variant]=\"query.status === 'passed' ? 'success' : query.status === 'failed' ? 'error' : 'default'\"\n            size=\"small\">\n          </cqa-badge>\n        </div>\n      </div>\n    </div>\n\n    <!-- Right Panel: Query Editor -->\n    <div class=\"cqa-flex-1 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query & Store Response</h3>\n      </div>\n      \n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-4 cqa-flex cqa-flex-col cqa-gap-4\">\n        <!-- SQL Query Textarea -->\n        <div class=\"cqa-flex-1 cqa-flex cqa-flex-col\">\n          <cqa-custom-textarea\n            [placeholder]=\"'Enter your SQL query here...'\"\n            [value]=\"getCurrentQueryFormGroup()?.get('query')?.value || ''\"\n            [fullWidth]=\"true\"\n            [rows]=\"8\"\n            (valueChange)=\"getCurrentQueryFormGroup()?.get('query')?.setValue($event)\">\n          </cqa-custom-textarea>\n        </div>\n\n        <!-- Variable Input -->\n        <div class=\"cqa-flex cqa-gap-4\">\n          <div class=\"cqa-flex-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n              Variable\n            </label>\n            <cqa-custom-input\n              [placeholder]=\"'Variable name'\"\n              [value]=\"getCurrentQueryFormGroup()?.get('variable')?.value || ''\"\n              [fullWidth]=\"true\"\n              (valueChange)=\"getCurrentQueryFormGroup()?.get('variable')?.setValue($event)\">\n            </cqa-custom-input>\n            <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n              Use letters, numbers, underscore. No spaces. Unique per step. Case sensitive.\n            </p>\n          </div>\n        </div>\n\n        <!-- Action Buttons -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n          <cqa-button\n            variant=\"outlined\"\n            text=\"Add Query\"\n            icon=\"add\"\n            (clicked)=\"addNewQuery()\">\n          </cqa-button>\n          <button\n            type=\"button\"\n            class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-10 cqa-h-10 cqa-rounded cqa-text-gray-500 hover:cqa-text-gray-700 hover:cqa-bg-gray-100 cqa-transition-colors cqa-border cqa-border-gray-300\"\n            (click)=\"deleteQueryById(getCurrentQuery()?.id || '')\"\n            [disabled]=\"queries.length <= 1\"\n            [attr.aria-label]=\"'Delete query'\">\n            <mat-icon class=\"cqa-text-lg\">delete</mat-icon>\n          </button>\n          <cqa-button\n            variant=\"filled\"\n            text=\"Run\"\n            icon=\"play_arrow\"\n            (clicked)=\"onRunQuery()\"\n            [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n          </cqa-button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Results Section -->\n  <div class=\"cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden cqa-mb-6\">\n    <!-- Tabs -->\n    <div class=\"cqa-flex cqa-items-center cqa-border-b cqa-border-gray-200 cqa-bg-gray-50\">\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'output'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'output'\"\n        (click)=\"onTabChange('output')\">\n        Output\n      </button>\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'verification'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'verification'\"\n        (click)=\"onTabChange('verification')\">\n        Verification\n      </button>\n    </div>\n\n    <!-- Tab Content -->\n    <div class=\"cqa-p-4\">\n      <!-- Output Tab -->\n      <div *ngIf=\"selectedTab === 'output'\">\n        <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-mb-3\">\n          <h4 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query Results</h4>\n          <cqa-button\n            variant=\"text\"\n            text=\"Copy\"\n            icon=\"content_copy\"\n            [customClass]=\"'cqa-text-blue-600'\"\n            (clicked)=\"onCopyResults()\">\n          </cqa-button>\n        </div>\n        \n        <!-- Results Table -->\n        <div *ngIf=\"queryResults && queryResults.length > 0\" class=\"cqa-overflow-x-auto\">\n          <table class=\"cqa-w-full cqa-border-collapse\">\n            <thead>\n              <tr class=\"cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n                <th *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-left cqa-text-xs cqa-font-semibold cqa-text-gray-700 cqa-uppercase\">\n                  {{ key }}\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr *ngFor=\"let row of queryResults\" \n                  class=\"cqa-border-b cqa-border-gray-200 hover:cqa-bg-gray-50\">\n                <td *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-text-gray-900\">\n                  {{ row[key] }}\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n        \n        <div *ngIf=\"!queryResults || queryResults.length === 0\" \n             class=\"cqa-text-center cqa-py-8 cqa-text-gray-400 cqa-text-sm\">\n          No results yet. Run a query to see results.\n        </div>\n      </div>\n\n      <!-- Verification Tab -->\n      <div *ngIf=\"selectedTab === 'verification'\">\n        <p class=\"cqa-text-sm cqa-text-gray-600\">Verification settings will be available here.</p>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"outlined\"\n      text=\"Cancel\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"filled\"\n      text=\"Create Step\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", components: [{ type: i2.DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: i3.ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }, { type: i4.BadgeComponent, selector: "cqa-badge", inputs: ["type", "label", "icon", "iconLibrary", "variant", "size", "backgroundColor", "textColor", "borderColor", "iconBackgroundColor", "iconColor", "iconSize", "inlineStyles", "key", "value", "keyTextColor", "valueTextColor", "isLoading"] }, { type: i5.CustomTextareaComponent, selector: "cqa-custom-textarea", inputs: ["label", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "rows", "cols", "resize", "textareaInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused"] }, { type: i6.CustomInputComponent, selector: "cqa-custom-input", inputs: ["label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+StepBuilderDatabaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: StepBuilderDatabaseComponent, selector: "cqa-step-builder-database", inputs: { dbEnvironmentOptions: "dbEnvironmentOptions", queries: "queries", queryResults: "queryResults", isLoading: "isLoading" }, outputs: { createStep: "createStep", cancelled: "cancelled", runQuery: "runQuery", addQuery: "addQuery", deleteQuery: "deleteQuery" }, host: { classAttribute: "cqa-ui-root" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cqa-flex cqa-flex-col cqa-h-full cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Create Database Test Step\n  </h2>\n\n  <!-- DB Environment Section -->\n  <div class=\"cqa-flex cqa-items-start cqa-gap-4 cqa-mb-6\">\n    <div class=\"cqa-flex-1\">\n      <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n        DB Environment <span class=\"cqa-text-red-500\">*</span>\n      </label>\n      <cqa-dynamic-select\n        [form]=\"databaseForm\"\n        [config]=\"getDbEnvironmentConfig()\">\n      </cqa-dynamic-select>\n      <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n        Uses Database environments from Environments.\n      </p>\n    </div>\n    <div class=\"cqa-flex cqa-items-end cqa-mb-1\">\n      <cqa-button\n        variant=\"filled\"\n        text=\"Run Query\"\n        [customClass]=\"'cqa-whitespace-nowrap'\"\n        (clicked)=\"onRunQuery()\"\n        [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n      </cqa-button>\n    </div>\n  </div>\n\n  <!-- Main Content: Two Column Layout -->\n  <div class=\"cqa-flex cqa-gap-4 cqa-flex-1 cqa-overflow-hidden cqa-mb-6\">\n    <!-- Left Panel: Query List -->\n    <div class=\"cqa-w-64 cqa-flex-shrink-0 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Queries</h3>\n      </div>\n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-2\">\n        <div *ngFor=\"let query of queries; let i = index\"\n             class=\"cqa-flex cqa-items-center cqa-justify-between cqa-p-2 cqa-rounded cqa-cursor-pointer cqa-mb-1\"\n             [class.cqa-bg-blue-50]=\"selectedQueryIndex === i\"\n             [class.cqa-border]=\"selectedQueryIndex === i\"\n             [class.cqa-border-blue-500]=\"selectedQueryIndex === i\"\n             (click)=\"onSelectQuery(i)\">\n          <span class=\"cqa-text-sm cqa-font-medium cqa-text-gray-900\">Query {{ i + 1 }}</span>\n          <cqa-badge\n            *ngIf=\"query.status\"\n            [label]=\"query.status === 'passed' ? 'Passed' : query.status === 'failed' ? 'Failed' : 'Pending'\"\n            [variant]=\"query.status === 'passed' ? 'success' : query.status === 'failed' ? 'error' : 'default'\"\n            size=\"small\">\n          </cqa-badge>\n        </div>\n      </div>\n    </div>\n\n    <!-- Right Panel: Query Editor -->\n    <div class=\"cqa-flex-1 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query & Store Response</h3>\n      </div>\n      \n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-4 cqa-flex cqa-flex-col cqa-gap-4\">\n        <!-- SQL Query Textarea -->\n        <div class=\"cqa-flex-1 cqa-flex cqa-flex-col\">\n          <cqa-custom-textarea\n            [placeholder]=\"'Enter your SQL query here...'\"\n            [value]=\"getCurrentQueryFormGroup()?.get('query')?.value || ''\"\n            [fullWidth]=\"true\"\n            [rows]=\"8\"\n            (valueChange)=\"getCurrentQueryFormGroup()?.get('query')?.setValue($event)\">\n          </cqa-custom-textarea>\n        </div>\n\n        <!-- Variable Input -->\n        <div class=\"cqa-flex cqa-gap-4\">\n          <div class=\"cqa-flex-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n              Variable\n            </label>\n            <cqa-custom-input\n              [placeholder]=\"'Variable name'\"\n              [value]=\"getCurrentQueryFormGroup()?.get('variable')?.value || ''\"\n              [fullWidth]=\"true\"\n              (valueChange)=\"getCurrentQueryFormGroup()?.get('variable')?.setValue($event)\">\n            </cqa-custom-input>\n            <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n              Use letters, numbers, underscore. No spaces. Unique per step. Case sensitive.\n            </p>\n          </div>\n        </div>\n\n        <!-- Action Buttons -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n          <cqa-button\n            variant=\"outlined\"\n            text=\"Add Query\"\n            icon=\"add\"\n            (clicked)=\"addNewQuery()\">\n          </cqa-button>\n          <button\n            type=\"button\"\n            class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-10 cqa-h-10 cqa-rounded cqa-text-gray-500 hover:cqa-text-gray-700 hover:cqa-bg-gray-100 cqa-transition-colors cqa-border cqa-border-gray-300\"\n            (click)=\"deleteQueryById(getCurrentQuery()?.id || '')\"\n            [disabled]=\"queries.length <= 1\"\n            [attr.aria-label]=\"'Delete query'\">\n            <mat-icon class=\"cqa-text-lg\">delete</mat-icon>\n          </button>\n          <cqa-button\n            variant=\"filled\"\n            text=\"Run\"\n            icon=\"play_arrow\"\n            (clicked)=\"onRunQuery()\"\n            [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n          </cqa-button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Results Section -->\n  <div class=\"cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden cqa-mb-6\">\n    <!-- Tabs -->\n    <div class=\"cqa-flex cqa-items-center cqa-border-b cqa-border-gray-200 cqa-bg-gray-50\">\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'output'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'output'\"\n        (click)=\"onTabChange('output')\">\n        Output\n      </button>\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'verification'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'verification'\"\n        (click)=\"onTabChange('verification')\">\n        Verification\n      </button>\n    </div>\n\n    <!-- Tab Content -->\n    <div class=\"cqa-p-4\">\n      <!-- Output Tab -->\n      <div *ngIf=\"selectedTab === 'output'\">\n        <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-mb-3\">\n          <h4 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query Results</h4>\n          <cqa-button\n            variant=\"text\"\n            text=\"Copy\"\n            icon=\"content_copy\"\n            [customClass]=\"'cqa-text-blue-600'\"\n            (clicked)=\"onCopyResults()\">\n          </cqa-button>\n        </div>\n        \n        <!-- Results Table -->\n        <div *ngIf=\"queryResults && queryResults.length > 0\" class=\"cqa-overflow-x-auto\">\n          <table class=\"cqa-w-full cqa-border-collapse\">\n            <thead>\n              <tr class=\"cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n                <th *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-left cqa-text-xs cqa-font-semibold cqa-text-gray-700 cqa-uppercase\">\n                  {{ key }}\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr *ngFor=\"let row of queryResults\" \n                  class=\"cqa-border-b cqa-border-gray-200 hover:cqa-bg-gray-50\">\n                <td *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-text-gray-900\">\n                  {{ row[key] }}\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n        \n        <div *ngIf=\"!queryResults || queryResults.length === 0\" \n             class=\"cqa-text-center cqa-py-8 cqa-text-gray-400 cqa-text-sm\">\n          No results yet. Run a query to see results.\n        </div>\n      </div>\n\n      <!-- Verification Tab -->\n      <div *ngIf=\"selectedTab === 'verification'\">\n        <p class=\"cqa-text-sm cqa-text-gray-600\">Verification settings will be available here.</p>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"outlined\"\n      text=\"Cancel\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"filled\"\n      text=\"Create Step\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", components: [{ type: i2.DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore"] }, { type: i3.ButtonComponent, selector: "cqa-button", inputs: ["variant", "btnSize", "disabled", "icon", "iconPosition", "fullWidth", "iconColor", "type", "text", "customClass", "inlineStyles", "tooltip", "tooltipPosition"], outputs: ["clicked"] }, { type: i4.BadgeComponent, selector: "cqa-badge", inputs: ["type", "label", "icon", "iconLibrary", "variant", "size", "backgroundColor", "textColor", "borderColor", "iconBackgroundColor", "iconColor", "iconSize", "inlineStyles", "key", "value", "keyTextColor", "valueTextColor", "isLoading"] }, { type: i5.CustomTextareaComponent, selector: "cqa-custom-textarea", inputs: ["label", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "rows", "cols", "resize", "textareaInlineStyle", "labelInlineStyle", "customClass"], outputs: ["valueChange", "blurred", "focused"] }, { type: i6.CustomInputComponent, selector: "cqa-custom-input", inputs: ["label", "type", "placeholder", "value", "disabled", "errors", "required", "ariaLabel", "size", "fullWidth", "maxLength", "showCharCount", "inputInlineStyle", "labelInlineStyle"], outputs: ["valueChange", "blurred", "focused", "enterPressed"] }, { type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: StepBuilderDatabaseComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cqa-step-builder-database', host: { class: 'cqa-ui-root' }, template: "<div class=\"cqa-flex cqa-flex-col cqa-h-full cqa-bg-white cqa-px-4 cqa-py-2\">\n  <!-- Header -->\n  <h2 class=\"cqa-text-[12px] cqa-font-semibold cqa-text-black-100 cqa-mb-4\">\n    Create Database Test Step\n  </h2>\n\n  <!-- DB Environment Section -->\n  <div class=\"cqa-flex cqa-items-start cqa-gap-4 cqa-mb-6\">\n    <div class=\"cqa-flex-1\">\n      <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n        DB Environment <span class=\"cqa-text-red-500\">*</span>\n      </label>\n      <cqa-dynamic-select\n        [form]=\"databaseForm\"\n        [config]=\"getDbEnvironmentConfig()\">\n      </cqa-dynamic-select>\n      <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n        Uses Database environments from Environments.\n      </p>\n    </div>\n    <div class=\"cqa-flex cqa-items-end cqa-mb-1\">\n      <cqa-button\n        variant=\"filled\"\n        text=\"Run Query\"\n        [customClass]=\"'cqa-whitespace-nowrap'\"\n        (clicked)=\"onRunQuery()\"\n        [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n      </cqa-button>\n    </div>\n  </div>\n\n  <!-- Main Content: Two Column Layout -->\n  <div class=\"cqa-flex cqa-gap-4 cqa-flex-1 cqa-overflow-hidden cqa-mb-6\">\n    <!-- Left Panel: Query List -->\n    <div class=\"cqa-w-64 cqa-flex-shrink-0 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Queries</h3>\n      </div>\n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-2\">\n        <div *ngFor=\"let query of queries; let i = index\"\n             class=\"cqa-flex cqa-items-center cqa-justify-between cqa-p-2 cqa-rounded cqa-cursor-pointer cqa-mb-1\"\n             [class.cqa-bg-blue-50]=\"selectedQueryIndex === i\"\n             [class.cqa-border]=\"selectedQueryIndex === i\"\n             [class.cqa-border-blue-500]=\"selectedQueryIndex === i\"\n             (click)=\"onSelectQuery(i)\">\n          <span class=\"cqa-text-sm cqa-font-medium cqa-text-gray-900\">Query {{ i + 1 }}</span>\n          <cqa-badge\n            *ngIf=\"query.status\"\n            [label]=\"query.status === 'passed' ? 'Passed' : query.status === 'failed' ? 'Failed' : 'Pending'\"\n            [variant]=\"query.status === 'passed' ? 'success' : query.status === 'failed' ? 'error' : 'default'\"\n            size=\"small\">\n          </cqa-badge>\n        </div>\n      </div>\n    </div>\n\n    <!-- Right Panel: Query Editor -->\n    <div class=\"cqa-flex-1 cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden\">\n      <div class=\"cqa-p-3 cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n        <h3 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query & Store Response</h3>\n      </div>\n      \n      <div class=\"cqa-flex-1 cqa-overflow-y-auto cqa-p-4 cqa-flex cqa-flex-col cqa-gap-4\">\n        <!-- SQL Query Textarea -->\n        <div class=\"cqa-flex-1 cqa-flex cqa-flex-col\">\n          <cqa-custom-textarea\n            [placeholder]=\"'Enter your SQL query here...'\"\n            [value]=\"getCurrentQueryFormGroup()?.get('query')?.value || ''\"\n            [fullWidth]=\"true\"\n            [rows]=\"8\"\n            (valueChange)=\"getCurrentQueryFormGroup()?.get('query')?.setValue($event)\">\n          </cqa-custom-textarea>\n        </div>\n\n        <!-- Variable Input -->\n        <div class=\"cqa-flex cqa-gap-4\">\n          <div class=\"cqa-flex-1\">\n            <label class=\"cqa-text-sm cqa-font-medium cqa-text-gray-700 cqa-mb-1.5 cqa-block\">\n              Variable\n            </label>\n            <cqa-custom-input\n              [placeholder]=\"'Variable name'\"\n              [value]=\"getCurrentQueryFormGroup()?.get('variable')?.value || ''\"\n              [fullWidth]=\"true\"\n              (valueChange)=\"getCurrentQueryFormGroup()?.get('variable')?.setValue($event)\">\n            </cqa-custom-input>\n            <p class=\"cqa-text-xs cqa-text-gray-500 cqa-mt-1\">\n              Use letters, numbers, underscore. No spaces. Unique per step. Case sensitive.\n            </p>\n          </div>\n        </div>\n\n        <!-- Action Buttons -->\n        <div class=\"cqa-flex cqa-items-center cqa-gap-2\">\n          <cqa-button\n            variant=\"outlined\"\n            text=\"Add Query\"\n            icon=\"add\"\n            (clicked)=\"addNewQuery()\">\n          </cqa-button>\n          <button\n            type=\"button\"\n            class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-10 cqa-h-10 cqa-rounded cqa-text-gray-500 hover:cqa-text-gray-700 hover:cqa-bg-gray-100 cqa-transition-colors cqa-border cqa-border-gray-300\"\n            (click)=\"deleteQueryById(getCurrentQuery()?.id || '')\"\n            [disabled]=\"queries.length <= 1\"\n            [attr.aria-label]=\"'Delete query'\">\n            <mat-icon class=\"cqa-text-lg\">delete</mat-icon>\n          </button>\n          <cqa-button\n            variant=\"filled\"\n            text=\"Run\"\n            icon=\"play_arrow\"\n            (clicked)=\"onRunQuery()\"\n            [disabled]=\"!databaseForm.get('dbEnvironment')?.value || isLoading\">\n          </cqa-button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Results Section -->\n  <div class=\"cqa-flex cqa-flex-col cqa-border cqa-border-gray-200 cqa-rounded-lg cqa-overflow-hidden cqa-mb-6\">\n    <!-- Tabs -->\n    <div class=\"cqa-flex cqa-items-center cqa-border-b cqa-border-gray-200 cqa-bg-gray-50\">\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'output'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'output'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'output'\"\n        (click)=\"onTabChange('output')\">\n        Output\n      </button>\n      <button\n        type=\"button\"\n        class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-font-medium cqa-transition-colors cqa-border-b-2\"\n        [class.cqa-text-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-border-blue-600]=\"selectedTab === 'verification'\"\n        [class.cqa-text-gray-600]=\"selectedTab !== 'verification'\"\n        [class.cqa-border-transparent]=\"selectedTab !== 'verification'\"\n        (click)=\"onTabChange('verification')\">\n        Verification\n      </button>\n    </div>\n\n    <!-- Tab Content -->\n    <div class=\"cqa-p-4\">\n      <!-- Output Tab -->\n      <div *ngIf=\"selectedTab === 'output'\">\n        <div class=\"cqa-flex cqa-items-center cqa-justify-between cqa-mb-3\">\n          <h4 class=\"cqa-text-sm cqa-font-semibold cqa-text-gray-900\">Query Results</h4>\n          <cqa-button\n            variant=\"text\"\n            text=\"Copy\"\n            icon=\"content_copy\"\n            [customClass]=\"'cqa-text-blue-600'\"\n            (clicked)=\"onCopyResults()\">\n          </cqa-button>\n        </div>\n        \n        <!-- Results Table -->\n        <div *ngIf=\"queryResults && queryResults.length > 0\" class=\"cqa-overflow-x-auto\">\n          <table class=\"cqa-w-full cqa-border-collapse\">\n            <thead>\n              <tr class=\"cqa-bg-gray-50 cqa-border-b cqa-border-gray-200\">\n                <th *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-left cqa-text-xs cqa-font-semibold cqa-text-gray-700 cqa-uppercase\">\n                  {{ key }}\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr *ngFor=\"let row of queryResults\" \n                  class=\"cqa-border-b cqa-border-gray-200 hover:cqa-bg-gray-50\">\n                <td *ngFor=\"let key of getTableColumns()\" \n                    class=\"cqa-px-4 cqa-py-2 cqa-text-sm cqa-text-gray-900\">\n                  {{ row[key] }}\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n        \n        <div *ngIf=\"!queryResults || queryResults.length === 0\" \n             class=\"cqa-text-center cqa-py-8 cqa-text-gray-400 cqa-text-sm\">\n          No results yet. Run a query to see results.\n        </div>\n      </div>\n\n      <!-- Verification Tab -->\n      <div *ngIf=\"selectedTab === 'verification'\">\n        <p class=\"cqa-text-sm cqa-text-gray-600\">Verification settings will be available here.</p>\n      </div>\n    </div>\n  </div>\n\n  <!-- Action Buttons -->\n  <div class=\"cqa-flex cqa-w-full cqa-gap-2 cqa-mt-auto cqa-pt-4 cqa-border-t cqa-border-gray-200\">\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"outlined\"\n      text=\"Cancel\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCancel()\">\n    </cqa-button>\n    <cqa-button\n      class=\"cqa-w-1/2\"\n      variant=\"filled\"\n      text=\"Create Step\"\n      [customClass]=\"'cqa-flex-1 cqa-w-full'\"\n      (clicked)=\"onCreateStep()\">\n    </cqa-button>\n  </div>\n</div>\n\n", styles: [] }]