@memberjunction/ng-dashboards 5.25.0 → 5.27.0

package/dist/AI/components/analytics/executive-summary/executive-summary.component.js

@@ -0,0 +1,673 @@
+import { Component, Input, Output, EventEmitter, ChangeDetectorRef, inject } from '@angular/core';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { AIInstrumentationService } from '../../../services/ai-instrumentation.service';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-shared-generic";
+import * as i2 from "../../charts/time-series-chart.component";
+import * as i3 from "../analytics-filter-bar.component";
+import * as i4 from "@angular/common";
+const _forTrack0 = ($index, $item) => $item.Label;
+const _forTrack1 = ($index, $item) => $item.Name;
+const _forTrack2 = ($index, $item) => $item.Source;
+function AnalyticsExecutiveSummaryComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 1);
+    i0.ɵɵelement(1, "mj-loading", 18);
+    i0.ɵɵelementEnd();
+} }
+function AnalyticsExecutiveSummaryComponent_For_4_For_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 25);
+} if (rf & 2) {
+    const bar_r1 = ctx.$implicit;
+    const card_r2 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵstyleProp("height", bar_r1, "%")("background", card_r2.BorderColor);
+} }
+function AnalyticsExecutiveSummaryComponent_For_4_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "number");
+    i0.ɵɵelementStart(4, "span", 27);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const card_r2 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("kpi-delta--good", card_r2.IsImprovement)("kpi-delta--bad", !card_r2.IsImprovement);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(card_r2.DeltaDirection === "up" ? "fa-solid fa-arrow-up" : "fa-solid fa-arrow-down");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 8, card_r2.DeltaPercent, "1.1-1"), "% ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("vs prev ", ctx_r2.PeriodLabel);
+} }
+function AnalyticsExecutiveSummaryComponent_For_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 19)(1, "div", 20);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 21);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 22);
+    i0.ɵɵrepeaterCreate(6, AnalyticsExecutiveSummaryComponent_For_4_For_7_Template, 1, 4, "div", 23, i0.ɵɵrepeaterTrackByIndex);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(8, AnalyticsExecutiveSummaryComponent_For_4_Conditional_8_Template, 6, 11, "div", 24);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const card_r2 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("border-left-color", card_r2.BorderColor);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(card_r2.Label);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(card_r2.Value);
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(card_r2.SparklineData);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r2.ComparisonEnabled && card_r2.DeltaDirection !== "stable" ? 8 : -1);
+} }
+function AnalyticsExecutiveSummaryComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 13);
+    i0.ɵɵtext(1, "No data for selected period");
+    i0.ɵɵelementEnd();
+} }
+function AnalyticsExecutiveSummaryComponent_For_18_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28);
+    i0.ɵɵlistener("click", function AnalyticsExecutiveSummaryComponent_For_18_Template_div_click_0_listener() { const item_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.OnConsumerClick(item_r5)); })("keydown.enter", function AnalyticsExecutiveSummaryComponent_For_18_Template_div_keydown_enter_0_listener() { const item_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.OnConsumerClick(item_r5)); });
+    i0.ɵɵelementStart(1, "div", 29);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 30);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 31);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "div", 32);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "div", 33);
+    i0.ɵɵelement(10, "div", 34);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const item_r5 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("consumer-rank--top", item_r5.Rank <= 3);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(item_r5.Rank);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("consumer-type-pill--agent", item_r5.Type === "agent");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(item_r5.Type);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", item_r5.Name);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(item_r5.Name);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("$", ctx_r2.FormatCost(item_r5.Cost));
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("width", item_r5.Proportion * 100, "%");
+} }
+function AnalyticsExecutiveSummaryComponent_Conditional_27_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 13);
+    i0.ɵɵtext(1, "No errors in selected period");
+    i0.ɵɵelementEnd();
+} }
+function AnalyticsExecutiveSummaryComponent_For_29_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 16)(1, "div", 35);
+    i0.ɵɵelement(2, "i", 36);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 37)(4, "div", 38);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 39);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "div", 40);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const item_r6 = ctx.$implicit;
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(item_r6.Source);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", item_r6.ErrorMessage);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(item_r6.ErrorMessage);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(item_r6.Count);
+} }
+function AnalyticsExecutiveSummaryComponent_Conditional_30_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 41);
+    i0.ɵɵlistener("click", function AnalyticsExecutiveSummaryComponent_Conditional_30_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.SectionNavigate.emit("error-analysis")); });
+    i0.ɵɵtext(1, " View All Errors ");
+    i0.ɵɵelement(2, "i", 42);
+    i0.ɵɵelementEnd();
+} }
+// ─── Component ─────────────────────────────────────────────────────
+export class AnalyticsExecutiveSummaryComponent {
+    // ─── Inputs / Outputs ────────────────────────────────────────────
+    _timeRange = '24h';
+    set TimeRange(value) {
+        if (value !== this._timeRange) {
+            this._timeRange = value;
+            if (this.isInitialized) {
+                this.applyDateRange();
+            }
+        }
+    }
+    get TimeRange() { return this._timeRange; }
+    Filters = { Models: [], Agents: [], Prompts: [], Statuses: [] };
+    TimeRangeChange = new EventEmitter();
+    FiltersChange = new EventEmitter();
+    SectionNavigate = new EventEmitter();
+    // ─── DI ──────────────────────────────────────────────────────────
+    instrumentationService = inject(AIInstrumentationService);
+    cdr = inject(ChangeDetectorRef);
+    // ─── Public State ────────────────────────────────────────────────
+    KpiCards = [];
+    TrendsData = [];
+    TopConsumers = [];
+    ErrorHotspots = [];
+    IsLoading = false;
+    ComparisonEnabled = false;
+    PeriodLabel = 'period';
+    TimeSeriesConfig = {
+        showGrid: true,
+        showTooltip: true,
+        animationDuration: 300,
+        useDualAxis: true
+    };
+    // ─── Private State ───────────────────────────────────────────────
+    destroy$ = new Subject();
+    isInitialized = false;
+    previousKpis = null;
+    // ─── Lifecycle ───────────────────────────────────────────────────
+    ngOnInit() {
+        this.subscribeToStreams();
+        this.applyDateRange();
+        this.isInitialized = true;
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    // ─── Event Handlers ──────────────────────────────────────────────
+    OnTimeRangeChange(range) {
+        this.TimeRange = range;
+        this.TimeRangeChange.emit(range);
+    }
+    OnFiltersChange(filters) {
+        this.Filters = filters;
+        this.FiltersChange.emit(filters);
+    }
+    OnCompareToggled(active) {
+        this.ComparisonEnabled = active;
+        if (this.ComparisonEnabled) {
+            this.loadComparisonData();
+        }
+        else {
+            this.previousKpis = null;
+            this.rebuildKpiCards(this.latestKpis);
+        }
+    }
+    OnRefresh() {
+        this.instrumentationService.refresh();
+        if (this.ComparisonEnabled) {
+            this.loadComparisonData();
+        }
+    }
+    OnConsumerClick(item) {
+        this.SectionNavigate.emit(item.Type === 'agent' ? 'agent-runs' : 'prompt-runs');
+    }
+    // ─── Formatting Helpers ──────────────────────────────────────────
+    FormatCost(cost) {
+        if (cost >= 1000) {
+            return (cost / 1000).toFixed(1) + 'K';
+        }
+        if (cost >= 1) {
+            return cost.toFixed(2);
+        }
+        return cost.toFixed(4);
+    }
+    // ─── Private: Subscriptions ──────────────────────────────────────
+    latestKpis = null;
+    subscribeToStreams() {
+        this.instrumentationService.isLoading$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(loading => {
+            this.IsLoading = loading;
+            this.cdr.markForCheck();
+        });
+        this.instrumentationService.kpis$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(kpis => {
+            this.latestKpis = kpis;
+            this.rebuildKpiCards(kpis);
+            this.cdr.markForCheck();
+        });
+        this.instrumentationService.trends$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(trends => {
+            this.TrendsData = trends;
+            this.cdr.markForCheck();
+        });
+        this.instrumentationService.chartData$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(chartData => {
+            this.TopConsumers = this.buildTopConsumers(chartData);
+            this.ErrorHotspots = this.buildErrorHotspots(chartData);
+            this.cdr.markForCheck();
+        });
+    }
+    // ─── Private: Date Range ─────────────────────────────────────────
+    applyDateRange() {
+        const { start, end } = this.computeDateRange(this.TimeRange);
+        this.PeriodLabel = this.getPeriodLabel(this.TimeRange);
+        this.instrumentationService.setDateRange(start, end);
+        // Explicitly refresh to ensure data loads on first visit
+        this.instrumentationService.refresh();
+    }
+    computeDateRange(range) {
+        const end = new Date();
+        const start = new Date();
+        switch (range) {
+            case '1h':
+                start.setHours(start.getHours() - 1);
+                break;
+            case '24h':
+                start.setDate(start.getDate() - 1);
+                break;
+            case '7d':
+                start.setDate(start.getDate() - 7);
+                break;
+            case '30d':
+                start.setDate(start.getDate() - 30);
+                break;
+            case '90d':
+                start.setDate(start.getDate() - 90);
+                break;
+            default:
+                start.setDate(start.getDate() - 1);
+        }
+        return { start, end };
+    }
+    getPeriodLabel(range) {
+        switch (range) {
+            case '1h': return 'hour';
+            case '24h': return 'day';
+            case '7d': return 'week';
+            case '30d': return 'month';
+            case '90d': return 'quarter';
+            default: return 'period';
+        }
+    }
+    // ─── Private: Comparison Data ────────────────────────────────────
+    async loadComparisonData() {
+        const { start: currentStart, end: currentEnd } = this.computeDateRange(this.TimeRange);
+        const durationMs = currentEnd.getTime() - currentStart.getTime();
+        const prevEnd = new Date(currentStart.getTime());
+        const prevStart = new Date(prevEnd.getTime() - durationMs);
+        // Temporarily set date range to previous period, capture KPIs, then restore
+        const previousService = new AIInstrumentationService();
+        previousService.setDateRange(prevStart, prevEnd);
+        // We subscribe to the previousService's kpis$ once
+        const sub = previousService.kpis$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(kpis => {
+            this.previousKpis = kpis;
+            this.rebuildKpiCards(this.latestKpis);
+            this.cdr.markForCheck();
+            sub.unsubscribe();
+        });
+    }
+    // ─── Private: KPI Card Builder ───────────────────────────────────
+    rebuildKpiCards(kpis) {
+        if (!kpis) {
+            this.KpiCards = [];
+            return;
+        }
+        const trends = this.TrendsData;
+        this.KpiCards = [
+            this.buildKpiCard('Total Executions', this.formatNumber(kpis.totalExecutions), this.extractSparkline(trends, 'executions'), kpis.totalExecutions, this.previousKpis?.totalExecutions ?? null, 'up-is-neutral', 'var(--mj-brand-primary)'),
+            this.buildKpiCard('Total Cost', '$' + this.FormatCost(kpis.totalCost), this.extractSparkline(trends, 'cost'), kpis.totalCost, this.previousKpis?.totalCost ?? null, 'down-is-good', 'var(--mj-status-warning)'),
+            this.buildKpiCard('Success Rate', (kpis.successRate * 100).toFixed(1) + '%', this.extractSparkline(trends, 'executions'), kpis.successRate, this.previousKpis?.successRate ?? null, 'up-is-good', 'var(--mj-status-success)'),
+            this.buildKpiCard('Avg Latency', this.formatLatency(kpis.avgExecutionTime), this.extractSparkline(trends, 'avgTime'), kpis.avgExecutionTime, this.previousKpis?.avgExecutionTime ?? null, 'down-is-good', 'var(--mj-status-info)'),
+            this.buildKpiCard('Token Usage', this.formatNumber(kpis.totalTokens), this.extractSparkline(trends, 'tokens'), kpis.totalTokens, this.previousKpis?.totalTokens ?? null, 'up-is-neutral', 'var(--mj-brand-accent, var(--mj-brand-primary))'),
+            this.buildKpiCard('Errors', this.formatNumber(Math.round(kpis.errorRate * kpis.totalExecutions)), this.extractSparkline(trends, 'errors'), kpis.errorRate, this.previousKpis?.errorRate ?? null, 'down-is-good', 'var(--mj-status-error)')
+        ];
+    }
+    buildKpiCard(label, value, sparkline, current, previous, goodDirection, borderColor) {
+        const { percent, direction } = this.computeDelta(current, previous);
+        const isImprovement = this.isDirectionGood(direction, goodDirection);
+        return {
+            Label: label,
+            Value: value,
+            SparklineData: sparkline,
+            DeltaPercent: percent,
+            DeltaDirection: direction,
+            IsImprovement: isImprovement,
+            BorderColor: borderColor
+        };
+    }
+    computeDelta(current, previous) {
+        if (previous == null || previous === 0) {
+            return { percent: 0, direction: 'stable' };
+        }
+        const change = ((current - previous) / previous) * 100;
+        if (Math.abs(change) < 0.5) {
+            return { percent: 0, direction: 'stable' };
+        }
+        return {
+            percent: Math.abs(change),
+            direction: change > 0 ? 'up' : 'down'
+        };
+    }
+    isDirectionGood(direction, rule) {
+        if (direction === 'stable')
+            return true;
+        if (rule === 'up-is-good')
+            return direction === 'up';
+        if (rule === 'down-is-good')
+            return direction === 'down';
+        return true; // neutral
+    }
+    // ─── Private: Sparkline ──────────────────────────────────────────
+    extractSparkline(trends, metric) {
+        if (!trends || trends.length === 0) {
+            return [20, 40, 30, 60, 50, 70, 45]; // placeholder
+        }
+        // Sample up to 7 evenly-spaced points
+        const step = Math.max(1, Math.floor(trends.length / 7));
+        const sampled = [];
+        for (let i = 0; i < trends.length && sampled.length < 7; i += step) {
+            sampled.push(this.getMetricFromTrend(trends[i], metric));
+        }
+        // Normalize to 0-100 percentage
+        const maxVal = Math.max(...sampled, 1);
+        return sampled.map(v => Math.max(5, (v / maxVal) * 100));
+    }
+    getMetricFromTrend(trend, metric) {
+        switch (metric) {
+            case 'executions': return trend.executions;
+            case 'cost': return trend.cost;
+            case 'tokens': return trend.tokens;
+            case 'avgTime': return trend.avgTime;
+            case 'errors': return trend.errors;
+        }
+    }
+    // ─── Private: Top Consumers ──────────────────────────────────────
+    buildTopConsumers(chartData) {
+        const consumers = [];
+        const maxCost = Math.max(...chartData.costByModel.map(m => m.cost), ...chartData.performanceMatrix.map(p => 1), // agents don't have cost here directly
+        1);
+        // Add model-based consumers (from prompt runs)
+        for (const model of chartData.costByModel.slice(0, 5)) {
+            consumers.push({
+                Rank: 0,
+                Type: 'prompt',
+                Name: model.model,
+                Cost: model.cost,
+                Proportion: 0
+            });
+        }
+        // Sort by cost descending, assign ranks
+        consumers.sort((a, b) => b.Cost - a.Cost);
+        const topCost = consumers.length > 0 ? consumers[0].Cost : 1;
+        return consumers.slice(0, 5).map((c, i) => ({
+            ...c,
+            Rank: i + 1,
+            Proportion: topCost > 0 ? c.Cost / topCost : 0
+        }));
+    }
+    // ─── Private: Error Hotspots ─────────────────────────────────────
+    // Error hotspots are computed reactively when KPIs change.
+    // Since rawData$ is private on the service, we compute from the
+    // kpis errorRate + totalExecutions, and rely on chartData for names.
+    // For a richer implementation, the service could expose an errors$ stream.
+    // For now, we derive from chartData.performanceMatrix entries with low successRate.
+    buildErrorHotspots(chartData) {
+        const hotspots = [];
+        for (const entry of chartData.performanceMatrix) {
+            if (entry.successRate < 1.0) {
+                const errorCount = Math.round((1 - entry.successRate) * 10); // approximate
+                hotspots.push({
+                    Source: `${entry.agent} / ${entry.model}`,
+                    ErrorMessage: `${((1 - entry.successRate) * 100).toFixed(0)}% failure rate (avg ${(entry.avgTime / 1000).toFixed(1)}s)`,
+                    Count: errorCount
+                });
+            }
+        }
+        return hotspots
+            .sort((a, b) => b.Count - a.Count)
+            .slice(0, 4);
+    }
+    // ─── Private: Formatting ─────────────────────────────────────────
+    formatNumber(value) {
+        if (value >= 1_000_000)
+            return (value / 1_000_000).toFixed(1) + 'M';
+        if (value >= 1_000)
+            return (value / 1_000).toFixed(1) + 'K';
+        return value.toLocaleString();
+    }
+    formatLatency(ms) {
+        if (ms >= 60_000)
+            return (ms / 60_000).toFixed(1) + 'm';
+        if (ms >= 1_000)
+            return (ms / 1_000).toFixed(1) + 's';
+        return Math.round(ms) + 'ms';
+    }
+    static ɵfac = function AnalyticsExecutiveSummaryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || AnalyticsExecutiveSummaryComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AnalyticsExecutiveSummaryComponent, selectors: [["app-analytics-executive-summary"]], inputs: { TimeRange: "TimeRange", Filters: "Filters" }, outputs: { TimeRangeChange: "TimeRangeChange", FiltersChange: "FiltersChange", SectionNavigate: "SectionNavigate" }, standalone: false, decls: 31, vars: 15, consts: [[3, "TimeRangeChange", "FiltersChange", "CompareToggled", "TimeRange", "Filters", "ShowCompareToggle", "ShowModelFilter", "ShowAgentFilter", "ShowPromptFilter", "ShowStatusFilter"], [1, "loading-container"], [1, "kpi-row"], [1, "kpi-card", 3, "border-left-color"], [1, "trends-panel"], ["title", "Execution Trends", 3, "data", "config"], [1, "panels-grid"], [1, "panel"], [1, "panel-header"], [1, "panel-header__title"], [1, "fa-solid", "fa-ranking-star", "panel-header__icon"], [1, "panel-header__subtitle"], [1, "panel-body"], [1, "panel-empty"], ["role", "button", "tabindex", "0", 1, "consumer-item"], [1, "fa-solid", "fa-triangle-exclamation", "panel-header__icon", "panel-header__icon--error"], [1, "error-item"], [1, "view-all-link"], ["text", "Loading executive summary...", "size", "medium"], [1, "kpi-card"], [1, "kpi-label"], [1, "kpi-value"], [1, "kpi-sparkline"], [1, "spark-bar", 3, "height", "background"], [1, "kpi-delta", 3, "kpi-delta--good", "kpi-delta--bad"], [1, "spark-bar"], [1, "kpi-delta"], [1, "kpi-delta__period"], ["role", "button", "tabindex", "0", 1, "consumer-item", 3, "click", "keydown.enter"], [1, "consumer-rank"], [1, "consumer-type-pill"], [1, "consumer-name", 3, "title"], [1, "consumer-cost"], [1, "consumer-bar-container"], [1, "consumer-bar"], [1, "error-icon"], [1, "fa-solid", "fa-circle-exclamation"], [1, "error-info"], [1, "error-source"], [1, "error-message", 3, "title"], [1, "error-count"], [1, "view-all-link", 3, "click"], [1, "fa-solid", "fa-arrow-right"]], template: function AnalyticsExecutiveSummaryComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "app-analytics-filter-bar", 0);
+            i0.ɵɵlistener("TimeRangeChange", function AnalyticsExecutiveSummaryComponent_Template_app_analytics_filter_bar_TimeRangeChange_0_listener($event) { return ctx.OnTimeRangeChange($event); })("FiltersChange", function AnalyticsExecutiveSummaryComponent_Template_app_analytics_filter_bar_FiltersChange_0_listener($event) { return ctx.OnFiltersChange($event); })("CompareToggled", function AnalyticsExecutiveSummaryComponent_Template_app_analytics_filter_bar_CompareToggled_0_listener($event) { return ctx.OnCompareToggled($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(1, AnalyticsExecutiveSummaryComponent_Conditional_1_Template, 2, 0, "div", 1);
+            i0.ɵɵelementStart(2, "div", 2);
+            i0.ɵɵrepeaterCreate(3, AnalyticsExecutiveSummaryComponent_For_4_Template, 9, 5, "div", 3, _forTrack0);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "div", 4);
+            i0.ɵɵelement(6, "app-time-series-chart", 5);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(7, "div", 6)(8, "div", 7)(9, "div", 8)(10, "div", 9);
+            i0.ɵɵelement(11, "i", 10);
+            i0.ɵɵtext(12, " Top Consumers ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(13, "span", 11);
+            i0.ɵɵtext(14, "by cost");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(15, "div", 12);
+            i0.ɵɵconditionalCreate(16, AnalyticsExecutiveSummaryComponent_Conditional_16_Template, 2, 0, "div", 13);
+            i0.ɵɵrepeaterCreate(17, AnalyticsExecutiveSummaryComponent_For_18_Template, 11, 11, "div", 14, _forTrack1);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(19, "div", 7)(20, "div", 8)(21, "div", 9);
+            i0.ɵɵelement(22, "i", 15);
+            i0.ɵɵtext(23, " Error Hotspots ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(24, "span", 11);
+            i0.ɵɵtext(25);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(26, "div", 12);
+            i0.ɵɵconditionalCreate(27, AnalyticsExecutiveSummaryComponent_Conditional_27_Template, 2, 0, "div", 13);
+            i0.ɵɵrepeaterCreate(28, AnalyticsExecutiveSummaryComponent_For_29_Template, 10, 4, "div", 16, _forTrack2);
+            i0.ɵɵconditionalCreate(30, AnalyticsExecutiveSummaryComponent_Conditional_30_Template, 3, 0, "button", 17);
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵproperty("TimeRange", ctx.TimeRange)("Filters", ctx.Filters)("ShowCompareToggle", true)("ShowModelFilter", false)("ShowAgentFilter", false)("ShowPromptFilter", false)("ShowStatusFilter", false);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.IsLoading && ctx.KpiCards.length === 0 ? 1 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵrepeater(ctx.KpiCards);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("data", ctx.TrendsData)("config", ctx.TimeSeriesConfig);
+            i0.ɵɵadvance(10);
+            i0.ɵɵconditional(ctx.TopConsumers.length === 0 ? 16 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.TopConsumers);
+            i0.ɵɵadvance(8);
+            i0.ɵɵtextInterpolate2(" ", ctx.ErrorHotspots.length, " source", ctx.ErrorHotspots.length !== 1 ? "s" : "", " ");
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.ErrorHotspots.length === 0 ? 27 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.ErrorHotspots);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.ErrorHotspots.length > 0 ? 30 : -1);
+        } }, dependencies: [i1.LoadingComponent, i2.TimeSeriesChartComponent, i3.AnalyticsFilterBarComponent, i4.DecimalPipe], styles: ["\n\n    [_nghost-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 20px;\n      padding: 4px;\n    }\n\n    \n\n    .loading-container[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 60px 20px;\n    }\n\n    \n\n    .kpi-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n      gap: 14px;\n    }\n    .kpi-card[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-left: 4px solid var(--mj-brand-primary);\n      border-radius: 12px;\n      padding: 16px 18px;\n      display: flex;\n      flex-direction: column;\n      gap: 6px;\n      transition: all 0.25s ease;\n    }\n    .kpi-card[_ngcontent-%COMP%]:hover {\n      transform: translateY(-2px);\n      box-shadow: 0 6px 20px color-mix(in srgb, var(--mj-text-primary) 8%, transparent);\n    }\n    .kpi-label[_ngcontent-%COMP%] {\n      font-size: 10px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.6px;\n      color: var(--mj-text-muted);\n    }\n    .kpi-value[_ngcontent-%COMP%] {\n      font-size: 24px;\n      font-weight: 700;\n      color: var(--mj-text-primary);\n      line-height: 1.1;\n      letter-spacing: -0.02em;\n    }\n\n    \n\n    .kpi-sparkline[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: flex-end;\n      gap: 2px;\n      height: 24px;\n      margin-top: 4px;\n    }\n    .spark-bar[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 4px;\n      max-width: 8px;\n      border-radius: 1px;\n      opacity: 0.35;\n      transition: opacity 0.15s ease;\n    }\n    .kpi-card[_ngcontent-%COMP%]:hover   .spark-bar[_ngcontent-%COMP%] {\n      opacity: 0.55;\n    }\n\n    \n\n    .kpi-delta[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      font-size: 11px;\n      font-weight: 600;\n      margin-top: 2px;\n    }\n    .kpi-delta--good[_ngcontent-%COMP%] {\n      color: var(--mj-status-success);\n    }\n    .kpi-delta--bad[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n    }\n    .kpi-delta__period[_ngcontent-%COMP%] {\n      font-weight: 400;\n      color: var(--mj-text-disabled);\n    }\n\n    \n\n    .trends-panel[_ngcontent-%COMP%] {\n      height: 320px;\n      border-radius: 12px;\n      overflow: hidden;\n    }\n\n    \n\n    .panels-grid[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 16px;\n    }\n    .panel[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 12px;\n      overflow: hidden;\n    }\n    .panel-header[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 14px 18px;\n      border-bottom: 1px solid var(--mj-border-subtle);\n    }\n    .panel-header__title[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n    .panel-header__icon[_ngcontent-%COMP%] {\n      color: var(--mj-brand-primary);\n      font-size: 14px;\n    }\n    .panel-header__icon--error[_ngcontent-%COMP%] {\n      color: var(--mj-status-warning);\n    }\n    .panel-header__subtitle[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n    .panel-body[_ngcontent-%COMP%] {\n      padding: 8px 0;\n    }\n    .panel-empty[_ngcontent-%COMP%] {\n      padding: 24px 18px;\n      text-align: center;\n      font-size: 13px;\n      color: var(--mj-text-disabled);\n    }\n\n    \n\n    .consumer-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 18px;\n      cursor: pointer;\n      transition: background 0.15s ease;\n    }\n    .consumer-item[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-hover);\n    }\n    .consumer-rank[_ngcontent-%COMP%] {\n      width: 22px;\n      height: 22px;\n      border-radius: 6px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 11px;\n      font-weight: 700;\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n      flex-shrink: 0;\n    }\n    .consumer-rank--top[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n    .consumer-type-pill[_ngcontent-%COMP%] {\n      font-size: 10px;\n      font-weight: 600;\n      text-transform: uppercase;\n      padding: 2px 8px;\n      border-radius: 4px;\n      background: color-mix(in srgb, var(--mj-status-info) 12%, var(--mj-bg-surface));\n      color: var(--mj-status-info);\n      flex-shrink: 0;\n    }\n    .consumer-type-pill--agent[_ngcontent-%COMP%] {\n      background: color-mix(in srgb, var(--mj-status-success) 12%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n    .consumer-name[_ngcontent-%COMP%] {\n      flex: 1;\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .consumer-cost[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .consumer-bar-container[_ngcontent-%COMP%] {\n      width: 60px;\n      height: 6px;\n      border-radius: 3px;\n      background: var(--mj-bg-surface-sunken);\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n    .consumer-bar[_ngcontent-%COMP%] {\n      height: 100%;\n      border-radius: 3px;\n      background: var(--mj-brand-primary);\n      transition: width 0.3s ease;\n    }\n\n    \n\n    .error-item[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: flex-start;\n      gap: 10px;\n      padding: 10px 18px;\n    }\n    .error-icon[_ngcontent-%COMP%] {\n      color: var(--mj-status-error);\n      font-size: 14px;\n      margin-top: 2px;\n      flex-shrink: 0;\n    }\n    .error-info[_ngcontent-%COMP%] {\n      flex: 1;\n      min-width: 0;\n    }\n    .error-source[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      margin-bottom: 2px;\n    }\n    .error-message[_ngcontent-%COMP%] {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .error-count[_ngcontent-%COMP%] {\n      font-size: 13px;\n      font-weight: 700;\n      color: var(--mj-status-error);\n      flex-shrink: 0;\n      min-width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    }\n    .view-all-link[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      margin: 8px 18px 10px;\n      padding: 0;\n      border: none;\n      background: none;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n      cursor: pointer;\n      transition: color 0.15s ease;\n    }\n    .view-all-link[_ngcontent-%COMP%]:hover {\n      color: var(--mj-brand-primary-hover);\n    }\n\n    \n\n    @media (max-width: 1200px) {\n      .panels-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n      }\n    }\n    @media (max-width: 768px) {\n      .kpi-row[_ngcontent-%COMP%] {\n        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      }\n      .trends-panel[_ngcontent-%COMP%] {\n        height: 260px;\n      }\n    }"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AnalyticsExecutiveSummaryComponent, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'app-analytics-executive-summary', template: `
+    <!-- Filter Bar -->
+    <app-analytics-filter-bar
+      [TimeRange]="TimeRange"
+      [Filters]="Filters"
+      [ShowCompareToggle]="true"
+      [ShowModelFilter]="false"
+      [ShowAgentFilter]="false"
+      [ShowPromptFilter]="false"
+      [ShowStatusFilter]="false"
+      (TimeRangeChange)="OnTimeRangeChange($event)"
+      (FiltersChange)="OnFiltersChange($event)"
+      (CompareToggled)="OnCompareToggled($event)"
+    ></app-analytics-filter-bar>
+
+    @if (IsLoading && KpiCards.length === 0) {
+      <div class="loading-container">
+        <mj-loading text="Loading executive summary..." size="medium"></mj-loading>
+      </div>
+    }
+
+    <!-- KPI Row -->
+    <div class="kpi-row">
+      @for (card of KpiCards; track card.Label) {
+        <div class="kpi-card" [style.border-left-color]="card.BorderColor">
+          <div class="kpi-label">{{ card.Label }}</div>
+          <div class="kpi-value">{{ card.Value }}</div>
+          <div class="kpi-sparkline">
+            @for (bar of card.SparklineData; track $index) {
+              <div
+                class="spark-bar"
+                [style.height.%]="bar"
+                [style.background]="card.BorderColor"
+              ></div>
+            }
+          </div>
+          @if (ComparisonEnabled && card.DeltaDirection !== 'stable') {
+            <div class="kpi-delta" [class.kpi-delta--good]="card.IsImprovement" [class.kpi-delta--bad]="!card.IsImprovement">
+              <i [class]="card.DeltaDirection === 'up' ? 'fa-solid fa-arrow-up' : 'fa-solid fa-arrow-down'"></i>
+              {{ card.DeltaPercent | number:'1.1-1' }}%
+              <span class="kpi-delta__period">vs prev {{ PeriodLabel }}</span>
+            </div>
+          }
+        </div>
+      }
+    </div>
+
+    <!-- Execution Trends Chart -->
+    <div class="trends-panel">
+      <app-time-series-chart
+        [data]="TrendsData"
+        title="Execution Trends"
+        [config]="TimeSeriesConfig"
+      ></app-time-series-chart>
+    </div>
+
+    <!-- Two-Column Panels -->
+    <div class="panels-grid">
+      <!-- Top Consumers -->
+      <div class="panel">
+        <div class="panel-header">
+          <div class="panel-header__title">
+            <i class="fa-solid fa-ranking-star panel-header__icon"></i>
+            Top Consumers
+          </div>
+          <span class="panel-header__subtitle">by cost</span>
+        </div>
+        <div class="panel-body">
+          @if (TopConsumers.length === 0) {
+            <div class="panel-empty">No data for selected period</div>
+          }
+          @for (item of TopConsumers; track item.Name) {
+            <div
+              class="consumer-item"
+              (click)="OnConsumerClick(item)"
+              role="button"
+              tabindex="0"
+              (keydown.enter)="OnConsumerClick(item)"
+            >
+              <div
+                class="consumer-rank"
+                [class.consumer-rank--top]="item.Rank <= 3"
+              >{{ item.Rank }}</div>
+              <div
+                class="consumer-type-pill"
+                [class.consumer-type-pill--agent]="item.Type === 'agent'"
+              >{{ item.Type }}</div>
+              <div class="consumer-name" [title]="item.Name">{{ item.Name }}</div>
+              <div class="consumer-cost">\${{ FormatCost(item.Cost) }}</div>
+              <div class="consumer-bar-container">
+                <div
+                  class="consumer-bar"
+                  [style.width.%]="item.Proportion * 100"
+                ></div>
+              </div>
+            </div>
+          }
+        </div>
+      </div>
+
+      <!-- Error Hotspots -->
+      <div class="panel">
+        <div class="panel-header">
+          <div class="panel-header__title">
+            <i class="fa-solid fa-triangle-exclamation panel-header__icon panel-header__icon--error"></i>
+            Error Hotspots
+          </div>
+          <span class="panel-header__subtitle">
+            {{ ErrorHotspots.length }} source{{ ErrorHotspots.length !== 1 ? 's' : '' }}
+          </span>
+        </div>
+        <div class="panel-body">
+          @if (ErrorHotspots.length === 0) {
+            <div class="panel-empty">No errors in selected period</div>
+          }
+          @for (item of ErrorHotspots; track item.Source) {
+            <div class="error-item">
+              <div class="error-icon">
+                <i class="fa-solid fa-circle-exclamation"></i>
+              </div>
+              <div class="error-info">
+                <div class="error-source">{{ item.Source }}</div>
+                <div class="error-message" [title]="item.ErrorMessage">{{ item.ErrorMessage }}</div>
+              </div>
+              <div class="error-count">{{ item.Count }}</div>
+            </div>
+          }
+          @if (ErrorHotspots.length > 0) {
+            <button class="view-all-link" (click)="SectionNavigate.emit('error-analysis')">
+              View All Errors <i class="fa-solid fa-arrow-right"></i>
+            </button>
+          }
+        </div>
+      </div>
+    </div>
+  `, styles: ["\n    /* \u2500\u2500\u2500 Host \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    :host {\n      display: flex;\n      flex-direction: column;\n      gap: 20px;\n      padding: 4px;\n    }\n\n    /* \u2500\u2500\u2500 Loading \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .loading-container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 60px 20px;\n    }\n\n    /* \u2500\u2500\u2500 KPI Row \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .kpi-row {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n      gap: 14px;\n    }\n    .kpi-card {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-left: 4px solid var(--mj-brand-primary);\n      border-radius: 12px;\n      padding: 16px 18px;\n      display: flex;\n      flex-direction: column;\n      gap: 6px;\n      transition: all 0.25s ease;\n    }\n    .kpi-card:hover {\n      transform: translateY(-2px);\n      box-shadow: 0 6px 20px color-mix(in srgb, var(--mj-text-primary) 8%, transparent);\n    }\n    .kpi-label {\n      font-size: 10px;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.6px;\n      color: var(--mj-text-muted);\n    }\n    .kpi-value {\n      font-size: 24px;\n      font-weight: 700;\n      color: var(--mj-text-primary);\n      line-height: 1.1;\n      letter-spacing: -0.02em;\n    }\n\n    /* \u2500\u2500\u2500 Sparkline \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .kpi-sparkline {\n      display: flex;\n      align-items: flex-end;\n      gap: 2px;\n      height: 24px;\n      margin-top: 4px;\n    }\n    .spark-bar {\n      flex: 1;\n      min-width: 4px;\n      max-width: 8px;\n      border-radius: 1px;\n      opacity: 0.35;\n      transition: opacity 0.15s ease;\n    }\n    .kpi-card:hover .spark-bar {\n      opacity: 0.55;\n    }\n\n    /* \u2500\u2500\u2500 Delta Badge \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .kpi-delta {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      font-size: 11px;\n      font-weight: 600;\n      margin-top: 2px;\n    }\n    .kpi-delta--good {\n      color: var(--mj-status-success);\n    }\n    .kpi-delta--bad {\n      color: var(--mj-status-error);\n    }\n    .kpi-delta__period {\n      font-weight: 400;\n      color: var(--mj-text-disabled);\n    }\n\n    /* \u2500\u2500\u2500 Trends Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .trends-panel {\n      height: 320px;\n      border-radius: 12px;\n      overflow: hidden;\n    }\n\n    /* \u2500\u2500\u2500 Panels Grid \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .panels-grid {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 16px;\n    }\n    .panel {\n      background: var(--mj-bg-surface);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 12px;\n      overflow: hidden;\n    }\n    .panel-header {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 14px 18px;\n      border-bottom: 1px solid var(--mj-border-subtle);\n    }\n    .panel-header__title {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      font-size: 14px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n    .panel-header__icon {\n      color: var(--mj-brand-primary);\n      font-size: 14px;\n    }\n    .panel-header__icon--error {\n      color: var(--mj-status-warning);\n    }\n    .panel-header__subtitle {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n    .panel-body {\n      padding: 8px 0;\n    }\n    .panel-empty {\n      padding: 24px 18px;\n      text-align: center;\n      font-size: 13px;\n      color: var(--mj-text-disabled);\n    }\n\n    /* \u2500\u2500\u2500 Consumer Item \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .consumer-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 18px;\n      cursor: pointer;\n      transition: background 0.15s ease;\n    }\n    .consumer-item:hover {\n      background: var(--mj-bg-surface-hover);\n    }\n    .consumer-rank {\n      width: 22px;\n      height: 22px;\n      border-radius: 6px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 11px;\n      font-weight: 700;\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n      flex-shrink: 0;\n    }\n    .consumer-rank--top {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      color: var(--mj-brand-primary);\n    }\n    .consumer-type-pill {\n      font-size: 10px;\n      font-weight: 600;\n      text-transform: uppercase;\n      padding: 2px 8px;\n      border-radius: 4px;\n      background: color-mix(in srgb, var(--mj-status-info) 12%, var(--mj-bg-surface));\n      color: var(--mj-status-info);\n      flex-shrink: 0;\n    }\n    .consumer-type-pill--agent {\n      background: color-mix(in srgb, var(--mj-status-success) 12%, var(--mj-bg-surface));\n      color: var(--mj-status-success);\n    }\n    .consumer-name {\n      flex: 1;\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .consumer-cost {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n      flex-shrink: 0;\n    }\n    .consumer-bar-container {\n      width: 60px;\n      height: 6px;\n      border-radius: 3px;\n      background: var(--mj-bg-surface-sunken);\n      overflow: hidden;\n      flex-shrink: 0;\n    }\n    .consumer-bar {\n      height: 100%;\n      border-radius: 3px;\n      background: var(--mj-brand-primary);\n      transition: width 0.3s ease;\n    }\n\n    /* \u2500\u2500\u2500 Error Item \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    .error-item {\n      display: flex;\n      align-items: flex-start;\n      gap: 10px;\n      padding: 10px 18px;\n    }\n    .error-icon {\n      color: var(--mj-status-error);\n      font-size: 14px;\n      margin-top: 2px;\n      flex-shrink: 0;\n    }\n    .error-info {\n      flex: 1;\n      min-width: 0;\n    }\n    .error-source {\n      font-size: 13px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      margin-bottom: 2px;\n    }\n    .error-message {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .error-count {\n      font-size: 13px;\n      font-weight: 700;\n      color: var(--mj-status-error);\n      flex-shrink: 0;\n      min-width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 8px;\n      background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    }\n    .view-all-link {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      margin: 8px 18px 10px;\n      padding: 0;\n      border: none;\n      background: none;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-brand-primary);\n      cursor: pointer;\n      transition: color 0.15s ease;\n    }\n    .view-all-link:hover {\n      color: var(--mj-brand-primary-hover);\n    }\n\n    /* \u2500\u2500\u2500 Responsive \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n    @media (max-width: 1200px) {\n      .panels-grid {\n        grid-template-columns: 1fr;\n      }\n    }\n    @media (max-width: 768px) {\n      .kpi-row {\n        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n      }\n      .trends-panel {\n        height: 260px;\n      }\n    }\n  "] }]
+    }], null, { TimeRange: [{
+            type: Input
+        }], Filters: [{
+            type: Input
+        }], TimeRangeChange: [{
+            type: Output
+        }], FiltersChange: [{
+            type: Output
+        }], SectionNavigate: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AnalyticsExecutiveSummaryComponent, { className: "AnalyticsExecutiveSummaryComponent", filePath: "src/AI/components/analytics/executive-summary/executive-summary.component.ts", lineNumber: 481 }); })();
+export function LoadAnalyticsExecutiveSummary() {
+    // Prevents tree-shaking
+}
+//# sourceMappingURL=executive-summary.component.js.map