@memberjunction/ng-core-entity-forms 5.43.0 → 5.44.0

package/dist/lib/panels/model-predictions/model-prediction.panel.js

@@ -0,0 +1,293 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component } from '@angular/core';
+import { RegisterClassEx } from '@memberjunction/global';
+import { BaseFormPanel } from '@memberjunction/ng-base-forms';
+import { LogError, Metadata, RunView } from '@memberjunction/core';
+import { bandFor, formatLastScored, formatValue, gaugePct, parseDrivers, resolveLabel, toNumber, valueKind, } from './model-prediction.logic';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-base-forms";
+const _forTrack0 = ($index, $item) => $item.bindingId;
+const _forTrack1 = ($index, $item) => $item.name;
+function ModelPredictionPanel_Conditional_0_For_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 11);
+    i0.ɵɵtext(1, "\u00B7");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "span", 12);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const card_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("Scored ", card_r1.lastScored);
+} }
+function ModelPredictionPanel_Conditional_0_For_3_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 9)(1, "div", 13);
+    i0.ɵɵelement(2, "div", 14);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 15)(4, "span");
+    i0.ɵɵtext(5, "0%");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7, "50%");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "span");
+    i0.ɵɵtext(9, "100%");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const card_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵattribute("aria-label", card_r1.label + " " + card_r1.displayValue + ", " + card_r1.band + " band");
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("width", card_r1.gaugePct, "%");
+    i0.ɵɵclassProp("mpp-band-low", card_r1.band === "low")("mpp-band-mid", card_r1.band === "mid")("mpp-band-high", card_r1.band === "high");
+} }
+function ModelPredictionPanel_Conditional_0_For_3_Conditional_13_For_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 18)(1, "span", 19);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 20);
+    i0.ɵɵelement(4, "span", 21);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const driver_r2 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", driver_r2.name);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(driver_r2.name);
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("width", driver_r2.relativePct, "%");
+} }
+function ModelPredictionPanel_Conditional_0_For_3_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 10)(1, "div", 16);
+    i0.ɵɵelement(2, "i", 17);
+    i0.ɵɵtext(3, " Top drivers ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(4, ModelPredictionPanel_Conditional_0_For_3_Conditional_13_For_5_Template, 5, 4, "div", 18, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const card_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(card_r1.drivers);
+} }
+function ModelPredictionPanel_Conditional_0_For_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "div", 5);
+    i0.ɵɵelement(5, "i", 6);
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(8, ModelPredictionPanel_Conditional_0_For_3_Conditional_8_Template, 4, 1);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(9, "div", 7)(10, "span", 8);
+    i0.ɵɵtext(11);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(12, ModelPredictionPanel_Conditional_0_For_3_Conditional_12_Template, 10, 9, "div", 9);
+    i0.ɵɵconditionalCreate(13, ModelPredictionPanel_Conditional_0_For_3_Conditional_13_Template, 6, 0, "div", 10);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const card_r1 = ctx.$implicit;
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(card_r1.label);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(card_r1.provenance);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(card_r1.lastScored ? 8 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("mpp-value-muted", card_r1.displayValue === "\u2014");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", card_r1.displayValue, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(card_r1.isProbability ? 12 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(card_r1.drivers.length > 0 ? 13 : -1);
+} }
+function ModelPredictionPanel_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-collapsible-panel", 0)(1, "div", 1);
+    i0.ɵɵrepeaterCreate(2, ModelPredictionPanel_Conditional_0_For_3_Template, 14, 8, "div", 2, _forTrack0);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Form", ctx_r2.FormComponent)("FormContext", ctx_r2.FormContext)("BadgeCount", ctx_r2.Cards.length);
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(ctx_r2.Cards);
+} }
+/**
+ * Model Prediction panel — an **entity-agnostic** form panel that surfaces any
+ * predictions a trained ML model has written onto the current record via a
+ * `MJ: ML Model Scoring Bindings` row.
+ *
+ * It registers against the `'*'` wildcard entity, so it mounts on EVERY entity
+ * form — but renders **nothing** unless the record's entity has at least one
+ * active scoring binding. The 99% of forms with no model see an invisible,
+ * one-RunView-cheap panel.
+ *
+ * Driven entirely by metadata (bindings + models); there is no entity-specific,
+ * domain-specific, or "renewal/risk"-specific logic anywhere. Members/renewal
+ * is only ever a test example.
+ *
+ * Self-mounts via the `after-fields` slot. Reusable as a plain component too
+ * (composition) by binding `[Record]` + `[FormComponent]`.
+ */
+let ModelPredictionPanel = class ModelPredictionPanel extends BaseFormPanel {
+    constructor() {
+        super(...arguments);
+        /** The resolved cards to render. Empty → panel renders nothing. */
+        this.Cards = [];
+        /** True once the binding lookup has completed (success or empty). */
+        this.Loaded = false;
+        /** Entity-ID we last loaded cards for, to avoid redundant lookups. */
+        this.loadedForEntityId = null;
+    }
+    async ngOnInit() {
+        await this.loadCards();
+    }
+    /** True when there is at least one card to show — gates the whole template. */
+    get HasPredictions() {
+        return this.Cards.length > 0;
+    }
+    /**
+     * Look up active scoring bindings for THIS record's entity and build a card
+     * per binding. Idempotent + cheap: a single RunView (cached by the server),
+     * skipped entirely when we've already loaded for this entity.
+     */
+    async loadCards() {
+        const entityId = this.Record?.EntityInfo?.ID ?? null;
+        if (!entityId) {
+            this.Loaded = true;
+            return;
+        }
+        if (entityId === this.loadedForEntityId) {
+            return; // already resolved for this entity
+        }
+        this.loadedForEntityId = entityId;
+        try {
+            const bindings = await this.loadBindingsForEntity(entityId);
+            if (bindings.length === 0) {
+                this.Cards = [];
+                this.Loaded = true;
+                return;
+            }
+            const models = await this.loadModelsForBindings(bindings);
+            this.Cards = this.buildCards(bindings, models);
+        }
+        catch (e) {
+            LogError(`[ModelPredictionPanel] Failed to load predictions: ${e instanceof Error ? e.message : String(e)}`);
+            this.Cards = [];
+        }
+        finally {
+            this.Loaded = true;
+        }
+    }
+    /** Active scoring bindings whose target entity is the current record's entity. */
+    async loadBindingsForEntity(entityId) {
+        const rv = this.runView();
+        const result = await rv.RunView({
+            EntityName: 'MJ: ML Model Scoring Bindings',
+            ExtraFilter: `TargetEntityID='${entityId}' AND TargetColumn IS NOT NULL`,
+            OrderBy: '__mj_CreatedAt ASC',
+            ResultType: 'entity_object',
+        }, this.contextUser());
+        if (!result.Success) {
+            LogError(`[ModelPredictionPanel] Binding lookup failed: ${result.ErrorMessage}`);
+            return [];
+        }
+        return result.Results ?? [];
+    }
+    /** Load the distinct models referenced by the bindings, keyed by model ID. */
+    async loadModelsForBindings(bindings) {
+        const modelIds = [...new Set(bindings.map(b => b.MLModelID).filter((id) => !!id))];
+        const byId = new Map();
+        if (modelIds.length === 0) {
+            return byId;
+        }
+        const inList = modelIds.map(id => `'${id}'`).join(',');
+        const rv = this.runView();
+        const result = await rv.RunView({
+            EntityName: 'MJ: ML Models',
+            ExtraFilter: `ID IN (${inList})`,
+            ResultType: 'entity_object',
+        }, this.contextUser());
+        if (!result.Success) {
+            LogError(`[ModelPredictionPanel] Model lookup failed: ${result.ErrorMessage}`);
+            return byId;
+        }
+        for (const model of result.Results ?? []) {
+            byId.set(model.ID, model);
+        }
+        return byId;
+    }
+    /** Map each binding (+ its model) to a display card. Skips bindings whose model is missing. */
+    buildCards(bindings, models) {
+        const cards = [];
+        for (const binding of bindings) {
+            const model = binding.MLModelID ? models.get(binding.MLModelID) : undefined;
+            if (!model) {
+                continue;
+            }
+            cards.push(this.buildCard(binding, model));
+        }
+        return cards;
+    }
+    /** Build one card from a binding + model + the record's bound-column value. */
+    buildCard(binding, model) {
+        // The column name is data-driven (from the binding), so reading it
+        // dynamically via Get() is the legitimate use of the dynamic accessor.
+        const rawValue = binding.TargetColumn ? this.Record.Get(binding.TargetColumn) : null;
+        const numeric = toNumber(rawValue);
+        const kind = valueKind(model.ProblemType, numeric);
+        return {
+            bindingId: binding.ID,
+            label: resolveLabel(model.TargetVariable, binding.TargetColumn),
+            isProbability: kind === 'probability',
+            isNumeric: kind === 'numeric',
+            isClass: kind === 'class',
+            displayValue: formatValue(rawValue, numeric, kind),
+            gaugePct: kind === 'probability' && numeric != null ? gaugePct(numeric) : 0,
+            band: kind === 'probability' && numeric != null ? bandFor(numeric) : null,
+            drivers: parseDrivers(model.FeatureImportance),
+            provenance: `${model.Pipeline} v${model.Version}`,
+            lastScored: formatLastScored(binding.LastScoredAt),
+        };
+    }
+    /** RunView scoped to the form's provider when available (multi-provider safe). */
+    runView() {
+        const provider = this.FormComponent?.ProviderToUse;
+        return provider ? RunView.FromMetadataProvider(provider) : new RunView();
+    }
+    /** Context user for server-side scoping — the form provider's current user. */
+    contextUser() {
+        return this.FormComponent?.ProviderToUse?.CurrentUser ?? new Metadata().CurrentUser;
+    }
+    static { this.ɵfac = /*@__PURE__*/ (() => { let ɵModelPredictionPanel_BaseFactory; return function ModelPredictionPanel_Factory(__ngFactoryType__) { return (ɵModelPredictionPanel_BaseFactory || (ɵModelPredictionPanel_BaseFactory = i0.ɵɵgetInheritedFactory(ModelPredictionPanel)))(__ngFactoryType__ || ModelPredictionPanel); }; })(); }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ModelPredictionPanel, selectors: [["mj-model-prediction-panel"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["SectionKey", "modelPredictions", "SectionName", "Model Predictions", "Icon", "fa-solid fa-wand-magic-sparkles", 3, "Form", "FormContext", "BadgeCount"], [1, "mpp-cards"], [1, "mpp-card"], [1, "mpp-card-head"], [1, "mpp-label"], [1, "mpp-provenance"], ["aria-hidden", "true", 1, "fa-solid", "fa-diagram-project", "mpp-prov-icon"], [1, "mpp-value-row"], [1, "mpp-value"], ["role", "img", 1, "mpp-gauge"], [1, "mpp-drivers"], ["aria-hidden", "true", 1, "mpp-dot"], [1, "mpp-scored"], [1, "mpp-gauge-track"], [1, "mpp-gauge-fill"], [1, "mpp-gauge-scale"], [1, "mpp-drivers-title"], ["aria-hidden", "true", 1, "fa-solid", "fa-ranking-star"], [1, "mpp-driver"], [1, "mpp-driver-name", 3, "title"], [1, "mpp-driver-bar-track"], [1, "mpp-driver-bar-fill"]], template: function ModelPredictionPanel_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵconditionalCreate(0, ModelPredictionPanel_Conditional_0_Template, 4, 3, "mj-collapsible-panel", 0);
+        } if (rf & 2) {
+            i0.ɵɵconditional(ctx.HasPredictions ? 0 : -1);
+        } }, dependencies: [i1.MjCollapsiblePanelComponent], styles: ["\n\n\n\n\n\n.mpp-cards[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    padding: 4px 2px;\n}\n\n.mpp-card[_ngcontent-%COMP%] {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md, 8px);\n    background: var(--mj-bg-surface-card);\n    padding: 14px 16px;\n}\n\n\n\n.mpp-card-head[_ngcontent-%COMP%] {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: 8px;\n    margin-bottom: 8px;\n}\n\n.mpp-label[_ngcontent-%COMP%] {\n    font-size: 0.95rem;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n}\n\n.mpp-provenance[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    font-size: 0.75rem;\n    color: var(--mj-text-muted);\n}\n\n.mpp-prov-icon[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n}\n\n.mpp-dot[_ngcontent-%COMP%] {\n    color: var(--mj-text-disabled);\n}\n\n\n\n.mpp-value-row[_ngcontent-%COMP%] {\n    margin: 2px 0 10px;\n}\n\n.mpp-value[_ngcontent-%COMP%] {\n    font-size: 1.75rem;\n    font-weight: 700;\n    line-height: 1.1;\n    color: var(--mj-text-primary);\n    font-variant-numeric: tabular-nums;\n}\n\n.mpp-value-muted[_ngcontent-%COMP%] {\n    color: var(--mj-text-disabled);\n    font-weight: 500;\n}\n\n\n\n.mpp-gauge[_ngcontent-%COMP%] {\n    margin-bottom: 4px;\n}\n\n.mpp-gauge-track[_ngcontent-%COMP%] {\n    position: relative;\n    height: 10px;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-bg-surface-sunken);\n    overflow: hidden;\n}\n\n.mpp-gauge-fill[_ngcontent-%COMP%] {\n    height: 100%;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-brand-primary);\n    transition: width 0.3s ease;\n}\n\n\n\n.mpp-band-low[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-brand-primary) 55%, transparent);\n}\n.mpp-band-mid[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-brand-primary) 78%, transparent);\n}\n.mpp-band-high[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n}\n\n.mpp-gauge-scale[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 4px;\n    font-size: 0.68rem;\n    color: var(--mj-text-muted);\n    font-variant-numeric: tabular-nums;\n}\n\n\n\n.mpp-drivers[_ngcontent-%COMP%] {\n    margin-top: 12px;\n    padding-top: 10px;\n    border-top: 1px solid var(--mj-border-subtle, var(--mj-border-default));\n}\n\n.mpp-drivers-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 0.72rem;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: var(--mj-text-secondary);\n    margin-bottom: 8px;\n}\n\n.mpp-driver[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: minmax(80px, 38%) 1fr;\n    align-items: center;\n    gap: 10px;\n    margin-bottom: 6px;\n}\n\n.mpp-driver-name[_ngcontent-%COMP%] {\n    font-size: 0.8rem;\n    color: var(--mj-text-secondary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.mpp-driver-bar-track[_ngcontent-%COMP%] {\n    display: block;\n    height: 7px;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-bg-surface-sunken);\n    overflow: hidden;\n}\n\n.mpp-driver-bar-fill[_ngcontent-%COMP%] {\n    display: block;\n    height: 100%;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: color-mix(in srgb, var(--mj-brand-primary) 70%, transparent);\n    transition: width 0.3s ease;\n}"] }); }
+};
+ModelPredictionPanel = __decorate([
+    RegisterClassEx(BaseFormPanel, {
+        key: 'model-predictions:model-prediction',
+        skipNullKeyWarning: true,
+        metadata: {
+            entity: '*', // wildcard — appears on every entity form, self-hides when N/A
+            slot: 'after-fields',
+            sortKey: 40,
+        },
+    })
+], ModelPredictionPanel);
+export { ModelPredictionPanel };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ModelPredictionPanel, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-model-prediction-panel', template: "<!--\n  Entity-agnostic model-prediction panel. Renders NOTHING unless the current\n  record's entity has active scoring bindings (HasPredictions gate). Driven\n  entirely by metadata \u2014 no entity-specific or domain-specific markup.\n-->\n@if (HasPredictions) {\n  <mj-collapsible-panel\n      SectionKey=\"modelPredictions\"\n      SectionName=\"Model Predictions\"\n      Icon=\"fa-solid fa-wand-magic-sparkles\"\n      [Form]=\"FormComponent\"\n      [FormContext]=\"FormContext\"\n      [BadgeCount]=\"Cards.length\">\n\n    <div class=\"mpp-cards\">\n      @for (card of Cards; track card.bindingId) {\n        <div class=\"mpp-card\">\n\n          <!-- Header: label + provenance -->\n          <div class=\"mpp-card-head\">\n            <div class=\"mpp-label\">{{ card.label }}</div>\n            <div class=\"mpp-provenance\">\n              <i class=\"fa-solid fa-diagram-project mpp-prov-icon\" aria-hidden=\"true\"></i>\n              <span>{{ card.provenance }}</span>\n              @if (card.lastScored) {\n                <span class=\"mpp-dot\" aria-hidden=\"true\">\u00B7</span>\n                <span class=\"mpp-scored\">Scored {{ card.lastScored }}</span>\n              }\n            </div>\n          </div>\n\n          <!-- Value -->\n          <div class=\"mpp-value-row\">\n            <span class=\"mpp-value\" [class.mpp-value-muted]=\"card.displayValue === '\u2014'\">\n              {{ card.displayValue }}\n            </span>\n          </div>\n\n          <!-- Probability gauge \u2014 neutral 3-band tercile. No moral direction. -->\n          @if (card.isProbability) {\n            <div class=\"mpp-gauge\" role=\"img\"\n                 [attr.aria-label]=\"card.label + ' ' + card.displayValue + ', ' + card.band + ' band'\">\n              <div class=\"mpp-gauge-track\">\n                <div class=\"mpp-gauge-fill\"\n                     [class.mpp-band-low]=\"card.band === 'low'\"\n                     [class.mpp-band-mid]=\"card.band === 'mid'\"\n                     [class.mpp-band-high]=\"card.band === 'high'\"\n                     [style.width.%]=\"card.gaugePct\"></div>\n              </div>\n              <div class=\"mpp-gauge-scale\">\n                <span>0%</span>\n                <span>50%</span>\n                <span>100%</span>\n              </div>\n            </div>\n          }\n\n          <!-- Top drivers (feature importance) \u2014 omitted cleanly when unavailable -->\n          @if (card.drivers.length > 0) {\n            <div class=\"mpp-drivers\">\n              <div class=\"mpp-drivers-title\">\n                <i class=\"fa-solid fa-ranking-star\" aria-hidden=\"true\"></i>\n                Top drivers\n              </div>\n              @for (driver of card.drivers; track driver.name) {\n                <div class=\"mpp-driver\">\n                  <span class=\"mpp-driver-name\" [title]=\"driver.name\">{{ driver.name }}</span>\n                  <span class=\"mpp-driver-bar-track\">\n                    <span class=\"mpp-driver-bar-fill\" [style.width.%]=\"driver.relativePct\"></span>\n                  </span>\n                </div>\n              }\n            </div>\n          }\n\n        </div>\n      }\n    </div>\n\n  </mj-collapsible-panel>\n}\n", styles: ["/* Entity-agnostic model-prediction panel.\n   Design-token-clean: every color is a --mj-* semantic token. The gauge bands\n   are intentionally NEUTRAL \u2014 they encode position on the value axis (low/mid/high)\n   via opacity of a single brand color, never green=good / red=bad. */\n\n.mpp-cards {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    padding: 4px 2px;\n}\n\n.mpp-card {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md, 8px);\n    background: var(--mj-bg-surface-card);\n    padding: 14px 16px;\n}\n\n/* ---- Header ---- */\n.mpp-card-head {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: 8px;\n    margin-bottom: 8px;\n}\n\n.mpp-label {\n    font-size: 0.95rem;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n}\n\n.mpp-provenance {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    font-size: 0.75rem;\n    color: var(--mj-text-muted);\n}\n\n.mpp-prov-icon {\n    color: var(--mj-brand-primary);\n}\n\n.mpp-dot {\n    color: var(--mj-text-disabled);\n}\n\n/* ---- Primary value ---- */\n.mpp-value-row {\n    margin: 2px 0 10px;\n}\n\n.mpp-value {\n    font-size: 1.75rem;\n    font-weight: 700;\n    line-height: 1.1;\n    color: var(--mj-text-primary);\n    font-variant-numeric: tabular-nums;\n}\n\n.mpp-value-muted {\n    color: var(--mj-text-disabled);\n    font-weight: 500;\n}\n\n/* ---- Gauge (neutral tercile) ---- */\n.mpp-gauge {\n    margin-bottom: 4px;\n}\n\n.mpp-gauge-track {\n    position: relative;\n    height: 10px;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-bg-surface-sunken);\n    overflow: hidden;\n}\n\n.mpp-gauge-fill {\n    height: 100%;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-brand-primary);\n    transition: width 0.3s ease;\n}\n\n/* Band shading: same brand hue, varied opacity = neutral position cue only. */\n.mpp-band-low {\n    background: color-mix(in srgb, var(--mj-brand-primary) 55%, transparent);\n}\n.mpp-band-mid {\n    background: color-mix(in srgb, var(--mj-brand-primary) 78%, transparent);\n}\n.mpp-band-high {\n    background: var(--mj-brand-primary);\n}\n\n.mpp-gauge-scale {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 4px;\n    font-size: 0.68rem;\n    color: var(--mj-text-muted);\n    font-variant-numeric: tabular-nums;\n}\n\n/* ---- Drivers ---- */\n.mpp-drivers {\n    margin-top: 12px;\n    padding-top: 10px;\n    border-top: 1px solid var(--mj-border-subtle, var(--mj-border-default));\n}\n\n.mpp-drivers-title {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 0.72rem;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: var(--mj-text-secondary);\n    margin-bottom: 8px;\n}\n\n.mpp-driver {\n    display: grid;\n    grid-template-columns: minmax(80px, 38%) 1fr;\n    align-items: center;\n    gap: 10px;\n    margin-bottom: 6px;\n}\n\n.mpp-driver-name {\n    font-size: 0.8rem;\n    color: var(--mj-text-secondary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.mpp-driver-bar-track {\n    display: block;\n    height: 7px;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: var(--mj-bg-surface-sunken);\n    overflow: hidden;\n}\n\n.mpp-driver-bar-fill {\n    display: block;\n    height: 100%;\n    border-radius: var(--mj-radius-full, 9999px);\n    background: color-mix(in srgb, var(--mj-brand-primary) 70%, transparent);\n    transition: width 0.3s ease;\n}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ModelPredictionPanel, { className: "ModelPredictionPanel", filePath: "src/lib/panels/model-predictions/model-prediction.panel.ts", lineNumber: 80 }); })();
+/** Tree-shake guard — call this from the consuming module's loader. */
+export function LoadModelPredictionPanel() { }
+//# sourceMappingURL=model-prediction.panel.js.map

package/dist/lib/panels/model-predictions/model-prediction.panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"model-prediction.panel.js","sourceRoot":"","sources":["../../../../src/lib/panels/model-predictions/model-prediction.panel.ts","../../../../src/lib/panels/model-predictions/model-prediction.panel.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnInit } from '@angular/core';\nimport { RegisterClassEx } from '@memberjunction/global';\nimport { BaseFormPanel } from '@memberjunction/ng-base-forms';\nimport { LogError, Metadata, RunView } from '@memberjunction/core';\nimport { MJMLModelEntity, MJMLModelScoringBindingEntity } from '@memberjunction/core-entities';\nimport {\n    PredictionBand,\n    PredictionDriver,\n    bandFor,\n    formatLastScored,\n    formatValue,\n    gaugePct,\n    parseDrivers,\n    resolveLabel,\n    toNumber,\n    valueKind,\n} from './model-prediction.logic';\n\n/**\n * A fully-resolved, entity-agnostic prediction card view-model. One per active\n * scoring binding on the current record's entity.\n */\nexport interface PredictionCard {\n    /** Binding ID — used as the @for track key. */\n    bindingId: string;\n    /** Human label for the prediction (model target → bound column → fallback). */\n    label: string;\n    /** True when the model is a 0–1 probability we can render as a gauge. */\n    isProbability: boolean;\n    /** True for regression models showing a raw numeric value. */\n    isNumeric: boolean;\n    /** True for classification models showing a class label. */\n    isClass: boolean;\n    /** Pre-formatted primary value string (\"72%\", \"1,240.5\", \"Renewing\", \"—\"). */\n    displayValue: string;\n    /** 0–100 fill for the probability gauge (only meaningful when isProbability). */\n    gaugePct: number;\n    /** Neutral band for the gauge segment styling (only meaningful when isProbability). */\n    band: PredictionBand | null;\n    /** Top feature-importance drivers, or empty when unavailable. */\n    drivers: PredictionDriver[];\n    /** Provenance: \"Pipeline Name v3\". */\n    provenance: string;\n    /** \"Last scored\" timestamp string, or null when unavailable. */\n    lastScored: string | null;\n}\n\n/**\n * Model Prediction panel — an **entity-agnostic** form panel that surfaces any\n * predictions a trained ML model has written onto the current record via a\n * `MJ: ML Model Scoring Bindings` row.\n *\n * It registers against the `'*'` wildcard entity, so it mounts on EVERY entity\n * form — but renders **nothing** unless the record's entity has at least one\n * active scoring binding. The 99% of forms with no model see an invisible,\n * one-RunView-cheap panel.\n *\n * Driven entirely by metadata (bindings + models); there is no entity-specific,\n * domain-specific, or \"renewal/risk\"-specific logic anywhere. Members/renewal\n * is only ever a test example.\n *\n * Self-mounts via the `after-fields` slot. Reusable as a plain component too\n * (composition) by binding `[Record]` + `[FormComponent]`.\n */\n@RegisterClassEx(BaseFormPanel, {\n    key: 'model-predictions:model-prediction',\n    skipNullKeyWarning: true,\n    metadata: {\n        entity: '*',          // wildcard — appears on every entity form, self-hides when N/A\n        slot: 'after-fields',\n        sortKey: 40,\n    },\n})\n@Component({\n    standalone: false,\n    selector: 'mj-model-prediction-panel',\n    templateUrl: './model-prediction.panel.html',\n    styleUrls: ['./model-prediction.panel.css'],\n})\nexport class ModelPredictionPanel extends BaseFormPanel implements OnInit {\n    /** The resolved cards to render. Empty → panel renders nothing. */\n    public Cards: PredictionCard[] = [];\n    /** True once the binding lookup has completed (success or empty). */\n    public Loaded = false;\n    /** Entity-ID we last loaded cards for, to avoid redundant lookups. */\n    private loadedForEntityId: string | null = null;\n\n    public async ngOnInit(): Promise<void> {\n        await this.loadCards();\n    }\n\n    /** True when there is at least one card to show — gates the whole template. */\n    public get HasPredictions(): boolean {\n        return this.Cards.length > 0;\n    }\n\n    /**\n     * Look up active scoring bindings for THIS record's entity and build a card\n     * per binding. Idempotent + cheap: a single RunView (cached by the server),\n     * skipped entirely when we've already loaded for this entity.\n     */\n    private async loadCards(): Promise<void> {\n        const entityId = this.Record?.EntityInfo?.ID ?? null;\n        if (!entityId) {\n            this.Loaded = true;\n            return;\n        }\n        if (entityId === this.loadedForEntityId) {\n            return; // already resolved for this entity\n        }\n        this.loadedForEntityId = entityId;\n\n        try {\n            const bindings = await this.loadBindingsForEntity(entityId);\n            if (bindings.length === 0) {\n                this.Cards = [];\n                this.Loaded = true;\n                return;\n            }\n            const models = await this.loadModelsForBindings(bindings);\n            this.Cards = this.buildCards(bindings, models);\n        } catch (e) {\n            LogError(`[ModelPredictionPanel] Failed to load predictions: ${e instanceof Error ? e.message : String(e)}`);\n            this.Cards = [];\n        } finally {\n            this.Loaded = true;\n        }\n    }\n\n    /** Active scoring bindings whose target entity is the current record's entity. */\n    private async loadBindingsForEntity(entityId: string): Promise<MJMLModelScoringBindingEntity[]> {\n        const rv = this.runView();\n        const result = await rv.RunView<MJMLModelScoringBindingEntity>(\n            {\n                EntityName: 'MJ: ML Model Scoring Bindings',\n                ExtraFilter: `TargetEntityID='${entityId}' AND TargetColumn IS NOT NULL`,\n                OrderBy: '__mj_CreatedAt ASC',\n                ResultType: 'entity_object',\n            },\n            this.contextUser(),\n        );\n        if (!result.Success) {\n            LogError(`[ModelPredictionPanel] Binding lookup failed: ${result.ErrorMessage}`);\n            return [];\n        }\n        return result.Results ?? [];\n    }\n\n    /** Load the distinct models referenced by the bindings, keyed by model ID. */\n    private async loadModelsForBindings(\n        bindings: MJMLModelScoringBindingEntity[],\n    ): Promise<Map<string, MJMLModelEntity>> {\n        const modelIds = [...new Set(bindings.map(b => b.MLModelID).filter((id): id is string => !!id))];\n        const byId = new Map<string, MJMLModelEntity>();\n        if (modelIds.length === 0) {\n            return byId;\n        }\n        const inList = modelIds.map(id => `'${id}'`).join(',');\n        const rv = this.runView();\n        const result = await rv.RunView<MJMLModelEntity>(\n            {\n                EntityName: 'MJ: ML Models',\n                ExtraFilter: `ID IN (${inList})`,\n                ResultType: 'entity_object',\n            },\n            this.contextUser(),\n        );\n        if (!result.Success) {\n            LogError(`[ModelPredictionPanel] Model lookup failed: ${result.ErrorMessage}`);\n            return byId;\n        }\n        for (const model of result.Results ?? []) {\n            byId.set(model.ID, model);\n        }\n        return byId;\n    }\n\n    /** Map each binding (+ its model) to a display card. Skips bindings whose model is missing. */\n    private buildCards(\n        bindings: MJMLModelScoringBindingEntity[],\n        models: Map<string, MJMLModelEntity>,\n    ): PredictionCard[] {\n        const cards: PredictionCard[] = [];\n        for (const binding of bindings) {\n            const model = binding.MLModelID ? models.get(binding.MLModelID) : undefined;\n            if (!model) {\n                continue;\n            }\n            cards.push(this.buildCard(binding, model));\n        }\n        return cards;\n    }\n\n    /** Build one card from a binding + model + the record's bound-column value. */\n    private buildCard(binding: MJMLModelScoringBindingEntity, model: MJMLModelEntity): PredictionCard {\n        // The column name is data-driven (from the binding), so reading it\n        // dynamically via Get() is the legitimate use of the dynamic accessor.\n        const rawValue = binding.TargetColumn ? this.Record.Get(binding.TargetColumn) : null;\n        const numeric = toNumber(rawValue);\n        const kind = valueKind(model.ProblemType, numeric);\n\n        return {\n            bindingId: binding.ID,\n            label: resolveLabel(model.TargetVariable, binding.TargetColumn),\n            isProbability: kind === 'probability',\n            isNumeric: kind === 'numeric',\n            isClass: kind === 'class',\n            displayValue: formatValue(rawValue, numeric, kind),\n            gaugePct: kind === 'probability' && numeric != null ? gaugePct(numeric) : 0,\n            band: kind === 'probability' && numeric != null ? bandFor(numeric) : null,\n            drivers: parseDrivers(model.FeatureImportance),\n            provenance: `${model.Pipeline} v${model.Version}`,\n            lastScored: formatLastScored(binding.LastScoredAt),\n        };\n    }\n\n    /** RunView scoped to the form's provider when available (multi-provider safe). */\n    private runView(): RunView {\n        const provider = this.FormComponent?.ProviderToUse;\n        return provider ? RunView.FromMetadataProvider(provider) : new RunView();\n    }\n\n    /** Context user for server-side scoping — the form provider's current user. */\n    private contextUser() {\n        return this.FormComponent?.ProviderToUse?.CurrentUser ?? new Metadata().CurrentUser;\n    }\n}\n\n/** Tree-shake guard — call this from the consuming module's loader. */\nexport function LoadModelPredictionPanel(): void { /* no-op marker */ }\n","<!--\n  Entity-agnostic model-prediction panel. Renders NOTHING unless the current\n  record's entity has active scoring bindings (HasPredictions gate). Driven\n  entirely by metadata — no entity-specific or domain-specific markup.\n-->\n@if (HasPredictions) {\n  <mj-collapsible-panel\n      SectionKey=\"modelPredictions\"\n      SectionName=\"Model Predictions\"\n      Icon=\"fa-solid fa-wand-magic-sparkles\"\n      [Form]=\"FormComponent\"\n      [FormContext]=\"FormContext\"\n      [BadgeCount]=\"Cards.length\">\n\n    <div class=\"mpp-cards\">\n      @for (card of Cards; track card.bindingId) {\n        <div class=\"mpp-card\">\n\n          <!-- Header: label + provenance -->\n          <div class=\"mpp-card-head\">\n            <div class=\"mpp-label\">{{ card.label }}</div>\n            <div class=\"mpp-provenance\">\n              <i class=\"fa-solid fa-diagram-project mpp-prov-icon\" aria-hidden=\"true\"></i>\n              <span>{{ card.provenance }}</span>\n              @if (card.lastScored) {\n                <span class=\"mpp-dot\" aria-hidden=\"true\">·</span>\n                <span class=\"mpp-scored\">Scored {{ card.lastScored }}</span>\n              }\n            </div>\n          </div>\n\n          <!-- Value -->\n          <div class=\"mpp-value-row\">\n            <span class=\"mpp-value\" [class.mpp-value-muted]=\"card.displayValue === '—'\">\n              {{ card.displayValue }}\n            </span>\n          </div>\n\n          <!-- Probability gauge — neutral 3-band tercile. No moral direction. -->\n          @if (card.isProbability) {\n            <div class=\"mpp-gauge\" role=\"img\"\n                 [attr.aria-label]=\"card.label + ' ' + card.displayValue + ', ' + card.band + ' band'\">\n              <div class=\"mpp-gauge-track\">\n                <div class=\"mpp-gauge-fill\"\n                     [class.mpp-band-low]=\"card.band === 'low'\"\n                     [class.mpp-band-mid]=\"card.band === 'mid'\"\n                     [class.mpp-band-high]=\"card.band === 'high'\"\n                     [style.width.%]=\"card.gaugePct\"></div>\n              </div>\n              <div class=\"mpp-gauge-scale\">\n                <span>0%</span>\n                <span>50%</span>\n                <span>100%</span>\n              </div>\n            </div>\n          }\n\n          <!-- Top drivers (feature importance) — omitted cleanly when unavailable -->\n          @if (card.drivers.length > 0) {\n            <div class=\"mpp-drivers\">\n              <div class=\"mpp-drivers-title\">\n                <i class=\"fa-solid fa-ranking-star\" aria-hidden=\"true\"></i>\n                Top drivers\n              </div>\n              @for (driver of card.drivers; track driver.name) {\n                <div class=\"mpp-driver\">\n                  <span class=\"mpp-driver-name\" [title]=\"driver.name\">{{ driver.name }}</span>\n                  <span class=\"mpp-driver-bar-track\">\n                    <span class=\"mpp-driver-bar-fill\" [style.width.%]=\"driver.relativePct\"></span>\n                  </span>\n                </div>\n              }\n            </div>\n          }\n\n        </div>\n      }\n    </div>\n\n  </mj-collapsible-panel>\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-core-entity-forms",
-  "version": "5.43.0",
+  "version": "5.44.0",
   "description": "MemberJunction Core Entity Angular Forms",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -29,42 +29,43 @@
     "@angular/router": "21.1.3",
     "@codemirror/language": "latest",
     "@codemirror/language-data": "^6.5.2",
-    "@memberjunction/actions-base": "5.43.0",
-    "@memberjunction/ai": "5.43.0",
-    "@memberjunction/ai-core-plus": "5.43.0",
-    "@memberjunction/ai-engine-base": "5.43.0",
-    "@memberjunction/core": "5.43.0",
-    "@memberjunction/core-entities": "5.43.0",
-    "@memberjunction/global": "5.43.0",
-    "@memberjunction/graphql-dataprovider": "5.43.0",
-    "@memberjunction/ng-action-gallery": "5.43.0",
-    "@memberjunction/ng-actions": "5.43.0",
-    "@memberjunction/ng-agents": "5.43.0",
-    "@memberjunction/ng-ai-test-harness": "5.43.0",
-    "@memberjunction/ng-base-application": "5.43.0",
-    "@memberjunction/ng-base-forms": "5.43.0",
-    "@memberjunction/ng-base-types": "5.43.0",
-    "@memberjunction/ng-code-editor": "5.43.0",
-    "@memberjunction/ng-deep-diff": "5.43.0",
-    "@memberjunction/ng-entity-relationship-diagram": "5.43.0",
-    "@memberjunction/ng-entity-viewer": "5.43.0",
-    "@memberjunction/ng-flow-editor": "5.43.0",
-    "@memberjunction/ng-join-grid": "5.43.0",
-    "@memberjunction/ng-link-directives": "5.43.0",
-    "@memberjunction/ng-list-management": "5.43.0",
-    "@memberjunction/ng-markdown": "5.43.0",
-    "@memberjunction/ng-notifications": "5.43.0",
-    "@memberjunction/ng-record-process-studio": "5.43.0",
-    "@memberjunction/ng-search": "5.43.0",
-    "@memberjunction/ng-shared": "5.43.0",
-    "@memberjunction/ng-shared-generic": "5.43.0",
-    "@memberjunction/ng-tabstrip": "5.43.0",
-    "@memberjunction/ng-testing": "5.43.0",
-    "@memberjunction/ng-timeline": "5.43.0",
-    "@memberjunction/ng-trees": "5.43.0",
-    "@memberjunction/ng-ui-components": "5.43.0",
-    "@memberjunction/ng-versions": "5.43.0",
-    "@memberjunction/templates-base-types": "5.43.0",
+    "@memberjunction/actions-base": "5.44.0",
+    "@memberjunction/ai": "5.44.0",
+    "@memberjunction/ai-core-plus": "5.44.0",
+    "@memberjunction/ai-engine-base": "5.44.0",
+    "@memberjunction/core": "5.44.0",
+    "@memberjunction/core-entities": "5.44.0",
+    "@memberjunction/global": "5.44.0",
+    "@memberjunction/graphql-dataprovider": "5.44.0",
+    "@memberjunction/ng-action-gallery": "5.44.0",
+    "@memberjunction/ng-actions": "5.44.0",
+    "@memberjunction/ng-agents": "5.44.0",
+    "@memberjunction/ng-ai-test-harness": "5.44.0",
+    "@memberjunction/ng-base-application": "5.44.0",
+    "@memberjunction/ng-base-forms": "5.44.0",
+    "@memberjunction/ng-base-types": "5.44.0",
+    "@memberjunction/ng-code-editor": "5.44.0",
+    "@memberjunction/ng-deep-diff": "5.44.0",
+    "@memberjunction/ng-entity-relationship-diagram": "5.44.0",
+    "@memberjunction/ng-entity-viewer": "5.44.0",
+    "@memberjunction/ng-flow-editor": "5.44.0",
+    "@memberjunction/ng-join-grid": "5.44.0",
+    "@memberjunction/ng-link-directives": "5.44.0",
+    "@memberjunction/ng-list-management": "5.44.0",
+    "@memberjunction/ng-markdown": "5.44.0",
+    "@memberjunction/ng-notifications": "5.44.0",
+    "@memberjunction/ng-record-process-studio": "5.44.0",
+    "@memberjunction/ng-resource-permissions": "5.44.0",
+    "@memberjunction/ng-search": "5.44.0",
+    "@memberjunction/ng-shared": "5.44.0",
+    "@memberjunction/ng-shared-generic": "5.44.0",
+    "@memberjunction/ng-tabstrip": "5.44.0",
+    "@memberjunction/ng-testing": "5.44.0",
+    "@memberjunction/ng-timeline": "5.44.0",
+    "@memberjunction/ng-trees": "5.44.0",
+    "@memberjunction/ng-ui-components": "5.44.0",
+    "@memberjunction/ng-versions": "5.44.0",
+    "@memberjunction/templates-base-types": "5.44.0",
     "@types/d3": "^7.4.3",
     "ag-grid-angular": "^35.0.1",
     "ag-grid-community": "^35.0.1",

package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.d.ts

@@ -1,82 +0,0 @@
-import { OnInit, OnDestroy, ElementRef, AfterViewInit, ChangeDetectorRef } from '@angular/core';
-import { TimelineItem } from './ai-agent-run-timeline.component';
-import { AIAgentRunDataHelper } from './ai-agent-run-data.service';
-import * as i0 from "@angular/core";
-export declare class AIAgentRunVisualizationComponent implements OnInit, OnDestroy, AfterViewInit {
-    private cdr;
-    svgContainer: ElementRef<HTMLDivElement>;
-    aiAgentRunId: string;
-    dataHelper: AIAgentRunDataHelper;
-    private destroy$;
-    private viewInitialized;
-    /** Track active timeouts for cleanup */
-    private activeTimeouts;
-    /** Remove timeout from tracking array */
-    private removeTimeoutFromTracking;
-    private pendingData;
-    loading: boolean;
-    error: string | null;
-    private dataLoading;
-    selectedItem: TimelineItem | null;
-    private nodes;
-    private scopes;
-    private connections;
-    panZoom: {
-        scale: number;
-        translateX: number;
-        translateY: number;
-        isPanning: boolean;
-        startX: number;
-        startY: number;
-    };
-    private dragState;
-    private panState;
-    private animationFrameId;
-    private boundOnWheel;
-    private boundOnSvgMouseDown;
-    private boundOnSvgMouseMove;
-    private boundOnSvgMouseUp;
-    constructor(cdr: ChangeDetectorRef);
-    ngOnInit(): void;
-    ngAfterViewInit(): void;
-    ngOnDestroy(): void;
-    private initializeSVG;
-    private buildVisualization;
-    private clearVisualization;
-    private buildNodesAndScopes;
-    private createNodeElement;
-    private createScopeElement;
-    private arrangeLayout;
-    private drawConnections;
-    private fitToView;
-    private getStepColor;
-    private getStepEmoji;
-    private getStatusColor;
-    private getStepDataType;
-    private truncateText;
-    private calculateDuration;
-    private onNodeClick;
-    private getStepIcon;
-    private getStatusColorName;
-    private onScopeExpandClick;
-    private loadScopeContents;
-    private createScopeNodes;
-    private updateScopeVisual;
-    private onNodeMouseDown;
-    private onMouseMove;
-    private onMouseUp;
-    onWheel(event: WheelEvent): void;
-    onSvgMouseDown(event: MouseEvent): void;
-    onSvgMouseMove(event: MouseEvent): void;
-    onSvgMouseUp(event: MouseEvent): void;
-    private updateTransform;
-    zoomIn(): void;
-    zoomOut(): void;
-    resetZoom(): void;
-    closeDetailPane(): void;
-    navigateToActionLog(logId: string): void;
-    copyToClipboard(text: string): Promise<void>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AIAgentRunVisualizationComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AIAgentRunVisualizationComponent, "mj-ai-agent-run-visualization", never, { "aiAgentRunId": { "alias": "aiAgentRunId"; "required": false; }; "dataHelper": { "alias": "dataHelper"; "required": false; }; }, {}, never, never, false, never>;
-}
-//# sourceMappingURL=ai-agent-run-visualization.component.d.ts.map

package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ai-agent-run-visualization.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/custom/ai-agent-run/ai-agent-run-visualization.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,MAAM,EAAE,SAAS,EAAa,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAA2B,MAAM,eAAe,CAAC;AAItJ,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAwBnE,qBAOa,gCAAiC,YAAW,MAAM,EAAE,SAAS,EAAE,aAAa;IA+ErF,OAAO,CAAC,GAAG;IA9EiC,YAAY,EAAG,UAAU,CAAC,cAAc,CAAC,CAAC;IAC/E,YAAY,EAAG,MAAM,CAAC;IACtB,UAAU,EAAG,oBAAoB,CAAC;IAE3C,OAAO,CAAC,QAAQ,CAAuB;IACvC,OAAO,CAAC,eAAe,CAAS;IAEhC,wCAAwC;IACxC,OAAO,CAAC,cAAc,CAAgB;IAEtC,yCAAyC;IACzC,OAAO,CAAC,yBAAyB;IAMjC,OAAO,CAAC,WAAW,CAAgK;IAEnL,OAAO,UAAS;IAChB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC5B,OAAO,CAAC,WAAW,CAAS;IAE5B,YAAY,EAAE,YAAY,GAAG,IAAI,CAAQ;IAGzC,OAAO,CAAC,KAAK,CAA+B;IAC5C,OAAO,CAAC,MAAM,CAAgC;IAC9C,OAAO,CAAC,WAAW,CAAgE;IAGnF,OAAO;;;;;;;MAOL;IAGF,OAAO,CAAC,SAAS,CAgBf;IAGF,OAAO,CAAC,QAAQ,CAMd;IAGF,OAAO,CAAC,gBAAgB,CAAuB;IAG/C,OAAO,CAAC,YAAY,CAA2B;IAC/C,OAAO,CAAC,mBAAmB,CAAkC;IAC7D,OAAO,CAAC,mBAAmB,CAAkC;IAC7D,OAAO,CAAC,iBAAiB,CAAgC;gBAG/C,GAAG,EAAE,iBAAiB;IAGhC,QAAQ;IAgDR,eAAe;IA0Bf,WAAW;IA4EX,OAAO,CAAC,aAAa;YA4CP,kBAAkB;IAsEhC,OAAO,CAAC,kBAAkB;YAiBZ,mBAAmB;IAiEjC,OAAO,CAAC,iBAAiB;YAyFX,kBAAkB;IAwFhC,OAAO,CAAC,aAAa;IAmDrB,OAAO,CAAC,eAAe;IA4DvB,OAAO,CAAC,SAAS;IAYjB,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,YAAY;IAapB,OAAO,CAAC,cAAc;IAWtB,OAAO,CAAC,eAAe;IAavB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,iBAAiB;IAWzB,OAAO,CAAC,WAAW;IAuBnB,OAAO,CAAC,WAAW;IAanB,OAAO,CAAC,kBAAkB;YAWZ,kBAAkB;YAmBlB,iBAAiB;IAyB/B,OAAO,CAAC,gBAAgB;IAsCxB,OAAO,CAAC,iBAAiB;IAiBzB,OAAO,CAAC,eAAe;IAwCvB,OAAO,CAAC,WAAW,CA6BlB;IAED,OAAO,CAAC,SAAS,CAiBhB;IAGD,OAAO,CAAC,KAAK,EAAE,UAAU;IAOzB,cAAc,CAAC,KAAK,EAAE,UAAU;IAShC,cAAc,CAAC,KAAK,EAAE,UAAU;IAQhC,YAAY,CAAC,KAAK,EAAE,UAAU;IAI9B,OAAO,CAAC,eAAe;IAYvB,MAAM;IAKN,OAAO;IAKP,SAAS;IAQT,eAAe;IAKf,mBAAmB,CAAC,KAAK,EAAE,MAAM;IAK3B,eAAe,CAAC,IAAI,EAAE,MAAM;yCAzkCvB,gCAAgC;2CAAhC,gCAAgC;CAglC5C"}