@memberjunction/ng-ai-test-harness 6.1.4 → 6.2.0-edge.1

package/dist/lib/agent-execution-monitor.component.js

@@ -97,23 +97,111 @@ function AgentExecutionMonitorComponent_Conditional_38_Template(rf, ctx) { if (r
  * - Input/output preview
  */
 export class AgentExecutionMonitorComponent {
+    /** @deprecated Use {@link Mode}. */
+    set mode(value) {
+        this.Mode = value;
+    }
+    /** @deprecated Use {@link Mode}. */
+    get mode() {
+        return this.Mode;
+    }
+    /** @deprecated Use {@link AgentRun}. */
+    set agentRun(value) {
+        this.AgentRun = value;
+    }
+    /** @deprecated Use {@link AgentRun}. */
+    get agentRun() {
+        return this.AgentRun;
+    } // For historical mode
+    /** @deprecated Use {@link LiveSteps}. */
+    set liveSteps(value) {
+        this.LiveSteps = value;
+    }
+    /** @deprecated Use {@link LiveSteps}. */
+    get liveSteps() {
+        return this.LiveSteps;
+    } // For live mode streaming
+    /** @deprecated Use {@link AutoExpand}. */
+    set autoExpand(value) {
+        this.AutoExpand = value;
+    }
+    /** @deprecated Use {@link AutoExpand}. */
+    get autoExpand() {
+        return this.AutoExpand;
+    } // Auto-expand nodes in live mode
+    /** @deprecated Use {@link RunId}. */
+    set runId(value) {
+        this.RunId = value;
+    }
+    /** @deprecated Use {@link RunId}. */
+    get runId() {
+        return this.RunId;
+    } // ID of the run (agent or prompt)
+    /** @deprecated Use {@link RunType}. */
+    set runType(value) {
+        this.RunType = value;
+    }
+    /** @deprecated Use {@link RunType}. */
+    get runType() {
+        return this.RunType;
+    } // Type of run
+    /** @deprecated Use {@link ExecutionTreeContainer}. */
+    get executionTreeContainer() {
+        return this.ExecutionTreeContainer;
+    }
+    /** @deprecated Use {@link ExecutionTreeContainer}. */
+    set executionTreeContainer(value) {
+        this.ExecutionTreeContainer = value;
+    }
+    /** @deprecated Use {@link ExecutionNodesContainer}. */
+    get executionNodesContainer() {
+        return this.ExecutionNodesContainer;
+    }
+    /** @deprecated Use {@link ExecutionNodesContainer}. */
+    set executionNodesContainer(value) {
+        this.ExecutionNodesContainer = value;
+    }
+    /** @deprecated Use {@link CurrentStep}. */
+    get currentStep() {
+        return this.CurrentStep;
+    }
+    /** @deprecated Use {@link CurrentStep}. */
+    set currentStep(value) {
+        this.CurrentStep = value;
+    }
+    /** @deprecated Use {@link Stats}. */
+    get stats() {
+        return this.Stats;
+    }
+    /** @deprecated Use {@link Stats}. */
+    set stats(value) {
+        this.Stats = value;
+    }
     constructor(cdr) {
         this.cdr = cdr;
-        this.mode = 'historical';
-        this.agentRun = null; // For historical mode
-        this.liveSteps = []; // For live mode streaming
-        this.autoExpand = true; // Auto-expand nodes in live mode
-        this.runId = null; // ID of the run (agent or prompt)
-        this.runType = 'agent'; // Type of run
-        this.viewRunClick = new EventEmitter();
+        this.Mode = 'historical';
+        this.AgentRun = null;
+        this.LiveSteps = [];
+        this.AutoExpand = true;
+        this.RunId = null;
+        this.RunType = 'agent';
+        this.ViewRunClick = new EventEmitter();
+        /**
+         * @deprecated Use {@link ViewRunClick}.
+         *
+         * The same emitter under the old binding name, so a template still binding
+         * (viewRunClick) keeps working. Must stay AFTER ViewRunClick: class fields
+         * initialise in order, and the other way round this captures undefined.
+         */
+        this.viewRunClick = this.ViewRunClick;
         // Store the currently rendered steps for UI state management
-        this.currentStep = null;
+        this.CurrentStep = null;
         // Track component references for dynamic components
         this.nodeComponentMap = new Map();
         // UI state management - track expanded states separately from entities
         this.expandedStates = new Map();
         this.detailsExpandedStates = new Map();
-        this.stats = {
+        this.Stats = {
             totalSteps: 0,
             completedSteps: 0,
             failedSteps: 0,
@@ -144,11 +232,11 @@ export class AgentExecutionMonitorComponent {
             agentRunChanged: !!changes['agentRun'],
             liveStepsChanged: !!changes['liveSteps'],
             modeChanged: !!changes['mode'],
-            hasAgentRun: !!this.agentRun,
-            liveStepsCount: this.liveSteps?.length || 0
+            hasAgentRun: !!this.AgentRun,
+            liveStepsCount: this.LiveSteps?.length || 0
         });
         // Handle agent run changes (historical mode)
-        if (changes['agentRun'] && this.mode === 'historical') {
+        if (changes['agentRun'] && this.Mode === 'historical') {
             const oldRun = changes['agentRun'].previousValue;
             const newRun = changes['agentRun'].currentValue;
             console.log('📊 Agent run changed:', {
@@ -169,7 +257,7 @@ export class AgentExecutionMonitorComponent {
                 this.expandedStates.clear();
                 this.detailsExpandedStates.clear();
                 this.clearNodeComponents();
-                this.currentStep = null;
+                this.CurrentStep = null;
             }
             // Always process the agent run data (will handle updates to existing run)
             if (newRun) {
@@ -177,7 +265,7 @@ export class AgentExecutionMonitorComponent {
             }
         }
         // Handle live steps changes (live mode)
-        if (changes['liveSteps'] && this.mode === 'live') {
+        if (changes['liveSteps'] && this.Mode === 'live') {
             const oldSteps = changes['liveSteps'].previousValue;
             const newSteps = changes['liveSteps'].currentValue;
             console.log('📊 Live steps changed:', {
@@ -198,14 +286,14 @@ export class AgentExecutionMonitorComponent {
             this.expandedStates.clear();
             this.detailsExpandedStates.clear();
             this.clearNodeComponents();
-            this.currentStep = null;
+            this.CurrentStep = null;
             // Stop live updates when switching away from live mode
             if (previousMode === 'live' && this.updateSubscription) {
                 this.updateSubscription.unsubscribe();
                 this.updateSubscription = undefined;
             }
             // Process data for the new mode
-            if (currentMode === 'historical' && this.agentRun) {
+            if (currentMode === 'historical' && this.AgentRun) {
                 this.processAgentRun();
             }
             else if (currentMode === 'live') {
@@ -216,20 +304,20 @@ export class AgentExecutionMonitorComponent {
     ngAfterViewInit() {
         this.viewInitialized = true;
         console.log('🎯 View initialized, checking for pending data:', {
-            hasAgentRun: !!this.agentRun,
-            hasLiveSteps: this.liveSteps?.length > 0,
-            hasContainer: !!this.executionNodesContainer
+            hasAgentRun: !!this.AgentRun,
+            hasLiveSteps: this.LiveSteps?.length > 0,
+            hasContainer: !!this.ExecutionNodesContainer
         });
         // Initial setup for scroll behavior
-        if (this.mode === 'live') {
+        if (this.Mode === 'live') {
             this.checkIfUserAtBottom();
         }
         // If we have data waiting to be rendered, render it now
-        if (this.mode === 'historical' && this.agentRun && this.nodeComponentMap.size === 0) {
+        if (this.Mode === 'historical' && this.AgentRun && this.nodeComponentMap.size === 0) {
             console.log('⚡ Processing agent run after view init');
             this.processAgentRun();
         }
-        else if (this.mode === 'live' && this.liveSteps?.length > 0) {
+        else if (this.Mode === 'live' && this.LiveSteps?.length > 0) {
             console.log('⚡ Processing live steps after view init');
             this.processLiveSteps();
         }
@@ -249,8 +337,8 @@ export class AgentExecutionMonitorComponent {
     clearNodeComponents() {
         this.nodeComponentMap.forEach(ref => ref.destroy());
         this.nodeComponentMap.clear();
-        if (this.executionNodesContainer) {
-            this.executionNodesContainer.clear();
+        if (this.ExecutionNodesContainer) {
+            this.ExecutionNodesContainer.clear();
         }
     }
     /**
@@ -258,26 +346,26 @@ export class AgentExecutionMonitorComponent {
      */
     processAgentRun() {
         console.log('⚙️ Processing agent run:', {
-            hasAgentRun: !!this.agentRun,
-            stepsCount: this.agentRun?.Steps?.length || 0,
+            hasAgentRun: !!this.AgentRun,
+            stepsCount: this.AgentRun?.Steps?.length || 0,
             viewInitialized: this.viewInitialized,
-            hasContainer: !!this.executionNodesContainer
+            hasContainer: !!this.ExecutionNodesContainer
         });
-        if (!this.agentRun || !this.viewInitialized || !this.executionNodesContainer) {
+        if (!this.AgentRun || !this.viewInitialized || !this.ExecutionNodesContainer) {
             console.warn('⚠️ Cannot process agent run:', {
-                agentRun: !this.agentRun ? 'missing' : 'present',
+                agentRun: !this.AgentRun ? 'missing' : 'present',
                 viewInitialized: this.viewInitialized ? 'yes' : 'no',
-                container: !this.executionNodesContainer ? 'missing' : 'present'
+                container: !this.ExecutionNodesContainer ? 'missing' : 'present'
             });
             return;
         }
         // Clear existing components
         this.clearNodeComponents();
         // Render the agent run steps
-        if (this.agentRun.Steps && this.agentRun.Steps.length > 0) {
-            console.log('🎨 Rendering', this.agentRun.Steps.length, 'steps');
-            this.renderSteps(this.agentRun.Steps, 0, []);
-            console.log('✅ Finished rendering, container now has', this.executionNodesContainer.length, 'components');
+        if (this.AgentRun.Steps && this.AgentRun.Steps.length > 0) {
+            console.log('🎨 Rendering', this.AgentRun.Steps.length, 'steps');
+            this.renderSteps(this.AgentRun.Steps, 0, []);
+            console.log('✅ Finished rendering, container now has', this.ExecutionNodesContainer.length, 'components');
         }
         else {
             console.warn('⚠️ No steps to render');
@@ -292,15 +380,15 @@ export class AgentExecutionMonitorComponent {
      */
     processLiveSteps() {
         console.log('⚙️ Processing live steps:', {
-            stepsCount: this.liveSteps?.length || 0,
+            stepsCount: this.LiveSteps?.length || 0,
             viewInitialized: this.viewInitialized,
-            hasContainer: !!this.executionNodesContainer
+            hasContainer: !!this.ExecutionNodesContainer
         });
-        if (!this.liveSteps || !this.viewInitialized || !this.executionNodesContainer) {
+        if (!this.LiveSteps || !this.viewInitialized || !this.ExecutionNodesContainer) {
             return;
         }
         // Append new steps without clearing existing ones
-        this.appendNewLiveSteps(this.liveSteps);
+        this.appendNewLiveSteps(this.LiveSteps);
         // Trigger change detection after appending live steps
         this.cdr.detectChanges();
         // Set up live update monitoring if not already set up
@@ -340,17 +428,17 @@ export class AgentExecutionMonitorComponent {
      */
     createStepComponent(step, depth, agentPath) {
         // Ensure container exists
-        if (!this.executionNodesContainer) {
+        if (!this.ExecutionNodesContainer) {
             console.error('❌ executionNodesContainer not available');
             throw new Error('executionNodesContainer ViewContainerRef not initialized');
         }
-        const componentRef = this.executionNodesContainer.createComponent(ExecutionNodeComponent);
+        const componentRef = this.ExecutionNodesContainer.createComponent(ExecutionNodeComponent);
         const instance = componentRef.instance;
         console.log('🔨 Creating component for step:', {
             stepId: step.ID,
             stepName: step.StepName,
             depth,
-            containerLength: this.executionNodesContainer.length,
+            containerLength: this.ExecutionNodesContainer.length,
             hostElement: componentRef.location.nativeElement
         });
         // Pass the step data with UI state information
@@ -362,7 +450,7 @@ export class AgentExecutionMonitorComponent {
         // Subscribe to outputs
         instance.toggleNode.subscribe(() => this.toggleStepExpansion(step));
         instance.toggleDetails.subscribe(() => this.toggleStepDetails(step));
-        instance.userInteracted.subscribe(() => this.onUserInteraction());
+        instance.userInteracted.subscribe(() => this.OnUserInteraction());
         // Store reference
         this.nodeComponentMap.set(step.ID, componentRef);
         // Log the component state after setup
@@ -561,11 +649,11 @@ export class AgentExecutionMonitorComponent {
     setupLiveUpdates() {
         console.log('⚡ Setting up live updates');
         // Process initial live steps if any
-        if (this.liveSteps && this.liveSteps.length > 0) {
-            this.appendNewLiveSteps(this.liveSteps);
+        if (this.LiveSteps && this.LiveSteps.length > 0) {
+            this.appendNewLiveSteps(this.LiveSteps);
         }
         // Set up interval to check for updates (if not already set up)
-        if (this.mode === 'live' && !this.updateSubscription) {
+        if (this.Mode === 'live' && !this.updateSubscription) {
             this.updateSubscription = interval(500)
                 .pipe(takeUntil(this.destroy$))
                 .subscribe(() => {
@@ -588,7 +676,7 @@ export class AgentExecutionMonitorComponent {
                 runningStep = step;
             }
         });
-        this.currentStep = runningStep;
+        this.CurrentStep = runningStep;
         this.cdr.markForCheck();
     }
     /**
@@ -641,7 +729,7 @@ export class AgentExecutionMonitorComponent {
      * Calculate execution statistics
      */
     calculateStats() {
-        this.stats = {
+        this.Stats = {
             totalSteps: 0,
             completedSteps: 0,
             failedSteps: 0,
@@ -652,23 +740,23 @@ export class AgentExecutionMonitorComponent {
             totalPrompts: 0
         };
         // Use token data from agent run if available
-        if (this.agentRun) {
-            this.stats.totalTokens = this.agentRun.TotalTokensUsed || 0;
-            this.stats.totalCost = this.agentRun.TotalCost || 0;
+        if (this.AgentRun) {
+            this.Stats.totalTokens = this.AgentRun.TotalTokensUsed || 0;
+            this.Stats.totalCost = this.AgentRun.TotalCost || 0;
             // Calculate duration
-            if (this.agentRun.StartedAt && this.agentRun.CompletedAt) {
-                this.stats.totalDuration = new Date(this.agentRun.CompletedAt).getTime() -
-                    new Date(this.agentRun.StartedAt).getTime();
+            if (this.AgentRun.StartedAt && this.AgentRun.CompletedAt) {
+                this.Stats.totalDuration = new Date(this.AgentRun.CompletedAt).getTime() -
+                    new Date(this.AgentRun.StartedAt).getTime();
             }
             // Count steps recursively
-            if (this.agentRun.Steps) {
-                this.countSteps(this.agentRun.Steps);
+            if (this.AgentRun.Steps) {
+                this.countSteps(this.AgentRun.Steps);
             }
         }
         console.log('📈 Stats calculated:', {
-            totalSteps: this.stats.totalSteps,
-            totalTokens: this.stats.totalTokens,
-            totalCost: this.stats.totalCost
+            totalSteps: this.Stats.totalSteps,
+            totalTokens: this.Stats.totalTokens,
+            totalCost: this.Stats.totalCost
         });
     }
     /**
@@ -676,17 +764,17 @@ export class AgentExecutionMonitorComponent {
      */
     countSteps(steps) {
         for (const step of steps) {
-            this.stats.totalSteps++;
+            this.Stats.totalSteps++;
             // Map to display types for consistency
             const displayType = this.getStepTypeClass(step.StepType);
-            this.stats.stepsByType[displayType] = (this.stats.stepsByType[displayType] || 0) + 1;
+            this.Stats.stepsByType[displayType] = (this.Stats.stepsByType[displayType] || 0) + 1;
             if (step.Status === 'Completed')
-                this.stats.completedSteps++;
+                this.Stats.completedSteps++;
             if (step.Status === 'Failed' || step.Status === 'Cancelled')
-                this.stats.failedSteps++;
+                this.Stats.failedSteps++;
             // Count prompts
             if (step.StepType === 'Prompt') {
-                this.stats.totalPrompts++;
+                this.Stats.totalPrompts++;
             }
             // Recurse for sub-agents
             if (step.StepType === 'Sub-Agent' && step.SubAgentRun?.Steps) {
@@ -697,7 +785,7 @@ export class AgentExecutionMonitorComponent {
     /**
      * Handle scroll events
      */
-    onScroll(event) {
+    OnScroll(event) {
         if (this.isAutoScrolling) {
             // Ignore scroll events triggered by auto-scrolling
             return;
@@ -716,13 +804,21 @@ export class AgentExecutionMonitorComponent {
         }
         this.lastScrollPosition = element.scrollTop;
     }
+    /** @deprecated Use {@link OnScroll}. */
+    onScroll(event) {
+        return this.OnScroll(event);
+    }
     /**
      * Handle user clicks (interaction detection)
      */
-    onUserInteraction() {
+    OnUserInteraction() {
         // This is called when user clicks anywhere in the execution tree
         // The toggleNode method will set userHasInteracted for specific interactions
     }
+    /** @deprecated Use {@link OnUserInteraction}. */
+    onUserInteraction() {
+        return this.OnUserInteraction();
+    }
     /**
      * Check if scroll is at bottom
      */
@@ -734,9 +830,9 @@ export class AgentExecutionMonitorComponent {
      * Check if user is at bottom (for initial setup)
      */
     checkIfUserAtBottom() {
-        if (!this.executionTreeContainer)
+        if (!this.ExecutionTreeContainer)
             return;
-        const element = this.executionTreeContainer.nativeElement;
+        const element = this.ExecutionTreeContainer.nativeElement;
         if (this.isScrolledToBottom(element)) {
             this.userHasScrolled = false;
         }
@@ -745,10 +841,10 @@ export class AgentExecutionMonitorComponent {
      * Auto-scroll to bottom if user hasn't interacted
      */
     autoScrollToBottom() {
-        if (!this.executionTreeContainer || this.userHasInteracted || this.userHasScrolled) {
+        if (!this.ExecutionTreeContainer || this.userHasInteracted || this.userHasScrolled) {
             return;
         }
-        const element = this.executionTreeContainer.nativeElement;
+        const element = this.ExecutionTreeContainer.nativeElement;
         this.isAutoScrolling = true;
         // Use smooth scrolling for better UX
         element.scrollTo({
@@ -763,9 +859,13 @@ export class AgentExecutionMonitorComponent {
     /**
      * Format agent path for display
      */
-    formatAgentPath(path) {
+    FormatAgentPath(path) {
         return path.join(' → ');
     }
+    /** @deprecated Use {@link FormatAgentPath}. */
+    formatAgentPath(path) {
+        return this.FormatAgentPath(path);
+    }
     /**
      * Format duration for display
      */
@@ -781,13 +881,17 @@ export class AgentExecutionMonitorComponent {
     /**
      * Get step types for display
      */
+    GetStepTypes() {
+        return Object.keys(this.Stats.stepsByType).sort();
+    }
+    /** @deprecated Use {@link GetStepTypes}. */
     getStepTypes() {
-        return Object.keys(this.stats.stepsByType).sort();
+        return this.GetStepTypes();
     }
     /**
      * Pluralize step type based on count
      */
-    pluralizeStepType(type, count) {
+    PluralizeStepType(type, count) {
         if (count === 1) {
             return type;
         }
@@ -802,10 +906,14 @@ export class AgentExecutionMonitorComponent {
                 return type + 's';
         }
     }
+    /** @deprecated Use {@link PluralizeStepType}. */
+    pluralizeStepType(type, count) {
+        return this.PluralizeStepType(type, count);
+    }
     /**
      * Format markdown content for display
      */
-    formatMarkdown(markdown) {
+    FormatMarkdown(markdown) {
         // Basic markdown formatting
         // This is a simple implementation - you might want to use a proper markdown library
         let html = markdown;
@@ -838,11 +946,15 @@ export class AgentExecutionMonitorComponent {
         html = html.replace(/`([^`]+)`/g, '<code>$1</code>');
         return html;
     }
+    /** @deprecated Use {@link FormatMarkdown}. */
+    formatMarkdown(markdown) {
+        return this.FormatMarkdown(markdown);
+    }
     /**
      * Append new live steps without re-rendering entire tree
      */
     appendNewLiveSteps(newSteps) {
-        if (!newSteps || newSteps.length === 0 || !this.viewInitialized || !this.executionNodesContainer) {
+        if (!newSteps || newSteps.length === 0 || !this.viewInitialized || !this.ExecutionNodesContainer) {
             return;
         }
         console.log('📝 Appending', newSteps.length, 'live steps');
@@ -912,18 +1024,26 @@ export class AgentExecutionMonitorComponent {
     /**
      * Check if execution is complete
      */
+    IsExecutionComplete() {
+        return this.Stats.completedSteps > 0 &&
+            this.Stats.completedSteps === this.Stats.totalSteps - this.Stats.failedSteps;
+    }
+    /** @deprecated Use {@link IsExecutionComplete}. */
     isExecutionComplete() {
-        return this.stats.completedSteps > 0 &&
-            this.stats.completedSteps === this.stats.totalSteps - this.stats.failedSteps;
+        return this.IsExecutionComplete();
     }
     /**
      * Handle view run button click
      */
-    onViewRunClick() {
-        if (this.agentRun) {
-            this.viewRunClick.emit({ runId: this.agentRun.ID, runType: 'agent' });
+    OnViewRunClick() {
+        if (this.AgentRun) {
+            this.ViewRunClick.emit({ runId: this.AgentRun.ID, runType: 'agent' });
         }
     }
+    /** @deprecated Use {@link OnViewRunClick}. */
+    onViewRunClick() {
+        return this.OnViewRunClick();
+    }
     /**
      * Expands all nodes that have sub-agent children
      */
@@ -951,8 +1071,8 @@ export class AgentExecutionMonitorComponent {
      * Scroll the execution tree to the top
      */
     scrollToTop() {
-        if (this.executionTreeContainer) {
-            const element = this.executionTreeContainer.nativeElement;
+        if (this.ExecutionTreeContainer) {
+            const element = this.ExecutionTreeContainer.nativeElement;
             element.scrollTo({
                 top: 0,
                 behavior: 'smooth'
@@ -970,9 +1090,9 @@ export class AgentExecutionMonitorComponent {
             i0.ɵɵviewQuery(_c0, 5)(_c1, 5, ViewContainerRef);
         } if (rf & 2) {
             let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.executionTreeContainer = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.executionNodesContainer = _t.first);
-        } }, inputs: { mode: "mode", agentRun: "agentRun", liveSteps: "liveSteps", autoExpand: "autoExpand", runId: "runId", runType: "runType" }, outputs: { viewRunClick: "viewRunClick" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 39, vars: 16, consts: [["executionTreeContainer", ""], ["executionNodesContainer", ""], [1, "execution-monitor"], [1, "monitor-header"], [1, "header-title"], [1, "fa-solid", "fa-diagram-project"], [1, "live-indicator"], [1, "current-status"], [1, "view-run-btn"], [1, "execution-tree", 3, "scroll", "click"], [1, "nodes-container"], ["Icon", "fa-solid fa-hourglass-start", "Title", "Waiting for execution to begin...", "Size", "compact"], [1, "monitor-footer"], [1, "stats-grid"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "failed-count"], [1, "step-types"], [1, "pulse"], [1, "status-label"], [1, "step-name"], [1, "view-run-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "type-badge"]], template: function AgentExecutionMonitorComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.ExecutionTreeContainer = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.ExecutionNodesContainer = _t.first);
+        } }, inputs: { Mode: "Mode", mode: "mode", AgentRun: "AgentRun", agentRun: "agentRun", LiveSteps: "LiveSteps", liveSteps: "liveSteps", AutoExpand: "AutoExpand", autoExpand: "autoExpand", RunId: "RunId", runId: "runId", RunType: "RunType", runType: "runType" }, outputs: { ViewRunClick: "ViewRunClick", viewRunClick: "viewRunClick" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 39, vars: 16, consts: [["executionTreeContainer", ""], ["executionNodesContainer", ""], [1, "execution-monitor"], [1, "monitor-header"], [1, "header-title"], [1, "fa-solid", "fa-diagram-project"], [1, "live-indicator"], [1, "current-status"], [1, "view-run-btn"], [1, "execution-tree", 3, "scroll", "click"], [1, "nodes-container"], ["Icon", "fa-solid fa-hourglass-start", "Title", "Waiting for execution to begin...", "Size", "compact"], [1, "monitor-footer"], [1, "stats-grid"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "failed-count"], [1, "step-types"], [1, "pulse"], [1, "status-label"], [1, "step-name"], [1, "view-run-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "type-badge"]], template: function AgentExecutionMonitorComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4);
             i0.ɵɵelement(3, "i", 5);
             i0.ɵɵelementStart(4, "span");
@@ -1135,24 +1255,38 @@ export class AgentExecutionMonitorComponent {
             </div>
         </div>
     `, styles: ["\n        :host {\n            display: flex;\n            flex-direction: column;\n            height: 100%;\n            overflow: hidden;\n        }\n        \n        .execution-monitor {\n            display: flex;\n            flex-direction: column;\n            flex: 1;\n            background: var(--mj-bg-surface);\n            border: 1px solid var(--mj-border-default);\n            border-radius: 8px;\n            overflow: hidden;\n        }\n\n        /* Header */\n        .monitor-header {\n            padding: 16px;\n            background: var(--mj-bg-surface-card);\n            border-bottom: 1px solid var(--mj-border-default);\n        }\n\n        .header-title {\n            display: flex;\n            align-items: center;\n            gap: 8px;\n            font-size: 16px;\n            font-weight: 600;\n            color: var(--mj-text-primary);\n            margin-bottom: 8px;\n        }\n\n        .header-title i {\n            color: var(--mj-brand-primary);\n        }\n\n        .live-indicator {\n            display: inline-flex;\n            align-items: center;\n            gap: 6px;\n            padding: 4px 8px;\n            background: var(--mj-status-error);\n            color: var(--mj-text-inverse);\n            border-radius: 4px;\n            font-size: 11px;\n            font-weight: 600;\n            letter-spacing: 0.5px;\n        }\n\n        .pulse {\n            display: inline-block;\n            width: 8px;\n            height: 8px;\n            background: white;\n            border-radius: 50%;\n            animation: pulse 2s infinite;\n        }\n\n        @keyframes pulse {\n            0% { opacity: 1; transform: scale(1); }\n            50% { opacity: 0.5; transform: scale(0.8); }\n            100% { opacity: 1; transform: scale(1); }\n        }\n\n        .current-status {\n            display: flex;\n            align-items: center;\n            gap: 8px;\n            font-size: 13px;\n            color: var(--mj-text-secondary);\n        }\n\n        .status-label {\n            font-weight: 500;\n        }\n\n        .agent-path {\n            color: var(--mj-text-muted);\n        }\n\n        .step-name {\n            color: var(--mj-text-primary);\n            font-weight: 500;\n        }\n\n        /* Execution Tree */\n        .execution-tree {\n            flex: 1;\n            overflow-y: auto;\n            overflow-x: auto;\n            padding: 16px;\n            min-height: 0;\n        }\n        \n        .nodes-container {\n            /* No extra padding needed, indentation handled by node margins */\n        }\n\n        .execution-tree mj-empty-state {\n            height: 100%;\n        }\n\n        /* Tree Nodes - These styles are for reference only, actual rendering is done by ExecutionNodeComponent */\n        .tree-node {\n            margin-bottom: 4px;\n        }\n\n        /* Footer */\n        .monitor-footer {\n            padding: 16px;\n            background: var(--mj-bg-surface-card);\n            border-top: 1px solid var(--mj-border-default);\n        }\n\n        .stats-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));\n            gap: 16px;\n            margin-bottom: 12px;\n        }\n\n        .stat-item {\n            text-align: center;\n        }\n\n        .stat-label {\n            display: block;\n            font-size: 11px;\n            color: var(--mj-text-secondary);\n            text-transform: uppercase;\n            letter-spacing: 0.5px;\n            margin-bottom: 4px;\n        }\n\n        .stat-value {\n            display: block;\n            font-size: 16px;\n            font-weight: 600;\n            color: var(--mj-text-primary);\n        }\n\n        .failed-count {\n            color: var(--mj-status-error);\n            font-size: 12px;\n            font-weight: normal;\n        }\n\n        .step-types {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 8px;\n            justify-content: center;\n        }\n\n        .type-badge {\n            display: inline-block;\n            padding: 4px 8px;\n            background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n            color: var(--mj-brand-primary);\n            border-radius: 4px;\n            font-size: 12px;\n            font-weight: 500;\n        }\n\n        /* View Run Button */\n        .view-run-btn {\n            background: var(--mj-brand-primary);\n            color: var(--mj-text-inverse);\n            border: none;\n            padding: 6px 12px;\n            border-radius: 4px;\n            font-size: 13px;\n            font-weight: 500;\n            cursor: pointer;\n            display: inline-flex;\n            align-items: center;\n            gap: 6px;\n            transition: all 0.2s ease;\n            margin-left: auto;\n        }\n\n        .view-run-btn:hover {\n            background: var(--mj-brand-primary-hover);\n            transform: translateY(-1px);\n            box-shadow: 0 2px 4px rgba(0,0,0,0.2);\n        }\n        \n        .view-run-btn i {\n            font-size: 12px;\n        }\n\n        /* Responsive */\n        @media (max-width: 768px) {\n            .monitor-header {\n                padding: 12px;\n            }\n\n            .execution-tree {\n                padding: 12px;\n            }\n        }\n    "] }]
-    }], () => [{ type: i0.ChangeDetectorRef }], { mode: [{
+    }], () => [{ type: i0.ChangeDetectorRef }], { Mode: [{
+            type: Input
+        }], mode: [{
+            type: Input
+        }], AgentRun: [{
             type: Input
         }], agentRun: [{
             type: Input
+        }], LiveSteps: [{
+            type: Input
         }], liveSteps: [{
             type: Input
+        }], AutoExpand: [{
+            type: Input
         }], autoExpand: [{
             type: Input
+        }], RunId: [{
+            type: Input
         }], runId: [{
             type: Input
+        }], RunType: [{
+            type: Input
         }], runType: [{
             type: Input
+        }], ViewRunClick: [{
+            type: Output
         }], viewRunClick: [{
             type: Output
-        }], executionTreeContainer: [{
+        }], ExecutionTreeContainer: [{
             type: ViewChild,
             args: ['executionTreeContainer']
-        }], executionNodesContainer: [{
+        }], ExecutionNodesContainer: [{
             type: ViewChild,
             args: ['executionNodesContainer', { read: ViewContainerRef }]
         }] }); })();