/**
 * @fileoverview Classify · Overview Analytics (Phase 4 audit/analytics).
 *
 * KPI cards + three hand-rolled inline-SVG charts (tag distribution bar,
 * items-over-time line, weight histogram) for the classify dataset. All numbers
 * come from `ClassifyAnalyticsEngine` so agents and UI share one source of truth.
 *
 * The engine is framework-agnostic (server + client safe); this component simply
 * calls it with the current scope and the active metadata provider. Charts are
 * SVG built from typed view models — NO charting library.
 */
import { Component, Input, ChangeDetectorRef, inject, } from '@angular/core';
import { BaseAngularComponent } from '@memberjunction/ng-base-types';
import { ClassifyAnalyticsEngine, } from '@memberjunction/tag-engine-base';
import { formatNumber, formatShortDate } from '../shared/classify.format';
import * as i0 from "@angular/core";
import * as i1 from "@memberjunction/ng-shared-generic";
import * as i2 from "@memberjunction/ng-ui-components";
const _forTrack0 = ($index, $item) => $item.Tag;
const _forTrack1 = ($index, $item) => $item.Label;
function ClassifyOverviewAnalyticsComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-loading", 1);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-empty-state", 2);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "p", 7);
    i0.ɵɵtext(1, "No tags in scope.");
    i0.ɵɵelementEnd();
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_6_For_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 11)(1, "span", 12);
    i0.ɵɵtext(2);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div", 13);
    i0.ɵɵelement(4, "div", 14);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(5, "span", 15);
    i0.ɵɵtext(6);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const bar_r1 = ctx.$implicit;
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵadvance();
    i0.ɵɵproperty("title", bar_r1.Tag);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(bar_r1.Tag);
    i0.ɵɵadvance(2);
    i0.ɵɵstyleProp("width", bar_r1.WidthPct, "%");
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(ctx_r1.FormatNumber(bar_r1.Count));
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_6_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 8);
    i0.ɵɵrepeaterCreate(1, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_6_For_2_Template, 7, 5, "div", 11, _forTrack0);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵrepeater(ctx_r1.DistributionBars);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_11_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "p", 7);
    i0.ɵɵtext(1, "No time-series data in scope.");
    i0.ɵɵelementEnd();
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_12_For_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵnamespaceSVG();
    i0.ɵɵelementStart(0, "circle", 18)(1, "title");
    i0.ɵɵtext(2);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const pt_r3 = ctx.$implicit;
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵattribute("cx", pt_r3.X)("cy", pt_r3.Y);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate2("", pt_r3.Label, ": ", ctx_r1.FormatNumber(pt_r3.Count));
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_12_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵnamespaceSVG();
    i0.ɵɵelementStart(0, "svg", 16);
    i0.ɵɵelement(1, "path", 17);
    i0.ɵɵrepeaterCreate(2, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_12_For_3_Template, 3, 4, ":svg:circle", 18, _forTrack1);
    i0.ɵɵelementEnd();
    i0.ɵɵnamespaceHTML();
    i0.ɵɵelementStart(4, "div", 19)(5, "span");
    i0.ɵɵtext(6);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(7, "span");
    i0.ɵɵtext(8);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵattribute("viewBox", "0 0 " + ctx_r1.LineWidth + " " + ctx_r1.LineHeight);
    i0.ɵɵadvance();
    i0.ɵɵattribute("d", ctx_r1.LinePath);
    i0.ɵɵadvance();
    i0.ɵɵrepeater(ctx_r1.LinePoints);
    i0.ɵɵadvance(4);
    i0.ɵɵtextInterpolate(ctx_r1.LinePoints[0].Label);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(ctx_r1.LinePoints[ctx_r1.LinePoints.length - 1].Label);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_17_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "p", 7);
    i0.ɵɵtext(1, "No weighted tags in scope.");
    i0.ɵɵelementEnd();
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_18_For_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 21);
    i0.ɵɵelement(1, "div", 23);
    i0.ɵɵelementStart(2, "span", 24);
    i0.ɵɵtext(3);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const hbar_r4 = ctx.$implicit;
    i0.ɵɵproperty("title", hbar_r4.Label + "% confidence: " + hbar_r4.Count);
    i0.ɵɵadvance();
    i0.ɵɵstyleProp("height", hbar_r4.HeightPct, "%");
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(hbar_r4.Label);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_18_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 20);
    i0.ɵɵrepeaterCreate(1, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_18_For_2_Template, 4, 4, "div", 21, _forTrack1);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div", 22);
    i0.ɵɵtext(4, "Tag weight / confidence (%)");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵrepeater(ctx_r1.HistogramBars);
} }
function ClassifyOverviewAnalyticsComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 3)(1, "div", 4)(2, "h4", 5);
    i0.ɵɵelement(3, "i", 6);
    i0.ɵɵtext(4, " Top Tags");
    i0.ɵɵelementEnd();
    i0.ɵɵconditionalCreate(5, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_5_Template, 2, 0, "p", 7)(6, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_6_Template, 3, 0, "div", 8);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(7, "div", 4)(8, "h4", 5);
    i0.ɵɵelement(9, "i", 9);
    i0.ɵɵtext(10, " Tags Over Time");
    i0.ɵɵelementEnd();
    i0.ɵɵconditionalCreate(11, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_11_Template, 2, 0, "p", 7)(12, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_12_Template, 9, 4);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(13, "div", 4)(14, "h4", 5);
    i0.ɵɵelement(15, "i", 10);
    i0.ɵɵtext(16, " Confidence Distribution");
    i0.ɵɵelementEnd();
    i0.ɵɵconditionalCreate(17, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_17_Template, 2, 0, "p", 7)(18, ClassifyOverviewAnalyticsComponent_Conditional_3_Conditional_18_Template, 5, 0);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(5);
    i0.ɵɵconditional(ctx_r1.DistributionBars.length === 0 ? 5 : 6);
    i0.ɵɵadvance(6);
    i0.ɵɵconditional(ctx_r1.LinePoints.length === 0 ? 11 : 12);
    i0.ɵɵadvance(6);
    i0.ɵɵconditional(ctx_r1.HistogramBars.length === 0 ? 17 : 18);
} }
export class ClassifyOverviewAnalyticsComponent extends BaseAngularComponent {
    cdr = inject(ChangeDetectorRef);
    async ngAfterViewInit() {
        await this.Reload();
    }
    /** Number of distinct tags shown in the distribution chart. */
    static TAG_DISTRIBUTION_LIMIT = 12;
    /** Line-chart viewBox geometry. */
    static LINE_WIDTH = 600;
    static LINE_HEIGHT = 160;
    static LINE_PAD = 8;
    /** Optional analytics scope (source / content-type / date range). Re-loads on change. */
    _scope = null;
    set Scope(value) {
        this._scope = value;
        if (this._loadedOnce)
            void this.Reload();
    }
    get Scope() {
        return this._scope;
    }
    IsLoading = false;
    HasData = false;
    KPIs = { TotalItems: 0, TotalTags: 0, AvgTagsPerItem: 0, DistinctTags: 0 };
    DistributionBars = [];
    LinePoints = [];
    LinePath = '';
    HistogramBars = [];
    // Template-facing formatters + geometry constants
    FormatNumber = formatNumber;
    LineWidth = ClassifyOverviewAnalyticsComponent.LINE_WIDTH;
    LineHeight = ClassifyOverviewAnalyticsComponent.LINE_HEIGHT;
    _loadedOnce = false;
    /** Load (or reload) all analytics for the current scope. Public entry point for the parent. */
    async Reload() {
        this.IsLoading = true;
        this.cdr.detectChanges();
        const engine = ClassifyAnalyticsEngine.Instance;
        const scope = this._scope ?? undefined;
        const user = this.ProviderToUse.CurrentUser;
        const provider = this.ProviderToUse;
        const [kpis, distribution, overTime, histogram] = await Promise.all([
            engine.GetKPIs(scope, user, provider),
            engine.GetTagDistribution(scope, user, provider, ClassifyOverviewAnalyticsComponent.TAG_DISTRIBUTION_LIMIT),
            engine.GetItemsOverTime('day', scope, user, provider),
            engine.GetWeightHistogram(10, scope, user, provider),
        ]);
        this.KPIs = kpis;
        this.buildDistribution(distribution);
        this.buildOverTime(overTime);
        this.buildHistogram(histogram);
        this.HasData = kpis.TotalTags > 0 || kpis.TotalItems > 0;
        this._loadedOnce = true;
        this.IsLoading = false;
        this.cdr.detectChanges();
    }
    buildDistribution(entries) {
        const max = entries.reduce((m, e) => Math.max(m, e.Count), 0) || 1;
        this.DistributionBars = entries.map(e => ({
            Tag: e.Tag,
            Count: e.Count,
            WidthPct: Math.round((e.Count / max) * 100),
        }));
    }
    buildOverTime(buckets) {
        if (buckets.length === 0) {
            this.LinePoints = [];
            this.LinePath = '';
            return;
        }
        const w = ClassifyOverviewAnalyticsComponent.LINE_WIDTH;
        const h = ClassifyOverviewAnalyticsComponent.LINE_HEIGHT;
        const pad = ClassifyOverviewAnalyticsComponent.LINE_PAD;
        const max = buckets.reduce((m, b) => Math.max(m, b.Count), 0) || 1;
        const innerW = w - pad * 2;
        const innerH = h - pad * 2;
        const stepX = buckets.length > 1 ? innerW / (buckets.length - 1) : 0;
        this.LinePoints = buckets.map((b, i) => {
            const x = pad + (buckets.length > 1 ? i * stepX : innerW / 2);
            const y = pad + innerH - (b.Count / max) * innerH;
            return { X: Math.round(x), Y: Math.round(y), Label: formatShortDate(b.BucketStart), Count: b.Count };
        });
        this.LinePath = this.LinePoints
            .map((p, i) => `${i === 0 ? 'M' : 'L'}${p.X},${p.Y}`)
            .join(' ');
    }
    buildHistogram(bins) {
        const max = bins.reduce((m, b) => Math.max(m, b.Count), 0) || 1;
        this.HistogramBars = bins.map(b => ({
            Label: `${Math.round(b.RangeStart * 100)}`,
            Count: b.Count,
            HeightPct: Math.round((b.Count / max) * 100),
        }));
    }
    static ɵfac = /*@__PURE__*/ (() => { let ɵClassifyOverviewAnalyticsComponent_BaseFactory; return function ClassifyOverviewAnalyticsComponent_Factory(__ngFactoryType__) { return (ɵClassifyOverviewAnalyticsComponent_BaseFactory || (ɵClassifyOverviewAnalyticsComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ClassifyOverviewAnalyticsComponent)))(__ngFactoryType__ || ClassifyOverviewAnalyticsComponent); }; })();
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ClassifyOverviewAnalyticsComponent, selectors: [["classify-overview-analytics"]], inputs: { Scope: "Scope" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 1, consts: [[1, "coa-wrap"], ["text", "Loading analytics...", "size", "small"], ["Icon", "fa-solid fa-chart-pie", "Title", "No classification data yet", "Message", "Run the pipeline to populate analytics.", 1, "coa-empty"], [1, "coa-charts"], [1, "coa-chart-card"], [1, "coa-chart-title"], [1, "fa-solid", "fa-ranking-star"], [1, "coa-muted"], [1, "coa-bars"], [1, "fa-solid", "fa-chart-line"], [1, "fa-solid", "fa-chart-column"], [1, "coa-bar-row"], [1, "coa-bar-label", 3, "title"], [1, "coa-bar-track"], [1, "coa-bar-fill"], [1, "coa-bar-count"], ["preserveAspectRatio", "none", 1, "coa-line-svg"], ["fill", "none", 1, "coa-line-path"], ["r", "2.5", 1, "coa-line-dot"], [1, "coa-line-axis"], [1, "coa-histogram"], [1, "coa-hbar-col", 3, "title"], [1, "coa-hist-caption"], [1, "coa-hbar-fill"], [1, "coa-hbar-axis"]], template: function ClassifyOverviewAnalyticsComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0);
            i0.ɵɵconditionalCreate(1, ClassifyOverviewAnalyticsComponent_Conditional_1_Template, 1, 0, "mj-loading", 1)(2, ClassifyOverviewAnalyticsComponent_Conditional_2_Template, 1, 0, "mj-empty-state", 2)(3, ClassifyOverviewAnalyticsComponent_Conditional_3_Template, 19, 3, "div", 3);
            i0.ɵɵelementEnd();
        } if (rf & 2) {
            i0.ɵɵadvance();
            i0.ɵɵconditional(ctx.IsLoading ? 1 : !ctx.HasData ? 2 : 3);
        } }, dependencies: [i1.LoadingComponent, i2.MJEmptyStateComponent], styles: [".coa-wrap[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n}\n\n\n\n.coa-kpi-strip[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\n    gap: 12px;\n}\n\n.coa-kpi-card[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 12px 14px;\n}\n\n.coa-kpi-value[_ngcontent-%COMP%] {\n    font-size: 1.6rem;\n    font-weight: 700;\n    color: var(--mj-text-primary);\n    line-height: 1.1;\n}\n\n.coa-kpi-label[_ngcontent-%COMP%] {\n    margin-top: 4px;\n    font-size: 0.78rem;\n    color: var(--mj-text-muted);\n    display: flex;\n    align-items: center;\n    gap: 5px;\n}\n\n.coa-kpi-label[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n}\n\n\n\n.coa-charts[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.coa-chart-card[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 12px 14px;\n    min-width: 0;\n}\n\n.coa-chart-title[_ngcontent-%COMP%] {\n    margin: 0 0 12px 0;\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.coa-chart-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n}\n\n.coa-muted[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: 0.8rem;\n    margin: 0;\n}\n\n\n\n.coa-bars[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n}\n\n.coa-bar-row[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 110px 1fr 48px;\n    align-items: center;\n    gap: 8px;\n}\n\n.coa-bar-label[_ngcontent-%COMP%] {\n    font-size: 0.78rem;\n    color: var(--mj-text-secondary);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.coa-bar-track[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-sm);\n    height: 14px;\n    overflow: hidden;\n}\n\n.coa-bar-fill[_ngcontent-%COMP%] {\n    height: 100%;\n    background: var(--mj-brand-primary);\n    border-radius: var(--mj-radius-sm);\n    transition: width 0.3s ease;\n}\n\n.coa-bar-count[_ngcontent-%COMP%] {\n    font-size: 0.76rem;\n    color: var(--mj-text-muted);\n    text-align: right;\n}\n\n\n\n.coa-line-svg[_ngcontent-%COMP%] {\n    width: 100%;\n    height: 160px;\n    display: block;\n}\n\n.coa-line-path[_ngcontent-%COMP%] {\n    stroke: var(--mj-brand-primary);\n    stroke-width: 2;\n    vector-effect: non-scaling-stroke;\n}\n\n.coa-line-dot[_ngcontent-%COMP%] {\n    fill: var(--mj-brand-primary);\n}\n\n.coa-line-axis[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 4px;\n    font-size: 0.72rem;\n    color: var(--mj-text-muted);\n}\n\n\n\n.coa-histogram[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-end;\n    gap: 4px;\n    height: 150px;\n    padding-top: 8px;\n}\n\n.coa-hbar-col[_ngcontent-%COMP%] {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: flex-end;\n    height: 100%;\n    min-width: 0;\n}\n\n.coa-hbar-fill[_ngcontent-%COMP%] {\n    width: 70%;\n    min-height: 2px;\n    background: var(--mj-brand-primary);\n    border-radius: var(--mj-radius-sm) var(--mj-radius-sm) 0 0;\n    transition: height 0.3s ease;\n}\n\n.coa-hbar-axis[_ngcontent-%COMP%] {\n    margin-top: 4px;\n    font-size: 0.66rem;\n    color: var(--mj-text-muted);\n}\n\n.coa-hist-caption[_ngcontent-%COMP%] {\n    margin-top: 6px;\n    text-align: center;\n    font-size: 0.72rem;\n    color: var(--mj-text-muted);\n}\n\n\n\n.coa-empty[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    padding: 32px 16px;\n    color: var(--mj-text-muted);\n    text-align: center;\n}\n\n.coa-empty[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 1.8rem;\n    color: var(--mj-text-disabled);\n}\n\n.coa-empty[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 0.85rem;\n}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ClassifyOverviewAnalyticsComponent, [{
        type: Component,
        args: [{ standalone: false, selector: 'classify-overview-analytics', template: "<div class=\"coa-wrap\">\n\n  <!-- KPI cards removed: the Pipeline Monitor's top KPI strip is now the single\n       canonical headline-metrics row (Active Sources / Content Items / Total Tags /\n       Avg Tags per Item / Errors). This section renders charts only, eliminating the\n       duplicate \"Content Items\" + \"Total Tags\" cards that previously appeared twice. -->\n\n  @if (IsLoading) {\n    <mj-loading text=\"Loading analytics...\" size=\"small\"></mj-loading>\n  } @else if (!HasData) {\n    <mj-empty-state class=\"coa-empty\" Icon=\"fa-solid fa-chart-pie\"\n      Title=\"No classification data yet\" Message=\"Run the pipeline to populate analytics.\" />\n  } @else {\n    <div class=\"coa-charts\">\n\n      <!-- Tag distribution (horizontal bars) -->\n      <div class=\"coa-chart-card\">\n        <h4 class=\"coa-chart-title\"><i class=\"fa-solid fa-ranking-star\"></i> Top Tags</h4>\n        @if (DistributionBars.length === 0) {\n          <p class=\"coa-muted\">No tags in scope.</p>\n        } @else {\n          <div class=\"coa-bars\">\n            @for (bar of DistributionBars; track bar.Tag) {\n              <div class=\"coa-bar-row\">\n                <span class=\"coa-bar-label\" [title]=\"bar.Tag\">{{ bar.Tag }}</span>\n                <div class=\"coa-bar-track\">\n                  <div class=\"coa-bar-fill\" [style.width.%]=\"bar.WidthPct\"></div>\n                </div>\n                <span class=\"coa-bar-count\">{{ FormatNumber(bar.Count) }}</span>\n              </div>\n            }\n          </div>\n        }\n      </div>\n\n      <!-- Items over time (line) -->\n      <div class=\"coa-chart-card\">\n        <h4 class=\"coa-chart-title\"><i class=\"fa-solid fa-chart-line\"></i> Tags Over Time</h4>\n        @if (LinePoints.length === 0) {\n          <p class=\"coa-muted\">No time-series data in scope.</p>\n        } @else {\n          <svg class=\"coa-line-svg\" [attr.viewBox]=\"'0 0 ' + LineWidth + ' ' + LineHeight\" preserveAspectRatio=\"none\">\n            <path class=\"coa-line-path\" [attr.d]=\"LinePath\" fill=\"none\" />\n            @for (pt of LinePoints; track pt.Label) {\n              <circle class=\"coa-line-dot\" [attr.cx]=\"pt.X\" [attr.cy]=\"pt.Y\" r=\"2.5\">\n                <title>{{ pt.Label }}: {{ FormatNumber(pt.Count) }}</title>\n              </circle>\n            }\n          </svg>\n          <div class=\"coa-line-axis\">\n            <span>{{ LinePoints[0].Label }}</span>\n            <span>{{ LinePoints[LinePoints.length - 1].Label }}</span>\n          </div>\n        }\n      </div>\n\n      <!-- Weight histogram (vertical bars) -->\n      <div class=\"coa-chart-card\">\n        <h4 class=\"coa-chart-title\"><i class=\"fa-solid fa-chart-column\"></i> Confidence Distribution</h4>\n        @if (HistogramBars.length === 0) {\n          <p class=\"coa-muted\">No weighted tags in scope.</p>\n        } @else {\n          <div class=\"coa-histogram\">\n            @for (hbar of HistogramBars; track hbar.Label) {\n              <div class=\"coa-hbar-col\" [title]=\"hbar.Label + '% confidence: ' + hbar.Count\">\n                <div class=\"coa-hbar-fill\" [style.height.%]=\"hbar.HeightPct\"></div>\n                <span class=\"coa-hbar-axis\">{{ hbar.Label }}</span>\n              </div>\n            }\n          </div>\n          <div class=\"coa-hist-caption\">Tag weight / confidence (%)</div>\n        }\n      </div>\n\n    </div>\n  }\n</div>\n", styles: [".coa-wrap {\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n}\n\n/* KPI cards */\n.coa-kpi-strip {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\n    gap: 12px;\n}\n\n.coa-kpi-card {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 12px 14px;\n}\n\n.coa-kpi-value {\n    font-size: 1.6rem;\n    font-weight: 700;\n    color: var(--mj-text-primary);\n    line-height: 1.1;\n}\n\n.coa-kpi-label {\n    margin-top: 4px;\n    font-size: 0.78rem;\n    color: var(--mj-text-muted);\n    display: flex;\n    align-items: center;\n    gap: 5px;\n}\n\n.coa-kpi-label i {\n    color: var(--mj-brand-primary);\n}\n\n/* Chart grid */\n.coa-charts {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.coa-chart-card {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 12px 14px;\n    min-width: 0;\n}\n\n.coa-chart-title {\n    margin: 0 0 12px 0;\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.coa-chart-title i {\n    color: var(--mj-brand-primary);\n}\n\n.coa-muted {\n    color: var(--mj-text-muted);\n    font-size: 0.8rem;\n    margin: 0;\n}\n\n/* Tag distribution bars */\n.coa-bars {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n}\n\n.coa-bar-row {\n    display: grid;\n    grid-template-columns: 110px 1fr 48px;\n    align-items: center;\n    gap: 8px;\n}\n\n.coa-bar-label {\n    font-size: 0.78rem;\n    color: var(--mj-text-secondary);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.coa-bar-track {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-sm);\n    height: 14px;\n    overflow: hidden;\n}\n\n.coa-bar-fill {\n    height: 100%;\n    background: var(--mj-brand-primary);\n    border-radius: var(--mj-radius-sm);\n    transition: width 0.3s ease;\n}\n\n.coa-bar-count {\n    font-size: 0.76rem;\n    color: var(--mj-text-muted);\n    text-align: right;\n}\n\n/* Line chart */\n.coa-line-svg {\n    width: 100%;\n    height: 160px;\n    display: block;\n}\n\n.coa-line-path {\n    stroke: var(--mj-brand-primary);\n    stroke-width: 2;\n    vector-effect: non-scaling-stroke;\n}\n\n.coa-line-dot {\n    fill: var(--mj-brand-primary);\n}\n\n.coa-line-axis {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 4px;\n    font-size: 0.72rem;\n    color: var(--mj-text-muted);\n}\n\n/* Histogram */\n.coa-histogram {\n    display: flex;\n    align-items: flex-end;\n    gap: 4px;\n    height: 150px;\n    padding-top: 8px;\n}\n\n.coa-hbar-col {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: flex-end;\n    height: 100%;\n    min-width: 0;\n}\n\n.coa-hbar-fill {\n    width: 70%;\n    min-height: 2px;\n    background: var(--mj-brand-primary);\n    border-radius: var(--mj-radius-sm) var(--mj-radius-sm) 0 0;\n    transition: height 0.3s ease;\n}\n\n.coa-hbar-axis {\n    margin-top: 4px;\n    font-size: 0.66rem;\n    color: var(--mj-text-muted);\n}\n\n.coa-hist-caption {\n    margin-top: 6px;\n    text-align: center;\n    font-size: 0.72rem;\n    color: var(--mj-text-muted);\n}\n\n/* Empty state */\n.coa-empty {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    padding: 32px 16px;\n    color: var(--mj-text-muted);\n    text-align: center;\n}\n\n.coa-empty i {\n    font-size: 1.8rem;\n    color: var(--mj-text-disabled);\n}\n\n.coa-empty p {\n    margin: 0;\n    font-size: 0.85rem;\n}\n"] }]
    }], null, { Scope: [{
            type: Input
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ClassifyOverviewAnalyticsComponent, { className: "ClassifyOverviewAnalyticsComponent", filePath: "src/AI/components/autotagging/components/classify-overview-analytics.component.ts", lineNumber: 58 }); })();
//# sourceMappingURL=classify-overview-analytics.component.js.map