ngx-t-forms 2.0.23 → 2.0.25

package/fesm2022/ngx-t-forms-pipeline-generator.component-T4_0xqeE.mjs

@@ -1,727 +0,0 @@
-import * as i2 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, Component, inject, Injectable, ElementRef, ViewChild, HostBinding, Optional, Self } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { Subscription, debounceTime, BehaviorSubject, switchMap, map, take, catchError, finalize, throwError, tap, combineLatest, filter, Subject, takeUntil, distinctUntilChanged } from 'rxjs';
-import PipelineBuilder from 'db-aggregation-pipeline-builder';
-import { M as MatModulesModule, N as NGX_T_FORMS_CONFIG_TOKEN, b as TDynamicDataViewComponent, D as DaysAgoPipe } from './ngx-t-forms-ngx-t-forms-BYmto56R.mjs';
-import * as i5 from '@angular/material/icon';
-import * as i1$1 from '@angular/material/autocomplete';
-import * as i2$1 from '@angular/material/button';
-import * as i3 from '@angular/material/card';
-import * as i4 from '@angular/material/divider';
-import * as i3$1 from '@angular/material/select';
-import * as i8 from '@angular/material/tooltip';
-import { TWorkflowPickerComponent } from './ngx-t-forms-t-workflow-picker.component-C1t8oH9s.mjs';
-import { MatFormFieldControl } from '@angular/material/form-field';
-import { HttpClient } from '@angular/common/http';
-import * as i11 from '@angular/cdk/overlay';
-import { OverlayModule } from '@angular/cdk/overlay';
-import * as i5$1 from '@angular/material/expansion';
-import * as i6 from '@angular/material/list';
-import * as i7 from '@angular/material/progress-spinner';
-import * as i9 from '@angular/material/toolbar';
-
-class JsonEditorComponent {
-    constructor(fb) {
-        this.fb = fb;
-        this.subscriptions = new Subscription();
-        this.valueChange = new EventEmitter();
-        this.jsonText = ''; // Placeholder for the JSON text
-        this.errorMessage = null;
-        this.jsonForm = this.fb.group({
-            jsonText: ['', Validators.required]
-        });
-        this.init();
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-    }
-    ngOnChanges(changes) {
-        if (changes['value'] && changes['value'].currentValue !== this._value) {
-            this._value = changes['value'].currentValue;
-            this.parseAndBeautifyJson(this._value, true);
-        }
-    }
-    init() {
-        this.subscriptions.add(this.jsonForm.get('jsonText').valueChanges
-            .pipe(debounceTime(1000))
-            .subscribe(value => {
-            this.parseAndBeautifyJson(value);
-        }));
-    }
-    parseAndBeautifyJson(value, hardSet) {
-        try {
-            // Attempt to parse the JSON
-            const parsedJson = typeof value === 'object' && value !== null ? value : JSON.parse(value);
-            // If valid, beautify the JSON
-            const beautifiedJson = JSON.stringify(parsedJson, null, 4);
-            // Update form control value with beautified JSON
-            const form = this.jsonForm.get('jsonText');
-            if (!form) {
-                this.errorMessage = 'Form control not found.';
-                return;
-            }
-            // Set beautified JSON without emitting another change event
-            form.setValue(beautifiedJson, { emitEvent: false });
-            this.errorMessage = null;
-            this.valueChange.emit({ value: parsedJson, valid: true });
-        }
-        catch (error) {
-            if (error instanceof SyntaxError) {
-                // Extract the position of the error from the error message
-                const errorMessage = this.getDetailedJsonError(value, error.message);
-                this.errorMessage = `JSON Syntax Error: ${errorMessage}`;
-            }
-            else {
-                this.errorMessage = 'Unexpected error occurred while parsing JSON.';
-            }
-            if (hardSet) {
-                console.log('hardset', value);
-                this.jsonForm.get('jsonText')?.setValue(value, { emitEvent: false });
-            }
-            this.valueChange.emit({ value: value, valid: false });
-        }
-    }
-    // Function to give detailed JSON error information
-    getDetailedJsonError(value, message) {
-        const positionMatch = message.match(/position (\d+)/);
-        if (!!positionMatch?.[1]) {
-            const position = parseInt(positionMatch[1], 10);
-            const excerpt = this.getErrorExcerpt(value, position);
-            return `at position ${position}: near "${excerpt}". Check for missing commas, brackets, or quotes.`;
-        }
-        return message;
-    }
-    // Helper function to extract a portion of the string around the error position
-    getErrorExcerpt(value, position, excerptLength = 20) {
-        const start = Math.max(0, position - excerptLength);
-        const end = Math.min(value.length, position + excerptLength);
-        return value.substring(start, end);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: JsonEditorComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: JsonEditorComponent, isStandalone: true, selector: "app-json-editor", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"json-editor-container\">\n  <div *ngIf=\"jsonForm.invalid\" \n  style=\"margin-top: 16px;\"\n  class=\"tree-instructions\">\n    <mat-icon class=\"info-icon\" color=\"primary\">info</mat-icon>\n    <span> Paste or type JSON below. The editor will auto-beautify the text.</span>\n  </div>\n\n\n  \n  <!-- Error message if JSON is invalid -->\n  <div *ngIf=\"errorMessage\" \n  \n  style=\"\" class=\"tree-instructions json-error \">\n    <span>  {{errorMessage}}</span>\n  </div>\n \n  <form [formGroup]=\"jsonForm\">\n    <textarea\n    formControlName=\"jsonText\"\n    class=\"json-textarea\"\n    [class.error-message]=\"errorMessage\"\n    rows=\"15\"\n    placeholder=\"Enter your JSON here...\"></textarea>\n  </form>\n  <!-- JSON Textarea -->\n\n</div>\n", styles: [".json-editor-container{max-width:800px;margin:0 auto;border-radius:5px}.json-editor-container h1{font-size:24px;color:#333}.json-editor-container .lead{font-size:.9 rem;margin-bottom:10px;padding-left:16px}.json-editor-container .json-textarea{width:calc(100% - 24px);padding:12px;font-size:14px;color:#333;background-color:#fff;border:1px solid #ccc;border-radius:5px;font-family:Courier New,Courier,monospace}.json-editor-container .json-textarea:focus{outline:none;border-color:var(--ion-color-primary)}.error-message{border:solid 1px #e74c3c!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;border-radius:4px;margin-bottom:0;background:azure}.json-error{background:inherit;color:#e74c3c;margin-bottom:4px}.info-icon{width:38px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: JsonEditorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-json-editor', standalone: true, imports: [
-                        CommonModule,
-                        MatModulesModule,
-                        FormsModule,
-                        ReactiveFormsModule
-                    ], template: "<div class=\"json-editor-container\">\n  <div *ngIf=\"jsonForm.invalid\" \n  style=\"margin-top: 16px;\"\n  class=\"tree-instructions\">\n    <mat-icon class=\"info-icon\" color=\"primary\">info</mat-icon>\n    <span> Paste or type JSON below. The editor will auto-beautify the text.</span>\n  </div>\n\n\n  \n  <!-- Error message if JSON is invalid -->\n  <div *ngIf=\"errorMessage\" \n  \n  style=\"\" class=\"tree-instructions json-error \">\n    <span>  {{errorMessage}}</span>\n  </div>\n \n  <form [formGroup]=\"jsonForm\">\n    <textarea\n    formControlName=\"jsonText\"\n    class=\"json-textarea\"\n    [class.error-message]=\"errorMessage\"\n    rows=\"15\"\n    placeholder=\"Enter your JSON here...\"></textarea>\n  </form>\n  <!-- JSON Textarea -->\n\n</div>\n", styles: [".json-editor-container{max-width:800px;margin:0 auto;border-radius:5px}.json-editor-container h1{font-size:24px;color:#333}.json-editor-container .lead{font-size:.9 rem;margin-bottom:10px;padding-left:16px}.json-editor-container .json-textarea{width:calc(100% - 24px);padding:12px;font-size:14px;color:#333;background-color:#fff;border:1px solid #ccc;border-radius:5px;font-family:Courier New,Courier,monospace}.json-editor-container .json-textarea:focus{outline:none;border-color:var(--ion-color-primary)}.error-message{border:solid 1px #e74c3c!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;border-radius:4px;margin-bottom:0;background:azure}.json-error{background:inherit;color:#e74c3c;margin-bottom:4px}.info-icon{width:38px}\n"] }]
-        }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { value: [{
-                type: Input
-            }], valueChange: [{
-                type: Output
-            }] } });
-
-class AggregateStageEditorComponent {
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
-    }
-    constructor() {
-        this.subscription = new Subscription();
-        this.isRunningPipeline = false;
-        this.saveStage = new EventEmitter();
-        this.deleteStage = new EventEmitter();
-        this.activeStage = undefined; // Define the type appropriately if possible
-        this.allowedStages = [];
-    }
-    ngOnInit() {
-        // Debounce the config change to optimize performance
-        this.allowedStages = PipelineBuilder.getViewOnlyStages();
-    }
-    handleChange(event) {
-        const selectedStage = event.value;
-        if (this.activeStage === undefined) {
-            this.activeStage = {
-                stage: selectedStage,
-                ...this.selectedStage || {},
-            };
-        }
-        else {
-            this.activeStage = {
-                config: this.activeStage?.config || this.selectedStage?.config,
-                stage: selectedStage
-            };
-        }
-        { }
-        if (this.activeStage?.config && !!this.activeStage?.stage) {
-            this.validateConfig();
-        }
-    }
-    handleConfigChange(event) {
-        if (!this.activeStage) {
-            this.activeStage = {
-                ...this.selectedStage || {},
-            };
-        }
-        this.activeStage = {
-            stage: this.activeStage?.stage || this.selectedStage?.name,
-            config: event.value
-        };
-        this.validateConfig();
-    }
-    validateConfig() {
-        this.configValidationError = undefined;
-        const { config, stage } = this.activeStage || {};
-        // Check if config and stage are defined
-        if (!config && config !== 0 || !stage) {
-            console.error('Config or stage is not defined', config, stage);
-            this.activeStage.valid = false;
-            return; // Early exit if validation fails
-        }
-        try {
-            const valid = PipelineBuilder.validateStageConfig(stage, config);
-            this.activeStage.valid = valid;
-            // Set error message if config is invalid
-            if (!valid) {
-                this.configValidationError = undefined;
-                return;
-            }
-        }
-        catch (error) {
-            // Catch and handle errors from validation
-            this.configValidationError = error.message || JSON.stringify(error) || 'An unknown error occurred';
-            this.activeStage.valid = false;
-            console.error('Validation Error:', this.configValidationError);
-        }
-    }
-    canSaveConfig() {
-        return !!this.activeStage && !this.configValidationError;
-    }
-    saveConfiguration() {
-        // Logic for saving the configuration
-        if (this.canSaveConfig()) {
-            this.saveStage.emit(this.activeStage);
-        }
-    }
-    trackByStage(index, stage) {
-        return stage.stage;
-    }
-    get allowedStageNames() {
-        return this.allowedStages.map(stage => stage.stage);
-    }
-    get activeDescription() {
-        return this.allowedStages.find(stage => stage.stage === this.activeStage?.stage)?.description;
-    }
-    deleteActive() {
-        this.deleteStage.emit();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AggregateStageEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AggregateStageEditorComponent, isStandalone: true, selector: "app-aggregate-stage-editor", inputs: { selectedStage: "selectedStage", isRunningPipeline: "isRunningPipeline" }, outputs: { saveStage: "saveStage", deleteStage: "deleteStage" }, ngImport: i0, template: "<mat-card style=\"margin-bottom:8px\">\n  <mat-card-content>\n\n    <h5>\n      Aggregate Pipeline Stage Configuration\n    </h5>\n\n\n\n    <mat-form-field style=\"  margin-bottom: 8px;\" appearance=\"outline\" subscriptSizing=\"dynamic\" >\n      <mat-label>Select Aggregate Stage</mat-label>\n      <mat-select matNativeControl [value]=\"selectedStage?.name\" (selectionChange)=\"handleChange($event)\"\n        placeholder=\"ChooseFunctionToRun\">\n        <mat-option *ngFor=\"let stage of allowedStages; trackBy: trackByStage\" [value]=\"stage.stage\">\n          {{stage.stage}}</mat-option>\n\n\n\n      </mat-select>\n      <mat-hint>\n        {{activeDescription ?\n        'Hover over the info icon to view stage details .'\n        : 'Please select an aggregation function from the list.'}}\n      </mat-hint>\n      <mat-hint *ngIf=\"activeDescription\" align=\"end\">\n        <mat-icon matTooltipHideDelay=\"1000\" [matTooltip]=\"activeDescription\" matSuffix>info</mat-icon>\n      </mat-hint>\n    </mat-form-field>\n\n\n\n    <div class=\"tree-instructions\" style=\"background: cornsilk;\" *ngIf=\"configValidationError\">\n      <mat-icon style=\"margin-top: 4px;margin-bottom:auto\" class=\"info-icon\" color=\"warn\">warning</mat-icon>\n      <span>{{ configValidationError }}</span>\n    </div>\n\n\n\n\n\n    <div class=\"config-container\" *ngIf=\"activeStage ||selectedStage?.config\">\n      <app-json-editor [value]=\"selectedStage?.config\" (valueChange)=\"handleConfigChange($event)\"></app-json-editor>\n    </div>\n\n    <br>\n\n\n\n  </mat-card-content>\n  <mat-divider>\n  </mat-divider>\n  <mat-card-actions>\n\n    <span class=\"spacer\"></span>\n    <button  color=\"warn\" [disabled]=\"isRunningPipeline\" mat-button (click)=\"deleteActive()\">\n      Delete\n      <mat-icon >delete</mat-icon>\n    </button>\n    <button style=\"margin-left:8px;\" color=\"primary\" mat-flat-button (click)=\"saveConfiguration()\"\n      [disabled]=\"isRunningPipeline ||!activeStage?.valid \">\n      Save\n      <mat-icon> save</mat-icon>\n    </button>\n  </mat-card-actions>\n</mat-card>", styles: [".title-icon{margin-right:8px;vertical-align:middle}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:var(--mdc-elevated-card-container-color, var(--mat-app-surface-container-low));border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}mat-form-field{min-width:100%;background:azure}.stageDescription{background:azure}.stage-button-container{display:flex;gap:4px;width:fit-content;align-items:center}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px;margin:8px auto auto}\n"], dependencies: [{ kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i1$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: JsonEditorComponent, selector: "app-json-editor", inputs: ["value"], outputs: ["valueChange"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AggregateStageEditorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-aggregate-stage-editor', standalone: true, imports: [
-                        MatModulesModule,
-                        CommonModule,
-                        FormsModule,
-                        JsonEditorComponent
-                    ], template: "<mat-card style=\"margin-bottom:8px\">\n  <mat-card-content>\n\n    <h5>\n      Aggregate Pipeline Stage Configuration\n    </h5>\n\n\n\n    <mat-form-field style=\"  margin-bottom: 8px;\" appearance=\"outline\" subscriptSizing=\"dynamic\" >\n      <mat-label>Select Aggregate Stage</mat-label>\n      <mat-select matNativeControl [value]=\"selectedStage?.name\" (selectionChange)=\"handleChange($event)\"\n        placeholder=\"ChooseFunctionToRun\">\n        <mat-option *ngFor=\"let stage of allowedStages; trackBy: trackByStage\" [value]=\"stage.stage\">\n          {{stage.stage}}</mat-option>\n\n\n\n      </mat-select>\n      <mat-hint>\n        {{activeDescription ?\n        'Hover over the info icon to view stage details .'\n        : 'Please select an aggregation function from the list.'}}\n      </mat-hint>\n      <mat-hint *ngIf=\"activeDescription\" align=\"end\">\n        <mat-icon matTooltipHideDelay=\"1000\" [matTooltip]=\"activeDescription\" matSuffix>info</mat-icon>\n      </mat-hint>\n    </mat-form-field>\n\n\n\n    <div class=\"tree-instructions\" style=\"background: cornsilk;\" *ngIf=\"configValidationError\">\n      <mat-icon style=\"margin-top: 4px;margin-bottom:auto\" class=\"info-icon\" color=\"warn\">warning</mat-icon>\n      <span>{{ configValidationError }}</span>\n    </div>\n\n\n\n\n\n    <div class=\"config-container\" *ngIf=\"activeStage ||selectedStage?.config\">\n      <app-json-editor [value]=\"selectedStage?.config\" (valueChange)=\"handleConfigChange($event)\"></app-json-editor>\n    </div>\n\n    <br>\n\n\n\n  </mat-card-content>\n  <mat-divider>\n  </mat-divider>\n  <mat-card-actions>\n\n    <span class=\"spacer\"></span>\n    <button  color=\"warn\" [disabled]=\"isRunningPipeline\" mat-button (click)=\"deleteActive()\">\n      Delete\n      <mat-icon >delete</mat-icon>\n    </button>\n    <button style=\"margin-left:8px;\" color=\"primary\" mat-flat-button (click)=\"saveConfiguration()\"\n      [disabled]=\"isRunningPipeline ||!activeStage?.valid \">\n      Save\n      <mat-icon> save</mat-icon>\n    </button>\n  </mat-card-actions>\n</mat-card>", styles: [".title-icon{margin-right:8px;vertical-align:middle}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:var(--mdc-elevated-card-container-color, var(--mat-app-surface-container-low));border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}mat-form-field{min-width:100%;background:azure}.stageDescription{background:azure}.stage-button-container{display:flex;gap:4px;width:fit-content;align-items:center}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px;margin:8px auto auto}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { selectedStage: [{
-                type: Input
-            }], isRunningPipeline: [{
-                type: Input
-            }], saveStage: [{
-                type: Output
-            }], deleteStage: [{
-                type: Output
-            }] } });
-
-class PipelineService {
-    constructor() {
-        //LOADING INDICATORS
-        this.isRunningPipeline = false;
-        this.aiIsGeneratingPipeline = false;
-        this.isLoadingAllowedStages = false;
-        this.isLoadingWorkflowSchema = false;
-        //States 
-        this.workflowId$ = new BehaviorSubject(undefined);
-        this.activeStage$ = new BehaviorSubject(undefined);
-        this.prompt$ = new BehaviorSubject(undefined);
-        this.schemaLoadError$ = new BehaviorSubject(undefined);
-        this.pipeline$ = new BehaviorSubject([]);
-        this.threadId$ = new BehaviorSubject(undefined);
-        this.schema$ = new BehaviorSubject(undefined);
-        this.allowedStages$ = new BehaviorSubject([]);
-        this.pipeLineResult$ = new BehaviorSubject([]);
-        this.chatHistory$ = new BehaviorSubject([]);
-        this.http = inject(HttpClient);
-        //Set local storage threadId
-        const threadId = localStorage.getItem('threadId');
-        if (threadId) {
-            this.threadId$.next(threadId);
-        }
-    }
-    get config$() {
-        return this.workflowId$.pipe(switchMap(workflowId => this.pipeline$.pipe(switchMap(pipeline => this.pipeLineResult$.pipe(map(responseBody => ({ workflowId, pipeline, responseBody })))))));
-    }
-    /**
-     * Fetch available pipeline stages for the user to select and generate pipelines.
-     * Ideally, this could be static or fetched from a backend.
-     */
-    runPipeLine(pipeline, workflowId) {
-        const url = "http://localhost:5000/api/v1/pipelineBuilder/runPipeline";
-        // For now, returning a static list of pipeline stages. In a real application, you can fetch from an API.
-        this.isRunningPipeline = true;
-        return this.http.post(url, { pipeline, workflowId }).pipe(take(1), catchError(this.handleError), // Error handling for the HTTP request,
-        finalize(() => this.isRunningPipeline = false));
-    }
-    /**
-     * Generate a MongoDB pipeline based on the given user prompt.
-     *
-     * @param prompt The user's input or description of the desired pipeline.
-     */
-    generatePipeline(query, schema, threadId, existingPipeline, previousError) {
-        if (!schema) {
-            throw new Error("Schema is required");
-        }
-        const payload = { query, schema, threadId, existingPipeline, previousError };
-        const url = "http://localhost:5000/api/v1/pipelineBuilder/generatePipeline";
-        this.aiIsGeneratingPipeline = true;
-        return this.http.post(`${url}`, payload)
-            .pipe(take(1), catchError(this.handleError), // Error handling for the HTTP request,
-        finalize(() => this.aiIsGeneratingPipeline = false));
-    }
-    /**
-     * Handle any errors from the HTTP request.
-     *
-     * @param error The error response from the HTTP request
-     */
-    handleError(error) {
-        console.error('An error occurred', error);
-        // Return an observable with a user-facing error message
-        return throwError(() => new Error('Something went wrong with the pipeline generation; please try again later.'));
-    }
-    getSchema(workflowId) {
-        if (!workflowId) {
-            throw new Error("WorkflowId is required");
-        }
-        const url = "http://localhost:5000/api/v1/pipelineBuilder/getSchema";
-        return this.http.get(`${url}`, { params: { workflowId: workflowId } }).pipe(take(1), catchError(this.handleError) // Error handling for the HTTP request
-        );
-    }
-    /** OPERATIONS */
-    isSchemaEmpty(object) {
-    }
-    workflowChanged(event) {
-        this.workflowId$.next(event);
-        if (!event) {
-            return;
-        }
-        this.getSchema(event).pipe(take(1), tap(({ schema }) => {
-            this.schema$.next(schema);
-            const isEmptySchema = Object.keys(schema)[0] === "" && Object.values(schema)[0] === "Array<>";
-            const error = isEmptySchema
-                ? "Document schema is missing. Please ensure at least one document exists for the selected workflow."
-                : undefined;
-            this.schemaLoadError$.next(error);
-            console.log("Workflow schema loaded,run pipeline");
-            this.runActivePipeline();
-        }), catchError((error) => {
-            this.schemaLoadError$.next("Error loading schema");
-            return this.handleError(error);
-        })).subscribe();
-    }
-    setActiveStage(i) {
-        const index = this.activeStage$.getValue();
-        if (index === i) {
-            this.activeStage$.next(undefined);
-            return;
-        }
-        this.activeStage$.next(i);
-    }
-    addStage() {
-        const newPipeline = this.pipeline$.getValue().concat({});
-        this.pipeline$.next(newPipeline);
-    }
-    onTextChange(event) {
-        this.prompt$.next(event);
-        console.log(event);
-    }
-    promptSubmit() {
-        // Use combineLatest to fetch the latest values from multiple sources
-        combineLatest([this.schema$, this.threadId$, this.pipeline$, this.prompt$, this.chatHistory$])
-            .pipe(take(1), tap(([schema, threadId, pipeline, prompt, history]) => {
-            if (!schema || !prompt) {
-                console.warn(`Missing values: schema ${schema} prompt ${prompt}`);
-            }
-        }), filter(([schema, , , prompt]) => !!schema && !!prompt), switchMap(([schema, threadId, pipeline, prompt, history]) => {
-            // Use a shallow copy of the pipeline
-            const previousError = history[history.length - 1]?.assistance?.error;
-            const pipelineCopy = pipeline.map(stage => JSON.parse(JSON.stringify(stage))) || [];
-            console.info('Generating pipeline with prompt:', prompt, 'schema:', schema, 'threadId:', threadId, 'pipeline:', pipeline);
-            return this.generatePipeline(prompt, schema, threadId, pipelineCopy, previousError).pipe(map((response) => ({ ...response, history, prompt })));
-        }), tap((response) => {
-            const { pipeline, threadId, history, prompt } = response;
-            const historyRecord = {
-                user: prompt,
-                assistance: response,
-                date: new Date()
-            };
-            // Use next with a concatenated value for chat history
-            this.chatHistory$.next([...(history || []), historyRecord]);
-            this.pipeline$.next(pipeline);
-            this.threadId$.next(threadId);
-            // Store threadID locally
-            localStorage.setItem('threadId', threadId);
-            // Run the active pipeline after all state updates are complete
-            console.log("prompt submitted run pipeline");
-            this.runActivePipeline();
-        }), catchError((error) => {
-            console.error('Error response:', error.message || error);
-            return this.handleError(error);
-        })).subscribe();
-    }
-    runActivePipeline() {
-        const pipeline = [...(this.pipeline$.getValue().map(stage => (JSON.parse(JSON.stringify(stage)))) || [])];
-        const someAreNotValid = pipeline.some(stage => Object.keys(stage).length === 0);
-        if (pipeline.length === 0 || someAreNotValid) {
-            return;
-        }
-        try {
-            PipelineBuilder.validatePipeline(pipeline);
-        }
-        catch (error) {
-            console.error(error, pipeline);
-            return;
-        }
-        const workflowId = this.workflowId$.getValue();
-        if (!workflowId) {
-            return;
-        }
-        this.runPipeLine(pipeline, workflowId).pipe(take(1), tap(({ results }) => {
-            this.pipeLineResult$.next(results);
-        }), catchError((error) => {
-            console.error('Error response:', error);
-            const err = JSON.parse(JSON.stringify(error));
-            const errorMessage = err.error;
-            if (errorMessage) {
-                this.pipelineErrorLogAndRetry(errorMessage);
-            }
-            return this.handleError(error);
-        })).subscribe();
-    }
-    pipelineErrorLogAndRetry(message) {
-        const history = this.chatHistory$.getValue();
-        const prompt = this.prompt$.getValue();
-        const historyRecord = {
-            user: prompt,
-            assistance: {
-                message
-            },
-            date: new Date()
-        };
-        this.chatHistory$.next([...(history || []), historyRecord]);
-    }
-    get activeStage() {
-        return this.pipeline$.asObservable().pipe(switchMap(pipeline => this.activeStage$.pipe(map(activeIndex => activeIndex === undefined ? undefined : {
-            name: Object.keys(pipeline[activeIndex] || {})[0] || '',
-            config: pipeline[activeIndex][Object.keys(pipeline[activeIndex] || {})?.[0] || '']
-        }))));
-    }
-    saveStage(index, stage) {
-        const pipeline = this.pipeline$.getValue();
-        if (index === undefined) {
-            return;
-        }
-        const newPipeline = pipeline.map((s, i) => {
-            if (i === index) {
-                return stage ? {
-                    [stage.stage]: stage.config
-                } : s;
-            }
-            return s;
-        });
-        console.log("newPipeline", newPipeline);
-        this.pipeline$.next(newPipeline);
-        this.activeStage$.next(undefined);
-        console.log("stage saved run pipeline");
-        this.runActivePipeline();
-    }
-    deleteStage(index) {
-        const pipeline = this.pipeline$.getValue();
-        if (index === undefined) {
-            return;
-        }
-        const newPipeline = pipeline.filter((s, i) => i !== index);
-        console.log("newPipeline", newPipeline);
-        this.pipeline$.next(newPipeline);
-        this.activeStage$.next(undefined);
-        console.log("stage deleted run pipeline");
-        this.runActivePipeline();
-    }
-    get pipelineGeneralValid() {
-        return this.pipeline$.asObservable().pipe(map(pipeline => {
-            const allHaveTypes = pipeline.every(stage => Object.keys(stage).length === 1);
-            if (!allHaveTypes) {
-                return {
-                    valid: false,
-                    message: "All stages must be a valid pipeline stage"
-                };
-            }
-            const AllStagesMustHaveConfig = pipeline.every((stage) => stage[Object.keys(stage)?.[0] || ''] !== undefined);
-            if (!AllStagesMustHaveConfig) {
-                return {
-                    valid: false,
-                    message: "All stages must have a configuration"
-                };
-            }
-            return {
-                valid: true
-            };
-        }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PipelineService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PipelineService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PipelineService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class PipelineGeneratorComponent {
-    static { this.nextId = 0; }
-    constructor(ngControl, _elementRef) {
-        this.ngControl = ngControl;
-        this._elementRef = _elementRef;
-        this.stateChanges = new Subject();
-        this.NGX_T_FORMS_CONFIG = inject(NGX_T_FORMS_CONFIG_TOKEN);
-        this.id = `app-pipeline-generator-${PipelineGeneratorComponent.nextId++}`;
-        this.placeholder = '';
-        this.focused = false;
-        this.required = false;
-        this.disabled = false;
-        this.touched = false;
-        this.onTouched = () => { };
-        this.valueChanged = new EventEmitter();
-        this.errors = [];
-        this.destroy$ = new Subject();
-        this.pipeline = new PipelineService();
-        this.initiated = false;
-        this.initiateSubscription = () => {
-            this.pipeline.config$.pipe(takeUntil(this.destroy$), distinctUntilChanged((prev, curr) => JSON.stringify(prev) === JSON.stringify(curr))).subscribe(config => {
-                if (!this.initiated) {
-                    this.initiated = true;
-                    return;
-                }
-                const newConfig = {
-                    ...this._value,
-                    ...config,
-                    "source": "mongoPipeline",
-                };
-                console.log('Pipeline config changed', newConfig);
-                this.valueChanged.emit(newConfig);
-            });
-        };
-        this.cursorPosition = 0;
-        this.showSuggestions = false;
-        this.optionsSearch = '';
-        this.trackById = (index, stage) => index;
-    }
-    get empty() {
-        return !this.value;
-    }
-    get shouldLabelFloat() {
-        return this.focused || !this.empty;
-    }
-    get errorState() {
-        const hasError = !!this.ngControl?.control?.errors || (this.errors || []).length > 0 && this.touched;
-        return !this.value && !!this.required || hasError;
-    }
-    setDescribedByIds(ids) {
-        // Ensure the component view is initialized
-        if (this._elementRef && this._elementRef.nativeElement) {
-            const controlElement = this._elementRef.nativeElement.querySelector('.app-pipeline-generator');
-            // Check if the controlElement exists before attempting to set its attribute
-            if (controlElement) {
-                controlElement.setAttribute('aria-describedby', ids.join(' '));
-            }
-        }
-    }
-    onContainerClick(event) {
-        this.markAsTouched();
-        this.stateChanges.next();
-    }
-    markAsTouched() {
-        console.log('markAsTouched');
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    set value(value) {
-        const workflowIdChanged = this._value?.workflowId !== value?.workflowId;
-        const pipelineLengthChanged = this._value?.pipeline?.length !== value?.pipeline?.length;
-        const pipeLineContentChanged = JSON.stringify(this._value?.pipeline) !== JSON.stringify(value?.pipeline);
-        if (workflowIdChanged || pipelineLengthChanged || pipeLineContentChanged) {
-            this._value = value;
-            if (value?.workflowId) {
-                this.workflowChanged(value?.workflowId);
-            }
-            console.log('Pipeline value changed', value, this.pipeline.pipeline$.value);
-            if (value?.pipeline) {
-                this.pipeline.pipeline$.next(value?.pipeline || []);
-            }
-        }
-    }
-    set getWorkflowOptions(options$) {
-        this.workflows$ = options$;
-    }
-    ngOnInit() {
-        this.initiateSubscription();
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    workflowChanged(event) {
-        this.pipeline.workflowChanged(event);
-    }
-    get workflowId() {
-        return this.pipeline.workflowId$.asObservable();
-    }
-    get stages() {
-        return this.pipeline.pipeline$.asObservable().pipe(map(stages => stages.map(stage => ({
-            name: Object.keys(stage)[0],
-            stage: Object.keys(stage)[0],
-            config: stage[Object.keys(stage)?.[0] || ''],
-            valid: !!Object.keys(stage)[0] && !!stage[Object.keys(stage)?.[0] || '']
-        }))));
-    }
-    get pipeLineResults() {
-        return this.pipeline.pipeLineResult$.asObservable();
-    }
-    get prompt() {
-        return this.pipeline.prompt$.asObservable();
-    }
-    get aiIsGeneratingPipeline() {
-        return this.pipeline.aiIsGeneratingPipeline;
-    }
-    get activeStageIndex() {
-        return this.pipeline.activeStage$.asObservable();
-    }
-    get activeStage() {
-        console.log(this.pipeline.activeStage);
-        return this.pipeline.activeStage;
-    }
-    get isRunningPipeline() {
-        return this.pipeline.isRunningPipeline;
-    }
-    get cannotAddStage() {
-        return this.pipeline.pipelineGeneralValid.pipe(map(valid => !valid));
-    }
-    get schemaLoadError$() {
-        return this.pipeline.schemaLoadError$.asObservable();
-    }
-    get chatHistory() {
-        return this.pipeline.chatHistory$.asObservable();
-    }
-    onTextChange(event) {
-        if (!this.textareaElementRef?.nativeElement) {
-            return;
-        }
-        console.log('onTextChange', event);
-        const newValue = event.target.value;
-        const textarea = this.textareaElementRef.nativeElement;
-        this.cursorPosition = textarea.selectionStart || 0;
-        const lastChar = newValue[this.cursorPosition - 1];
-        const match = newValue.slice(0, this.cursorPosition).match(/\$(\w*)$/);
-        if (lastChar === '$' || (match && match[1] !== undefined)) {
-            this.showSuggestions = true;
-            this.optionsSearch = match ? match?.[1] || '' : '';
-        }
-        else {
-            this.showSuggestions = false;
-            this.optionsSearch = '';
-        }
-        this.pipeline.onTextChange(newValue);
-    }
-    selectSuggestionInput(suggestion) {
-        this.pipeline.prompt$.asObservable().pipe(take(1), tap(prompt => {
-            const match = prompt?.slice(0, this.cursorPosition).match(/\$(\w*)$/);
-            const beforeCursor = prompt?.slice(0, match ? match.index : this.cursorPosition - 1);
-            const afterCursor = prompt?.slice(this.cursorPosition);
-            prompt = beforeCursor + suggestion + ' ' + afterCursor;
-            this.pipeline.prompt$.next(prompt);
-            this.applyNewValueToPrompt(suggestion);
-        })).subscribe();
-    }
-    applyNewValueToPrompt(suggestion) {
-        this.showSuggestions = false;
-        const textarea = this.textareaElementRef.nativeElement;
-        textarea.focus();
-        const newCursorPosition = this.cursorPosition + suggestion.length;
-        setTimeout(() => {
-            textarea.setSelectionRange(newCursorPosition, newCursorPosition);
-        }, 0);
-    }
-    onSearchChange(event) {
-        this.optionsSearch = event.detail.value;
-    }
-    promptSubmit() {
-        this.pipeline.promptSubmit();
-        console.log('promptSubmit');
-    }
-    setActiveStage(index) {
-        this.pipeline.setActiveStage(index);
-    }
-    addStage() {
-        this.pipeline.addStage();
-    }
-    get getSchemaProperties() {
-        return this.pipeline.schema$.asObservable().pipe(map(schema => Object.keys(schema || {}).map(key => ({ label: key, value: key, })).filter(key => this.optionsSearch ? key.label.toLowerCase().includes(this.optionsSearch.toLowerCase()) : true)));
-    }
-    deleteStage(index) {
-        this.pipeline.deleteStage(index);
-    }
-    saveStage(index, stage) {
-        this.pipeline.saveStage(index, stage);
-        this.setActiveStage(undefined);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PipelineGeneratorComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: PipelineGeneratorComponent, isStandalone: true, selector: "app-pipeline-generator", inputs: { disabled: "disabled", value: "value", getWorkflowOptions: "getWorkflowOptions", userName: "userName", errors: "errors" }, outputs: { valueChanged: "valueChanged" }, host: { properties: { "id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: PipelineGeneratorComponent }], viewQueries: [{ propertyName: "textareaElementRef", first: true, predicate: ["textarea"], descendants: true, read: ElementRef }], ngImport: i0, template: "\n\n\n<section class=\"ion-margin\">\n  <p>MongoDB aggregation pipeline builder for selected workflows. </p>\n</section>\n<lib-t-workflow-picker \n(valueChanged)=\"workflowChanged($event)\" \n[getWorkflowOptions]=\" workflows$\"\n  [value]=\"(workflowId|async)||undefined\">\n</lib-t-workflow-picker>\n<mat-accordion multi *ngIf=\"workflowId|async\">\n  <!-- Pipeline Accordion -->\n  <mat-expansion-panel value=\"pipeline\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner color=\"accent\" *ngIf=\"isRunningPipeline\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">\n          dynamic_form\n        </mat-icon>\n        {{isRunningPipeline?'Executing current Data pipeline...':'Data retrieval pipeline'}}\n      </mat-panel-title>\n\n    </mat-expansion-panel-header>\n    <div class=\"content\">\n      <!-- Mongodb aggregate pipelione stages management  and edit start-->\n      <div *ngIf=\"((stages | async)?.length || 0) ===0\" class=\"tree-instructions\">\n        <mat-icon class=\"info-icon\" color=\"primary\">info</mat-icon>\n        <span>\n          Add stages to the pipeline below.<br>\n          Each stage processes input documents by filtering, grouping, or calculating values. The output documents from\n          one stage are passed to the next stage in the pipeline.\n        </span>\n      </div>\n\n      <mat-nav-list style=\"    background: var(--mat-tree-container-background-color);padding:0px;border-radius:8px\">\n\n\n        <ng-container *ngFor=\"let stage of stages | async; trackBy: trackById;index as $index;last as isLast\">\n          <mat-list-item [style.margin-top]=\"(activeStageIndex|async) ===$index?'4px':'0px'\"\n            [class.mat-elevation-z8]=\"(activeStageIndex|async) ===$index\" class=\"stage-item\"\n            (click)=\"setActiveStage($index)\" [activated]=\" (activeStageIndex|async) ===$index\">\n            <span class=\"stage-index\" matListItemAvatar>{{$index + 1}} </span>\n            <div matListItemTitle>\n              <div style=\"line-height: normal;\">\n                {{ stage.name || 'Stage ' }}\n              </div>\n              <div class=\"stage-inner-message\" *ngIf=\"!stage.name && (activeStageIndex|async) !==$index \">\n                Incomplete , click to edit\n              </div>\n\n            </div>\n\n            <button *ngIf=\"(activeStageIndex|async) ===$index||!stage.valid && (activeStageIndex|async) !==$index\"\n              mat-icon-button matListItemMeta>\n              <mat-icon color=\"primary\" *ngIf=\"(activeStageIndex|async) ===$index\">check_circle</mat-icon>\n\n              <mat-icon color=\"warn\" *ngIf=\"!stage.valid && (activeStageIndex|async) !==$index\">\n                warning\n              </mat-icon>\n            </button>\n          </mat-list-item>\n          <mat-divider></mat-divider>\n\n          <app-aggregate-stage-editor [selectedStage]=\"stage\" [isRunningPipeline]=\"isRunningPipeline\"\n            (deleteStage)=\"deleteStage($index)\" (saveStage)=\"saveStage($index,$event)\"\n            *ngIf=\"(activeStageIndex|async) ===$index\"></app-aggregate-stage-editor>\n\n\n        </ng-container>\n\n        <mat-toolbar style=\"padding: 0px;\">\n\n          <span class=\"spacer\"></span>\n          <button class=\"stage-button\" [disabled]=\"isRunningPipeline\" color=\"primary\" (click)=\"addStage()\"\n            mat-raised-button>\n            Add\n            <mat-icon>add</mat-icon>\n          </button>\n        </mat-toolbar>\n      </mat-nav-list>\n\n      <!-- Mongodb aggregate pipelione stages management  and edit end -->\n    </div>\n  </mat-expansion-panel>\n\n  <!-- Results Accordion -->\n  <mat-expansion-panel value=\"results\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner color=\"accent\" *ngIf=\"isRunningPipeline\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">dataset</mat-icon>\n        {{isRunningPipeline?'Running pipeline...':'Data Results'}}\n      </mat-panel-title>\n    </mat-expansion-panel-header>\n    <div class=\"content\">\n      <ng-container *ngIf=\"pipeLineResults | async as results; else noResults\">\n\n        <lib-t-dynamic-data-view *ngIf=\"results\" [data]=\"results\"></lib-t-dynamic-data-view>\n        <p *ngIf=\"!results\" color=\"medium\">\n\n          No results available\n\n        </p>\n\n      </ng-container>\n      <ng-template #noResults>\n        <p color=\"medium\">No results available</p>\n      </ng-template>\n    </div>\n  </mat-expansion-panel>\n\n  <!-- AI Agent Accordion -->\n  <mat-expansion-panel value=\"ai\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner *ngIf=\" aiIsGeneratingPipeline \" style=\"position: absolute;\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">tips_and_updates</mat-icon>\n        {{ aiIsGeneratingPipeline ? 'Agent busy ...' : 'AI AGENT prompt' }}\n      </mat-panel-title>\n    </mat-expansion-panel-header>\n\n    <div class=\"content\">\n      @if( schemaLoadError$ | async){\n        <div class=\"tree-instructions\" style=\"background: antiquewhite !important;\">\n          <mat-icon class=\"info-icon\" color=\"warn\">error</mat-icon>\n          <span> {{ schemaLoadError$ | async }}</span>\n        </div>\n  \n      }\n      <mat-list *ngFor=\"let chat of chatHistory|async;\">\n\n        <mat-list-item class=\"chatContent chatItem\">\n          <div class=\"chat\" style=\"background:bisque;text-align:end;\n          border-radius: 18px 18px 0px 18px;\" matListItemTitle>\n            <div>\n              {{chat.user}}\n            </div>\n            <div style=\"opacity:0.6;line-height: normal;display: flex;align-items: center;justify-content: flex-end;\">\n              {{chat.date|daysAgo}}\n              <mat-icon class=\"sent-icon\">\n                done_all\n              </mat-icon>\n            </div>\n          </div>\n        </mat-list-item>\n\n        <mat-list-item style=\"margin-top: 16px;\" class=\"chatContent chatItem\" color=\"light\" lines=\"full\">\n          <mat-icon style=\"    margin-left: 0px;\n    margin-top: 16px;\n    margin-bottom: auto;\" matListItemIcon>smart_toy</mat-icon>\n          <div class=\"chat\" style=\"text-align: left; \n          padding-left: 16px;  \n    background: azure;\n    border-radius: 0px 18px 18px 18px;\" *ngIf=\"!chat.assistance?.error\" matListItemTitle>\n            <pre>\n                {{chat. assistance.pipeline |json}}\n              </pre>\n          </div>\n          <div *ngIf=\"chat.assistance?.error\" matListItemTitle>\n            {{chat.assistance.error}}\n          </div>\n        </mat-list-item>\n\n\n      </mat-list>\n      <mat-list>\n        <mat-list-item class=\"chatContent chatItem\">\n          <textarea matListItemTitle #textarea style=\"    width: calc(100% - 13px);\n    border-radius: 14px;\n    padding-right: 3px;\n    padding-left: 8px;\" class=\"chat\" [value]=\" prompt|async\" (input)=\"onTextChange($event)\"\n            placeholder=\"Provide a pipeline generation prompt\"></textarea>\n          <button matListItemMeta style=\"    margin-left: 4px;\n    margin-right: 0px;\" color=\"primary\" mat-mini-fab [disabled]=\"aiIsGeneratingPipeline\" (click)=\"promptSubmit()\">\n\n            <mat-icon style=\"margin: 0px !important;color:white\">send</mat-icon>\n            <mat-spinner color=\"accent\" *ngIf=\" aiIsGeneratingPipeline \" \n            class=\"submit-spinner\" ></mat-spinner>\n          </button>\n         \n        </mat-list-item>\n\n      </mat-list>\n\n\n      <section *ngIf=\"showSuggestions\" class=\"showSuggestionContainer\">\n        <!-- <mat-toolbar class=\"search-container\" style=\"background: inherit;\">\n\n\n          <input type=\"search\" placeholder=\"Search options\" class=\"search-field\" (change)=\"onSearchChange($event)\">\n\n          <mat-icon>\n            search\n          </mat-icon>\n        </mat-toolbar> -->\n        <mat-divider></mat-divider>\n        <div style=\"padding: 8px;\">\n          <div class=\"suggestion-container\">\n            <div class=\"suggestion-column\">\n              <h5>Collection document properties</h5>\n              <div class=\"button-container\">\n                <button *ngFor=\"let method of getSchemaProperties | async;trackBy: trackById\"\n                  (click)=\"selectSuggestionInput(method.value)\" color=\"accent\" mat-flat-button\n                  class=\"suggestion-button\">\n                  {{ method.label | titlecase }}\n                </button>\n              </div>\n            </div>\n\n          </div>\n\n\n        </div>\n      </section>\n\n\n\n\n\n\n\n    </div>\n  </mat-expansion-panel>\n</mat-accordion>\n\n\n\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOpen]=\"disabled\"\n>\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);\">\n\n\n</div>\n</ng-template>\n", styles: ["ion-card{margin:0 auto}.head{font-weight:500;font-size:.9rem;padding-left:8px}.chat{margin-top:0;padding-bottom:8px;padding-top:9px;padding-right:16px;white-space:normal;font-size:.8rem}.icon{margin-top:auto;margin-bottom:auto;margin-right:16px}.container{max-width:600px;margin:0 auto}ion-accordion-group{margin:16px}ion-icon{margin-right:16PX}.suggestion-container{display:flex;width:100%;gap:14px}.suggestion-column{flex:1;min-width:0}.button-container{display:flex;flex-wrap:wrap}.suggestion-button{height:auto;text-transform:capitalize;margin:2px;padding:8px;line-height:normal;text-align:left;font-size:.8em}h5{margin-bottom:8px;font-size:1em}mat-expansion-panel-header{padding-left:16px;padding-right:16px}mat-expansion-panel{background:var(--mat-sys-surface-container, var(--mat-app-surface))}mat-form-field{width:100%;background:azure}.chatItem{padding:0}.chatItem mat-icon{margin-left:16px;margin-right:16px}.chatContent{height:fit-content!important}.stage-button{margin:4px}.stage-index{font-size:14px;display:flex;width:28px;height:28px;justify-content:center;background:azure;align-items:center;border:solid var(--mat-divider-color, var(--mat-app-outline)) 1px}.stage-inner-message{font-size:14px;display:flex;line-height:normal;opacity:.6}.stage-item{height:54px!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}.title-icon{margin-right:8px;vertical-align:middle}.header-spinner{position:absolute;width:24px!important;height:24px!important}.sent-icon{font-size:14px;height:14px;margin-right:0!important;margin-left:0!important}.submit-spinner{position:absolute;width:40px!important;right:-8px;top:-20px;height:40px!important;--mdc-circular-progress-size: 40px !important;--mdc-circular-progress-active-indicator-width: 40px !important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.JsonPipe, name: "json" }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "component", type: TWorkflowPickerComponent, selector: "lib-t-workflow-picker", inputs: ["disabled", "errors", "required", "value", "placeholder", "getWorkflowOptions"], outputs: ["valueChange", "valueChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: TDynamicDataViewComponent, selector: "lib-t-dynamic-data-view", inputs: ["data"] }, { kind: "ngmodule", type: MatModulesModule }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i5$1.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i5$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i5$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i5$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i6.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i6.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i6.MatListItemAvatar, selector: "[matListItemAvatar]" }, { kind: "directive", type: i6.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i6.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i6.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i11.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: AggregateStageEditorComponent, selector: "app-aggregate-stage-editor", inputs: ["selectedStage", "isRunningPipeline"], outputs: ["saveStage", "deleteStage"] }, { kind: "pipe", type: DaysAgoPipe, name: "daysAgo" }, { kind: "ngmodule", type: OverlayModule }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PipelineGeneratorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-pipeline-generator', standalone: true, imports: [
-                        CommonModule,
-                        TWorkflowPickerComponent,
-                        FormsModule,
-                        TDynamicDataViewComponent,
-                        MatModulesModule,
-                        AggregateStageEditorComponent,
-                        DaysAgoPipe,
-                        OverlayModule
-                    ], providers: [{ provide: MatFormFieldControl, useExisting: PipelineGeneratorComponent }], template: "\n\n\n<section class=\"ion-margin\">\n  <p>MongoDB aggregation pipeline builder for selected workflows. </p>\n</section>\n<lib-t-workflow-picker \n(valueChanged)=\"workflowChanged($event)\" \n[getWorkflowOptions]=\" workflows$\"\n  [value]=\"(workflowId|async)||undefined\">\n</lib-t-workflow-picker>\n<mat-accordion multi *ngIf=\"workflowId|async\">\n  <!-- Pipeline Accordion -->\n  <mat-expansion-panel value=\"pipeline\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner color=\"accent\" *ngIf=\"isRunningPipeline\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">\n          dynamic_form\n        </mat-icon>\n        {{isRunningPipeline?'Executing current Data pipeline...':'Data retrieval pipeline'}}\n      </mat-panel-title>\n\n    </mat-expansion-panel-header>\n    <div class=\"content\">\n      <!-- Mongodb aggregate pipelione stages management  and edit start-->\n      <div *ngIf=\"((stages | async)?.length || 0) ===0\" class=\"tree-instructions\">\n        <mat-icon class=\"info-icon\" color=\"primary\">info</mat-icon>\n        <span>\n          Add stages to the pipeline below.<br>\n          Each stage processes input documents by filtering, grouping, or calculating values. The output documents from\n          one stage are passed to the next stage in the pipeline.\n        </span>\n      </div>\n\n      <mat-nav-list style=\"    background: var(--mat-tree-container-background-color);padding:0px;border-radius:8px\">\n\n\n        <ng-container *ngFor=\"let stage of stages | async; trackBy: trackById;index as $index;last as isLast\">\n          <mat-list-item [style.margin-top]=\"(activeStageIndex|async) ===$index?'4px':'0px'\"\n            [class.mat-elevation-z8]=\"(activeStageIndex|async) ===$index\" class=\"stage-item\"\n            (click)=\"setActiveStage($index)\" [activated]=\" (activeStageIndex|async) ===$index\">\n            <span class=\"stage-index\" matListItemAvatar>{{$index + 1}} </span>\n            <div matListItemTitle>\n              <div style=\"line-height: normal;\">\n                {{ stage.name || 'Stage ' }}\n              </div>\n              <div class=\"stage-inner-message\" *ngIf=\"!stage.name && (activeStageIndex|async) !==$index \">\n                Incomplete , click to edit\n              </div>\n\n            </div>\n\n            <button *ngIf=\"(activeStageIndex|async) ===$index||!stage.valid && (activeStageIndex|async) !==$index\"\n              mat-icon-button matListItemMeta>\n              <mat-icon color=\"primary\" *ngIf=\"(activeStageIndex|async) ===$index\">check_circle</mat-icon>\n\n              <mat-icon color=\"warn\" *ngIf=\"!stage.valid && (activeStageIndex|async) !==$index\">\n                warning\n              </mat-icon>\n            </button>\n          </mat-list-item>\n          <mat-divider></mat-divider>\n\n          <app-aggregate-stage-editor [selectedStage]=\"stage\" [isRunningPipeline]=\"isRunningPipeline\"\n            (deleteStage)=\"deleteStage($index)\" (saveStage)=\"saveStage($index,$event)\"\n            *ngIf=\"(activeStageIndex|async) ===$index\"></app-aggregate-stage-editor>\n\n\n        </ng-container>\n\n        <mat-toolbar style=\"padding: 0px;\">\n\n          <span class=\"spacer\"></span>\n          <button class=\"stage-button\" [disabled]=\"isRunningPipeline\" color=\"primary\" (click)=\"addStage()\"\n            mat-raised-button>\n            Add\n            <mat-icon>add</mat-icon>\n          </button>\n        </mat-toolbar>\n      </mat-nav-list>\n\n      <!-- Mongodb aggregate pipelione stages management  and edit end -->\n    </div>\n  </mat-expansion-panel>\n\n  <!-- Results Accordion -->\n  <mat-expansion-panel value=\"results\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner color=\"accent\" *ngIf=\"isRunningPipeline\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">dataset</mat-icon>\n        {{isRunningPipeline?'Running pipeline...':'Data Results'}}\n      </mat-panel-title>\n    </mat-expansion-panel-header>\n    <div class=\"content\">\n      <ng-container *ngIf=\"pipeLineResults | async as results; else noResults\">\n\n        <lib-t-dynamic-data-view *ngIf=\"results\" [data]=\"results\"></lib-t-dynamic-data-view>\n        <p *ngIf=\"!results\" color=\"medium\">\n\n          No results available\n\n        </p>\n\n      </ng-container>\n      <ng-template #noResults>\n        <p color=\"medium\">No results available</p>\n      </ng-template>\n    </div>\n  </mat-expansion-panel>\n\n  <!-- AI Agent Accordion -->\n  <mat-expansion-panel value=\"ai\">\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-spinner *ngIf=\" aiIsGeneratingPipeline \" style=\"position: absolute;\" class=\"header-spinner\"></mat-spinner>\n        <mat-icon class=\"title-icon\">tips_and_updates</mat-icon>\n        {{ aiIsGeneratingPipeline ? 'Agent busy ...' : 'AI AGENT prompt' }}\n      </mat-panel-title>\n    </mat-expansion-panel-header>\n\n    <div class=\"content\">\n      @if( schemaLoadError$ | async){\n        <div class=\"tree-instructions\" style=\"background: antiquewhite !important;\">\n          <mat-icon class=\"info-icon\" color=\"warn\">error</mat-icon>\n          <span> {{ schemaLoadError$ | async }}</span>\n        </div>\n  \n      }\n      <mat-list *ngFor=\"let chat of chatHistory|async;\">\n\n        <mat-list-item class=\"chatContent chatItem\">\n          <div class=\"chat\" style=\"background:bisque;text-align:end;\n          border-radius: 18px 18px 0px 18px;\" matListItemTitle>\n            <div>\n              {{chat.user}}\n            </div>\n            <div style=\"opacity:0.6;line-height: normal;display: flex;align-items: center;justify-content: flex-end;\">\n              {{chat.date|daysAgo}}\n              <mat-icon class=\"sent-icon\">\n                done_all\n              </mat-icon>\n            </div>\n          </div>\n        </mat-list-item>\n\n        <mat-list-item style=\"margin-top: 16px;\" class=\"chatContent chatItem\" color=\"light\" lines=\"full\">\n          <mat-icon style=\"    margin-left: 0px;\n    margin-top: 16px;\n    margin-bottom: auto;\" matListItemIcon>smart_toy</mat-icon>\n          <div class=\"chat\" style=\"text-align: left; \n          padding-left: 16px;  \n    background: azure;\n    border-radius: 0px 18px 18px 18px;\" *ngIf=\"!chat.assistance?.error\" matListItemTitle>\n            <pre>\n                {{chat. assistance.pipeline |json}}\n              </pre>\n          </div>\n          <div *ngIf=\"chat.assistance?.error\" matListItemTitle>\n            {{chat.assistance.error}}\n          </div>\n        </mat-list-item>\n\n\n      </mat-list>\n      <mat-list>\n        <mat-list-item class=\"chatContent chatItem\">\n          <textarea matListItemTitle #textarea style=\"    width: calc(100% - 13px);\n    border-radius: 14px;\n    padding-right: 3px;\n    padding-left: 8px;\" class=\"chat\" [value]=\" prompt|async\" (input)=\"onTextChange($event)\"\n            placeholder=\"Provide a pipeline generation prompt\"></textarea>\n          <button matListItemMeta style=\"    margin-left: 4px;\n    margin-right: 0px;\" color=\"primary\" mat-mini-fab [disabled]=\"aiIsGeneratingPipeline\" (click)=\"promptSubmit()\">\n\n            <mat-icon style=\"margin: 0px !important;color:white\">send</mat-icon>\n            <mat-spinner color=\"accent\" *ngIf=\" aiIsGeneratingPipeline \" \n            class=\"submit-spinner\" ></mat-spinner>\n          </button>\n         \n        </mat-list-item>\n\n      </mat-list>\n\n\n      <section *ngIf=\"showSuggestions\" class=\"showSuggestionContainer\">\n        <!-- <mat-toolbar class=\"search-container\" style=\"background: inherit;\">\n\n\n          <input type=\"search\" placeholder=\"Search options\" class=\"search-field\" (change)=\"onSearchChange($event)\">\n\n          <mat-icon>\n            search\n          </mat-icon>\n        </mat-toolbar> -->\n        <mat-divider></mat-divider>\n        <div style=\"padding: 8px;\">\n          <div class=\"suggestion-container\">\n            <div class=\"suggestion-column\">\n              <h5>Collection document properties</h5>\n              <div class=\"button-container\">\n                <button *ngFor=\"let method of getSchemaProperties | async;trackBy: trackById\"\n                  (click)=\"selectSuggestionInput(method.value)\" color=\"accent\" mat-flat-button\n                  class=\"suggestion-button\">\n                  {{ method.label | titlecase }}\n                </button>\n              </div>\n            </div>\n\n          </div>\n\n\n        </div>\n      </section>\n\n\n\n\n\n\n\n    </div>\n  </mat-expansion-panel>\n</mat-accordion>\n\n\n\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOpen]=\"disabled\"\n>\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);\">\n\n\n</div>\n</ng-template>\n", styles: ["ion-card{margin:0 auto}.head{font-weight:500;font-size:.9rem;padding-left:8px}.chat{margin-top:0;padding-bottom:8px;padding-top:9px;padding-right:16px;white-space:normal;font-size:.8rem}.icon{margin-top:auto;margin-bottom:auto;margin-right:16px}.container{max-width:600px;margin:0 auto}ion-accordion-group{margin:16px}ion-icon{margin-right:16PX}.suggestion-container{display:flex;width:100%;gap:14px}.suggestion-column{flex:1;min-width:0}.button-container{display:flex;flex-wrap:wrap}.suggestion-button{height:auto;text-transform:capitalize;margin:2px;padding:8px;line-height:normal;text-align:left;font-size:.8em}h5{margin-bottom:8px;font-size:1em}mat-expansion-panel-header{padding-left:16px;padding-right:16px}mat-expansion-panel{background:var(--mat-sys-surface-container, var(--mat-app-surface))}mat-form-field{width:100%;background:azure}.chatItem{padding:0}.chatItem mat-icon{margin-left:16px;margin-right:16px}.chatContent{height:fit-content!important}.stage-button{margin:4px}.stage-index{font-size:14px;display:flex;width:28px;height:28px;justify-content:center;background:azure;align-items:center;border:solid var(--mat-divider-color, var(--mat-app-outline)) 1px}.stage-inner-message{font-size:14px;display:flex;line-height:normal;opacity:.6}.stage-item{height:54px!important}.tree-instructions{display:flex;align-items:center;gap:8px;padding:12px;background:azure;border-radius:4px;margin-bottom:16px}.info-icon{min-width:38px!important;display:block}.title-icon{margin-right:8px;vertical-align:middle}.header-spinner{position:absolute;width:24px!important;height:24px!important}.sent-icon{font-size:14px;height:14px;margin-right:0!important;margin-left:0!important}.submit-spinner{position:absolute;width:40px!important;right:-8px;top:-20px;height:40px!important;--mdc-circular-progress-size: 40px !important;--mdc-circular-progress-active-indicator-width: 40px !important}\n"] }]
-        }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
-                    type: Optional
-                }, {
-                    type: Self
-                }] }, { type: i0.ElementRef }], propDecorators: { id: [{
-                type: HostBinding
-            }], disabled: [{
-                type: Input
-            }], textareaElementRef: [{
-                type: ViewChild,
-                args: ['textarea', { read: ElementRef, static: false }]
-            }], value: [{
-                type: Input
-            }], getWorkflowOptions: [{
-                type: Input
-            }], userName: [{
-                type: Input
-            }], valueChanged: [{
-                type: Output
-            }], errors: [{
-                type: Input
-            }] } });
-
-export { PipelineGeneratorComponent };
-//# sourceMappingURL=ngx-t-forms-pipeline-generator.component-T4_0xqeE.mjs.map