@memberjunction/ng-versions 0.0.1 → 4.0.0

package/dist/lib/record-micro-view/record-micro-view.component.js

@@ -0,0 +1,824 @@
+import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, HostListener } from '@angular/core';
+import { RunView, Metadata, CompositeKey } from '@memberjunction/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@memberjunction/ng-shared-generic";
+function MjRecordMicroViewComponent_Conditional_0_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
+} }
+function MjRecordMicroViewComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 2);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_Conditional_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnBackdropClick()); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(1, "div", 3);
+    i0.ɵɵtemplate(2, MjRecordMicroViewComponent_Conditional_0_ng_container_2_Template, 1, 0, "ng-container", 4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    const microContent_r3 = i0.ɵɵreference(3);
+    i0.ɵɵclassProp("visible", ctx_r1.IsVisible);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("visible", ctx_r1.IsVisible);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", microContent_r3);
+} }
+function MjRecordMicroViewComponent_Conditional_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
+} }
+function MjRecordMicroViewComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 1);
+    i0.ɵɵtemplate(1, MjRecordMicroViewComponent_Conditional_1_ng_container_1_Template, 1, 0, "ng-container", 4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵnextContext();
+    const microContent_r3 = i0.ɵɵreference(3);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", microContent_r3);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_0_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 15);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.RecordDisplayName);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 12)(2, "div", 13);
+    i0.ɵɵelement(3, "i", 14);
+    i0.ɵɵelementStart(4, "span");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(6, MjRecordMicroViewComponent_ng_template_2_Conditional_0_Conditional_6_Template, 2, 1, "span", 15);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "div", 16);
+    i0.ɵɵelement(8, "i", 17);
+    i0.ɵɵelementStart(9, "span");
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(11, "div", 18)(12, "button", 19);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_ng_template_2_Conditional_0_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnOpenRecord()); });
+    i0.ɵɵelement(13, "i", 20);
+    i0.ɵɵtext(14, " Open ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "button", 21);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_ng_template_2_Conditional_0_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnClose()); });
+    i0.ɵɵelement(16, "i", 22);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassMap(ctx_r1.EntityIcon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.Data.EntityName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.RecordDisplayName ? 6 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r1.DisplayRecordID);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_1_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 15);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.RecordDisplayName);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 6)(1, "div", 23)(2, "div", 13);
+    i0.ɵɵelement(3, "i", 14);
+    i0.ɵɵelementStart(4, "span");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(6, MjRecordMicroViewComponent_ng_template_2_Conditional_1_Conditional_6_Template, 2, 1, "span", 15);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "div", 16);
+    i0.ɵɵelement(8, "i", 17);
+    i0.ɵɵelementStart(9, "span");
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(11, "button", 19);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_ng_template_2_Conditional_1_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OnOpenRecord()); });
+    i0.ɵɵelement(12, "i", 20);
+    i0.ɵɵtext(13, " Open ");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassMap(ctx_r1.EntityIcon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.Data.EntityName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.RecordDisplayName ? 6 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r1.DisplayRecordID);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-loading", 8);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵelement(1, "i", 24);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r1.ErrorMessage);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 25)(1, "label", 30)(2, "input", 31);
+    i0.ɵɵlistener("change", function MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_1_Template_input_change_2_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ToggleShowNulls()); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 32);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("checked", ctx_r1.ShowNullValues);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("Show null values (", ctx_r1.HiddenNullCount, ")");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 28);
+    i0.ɵɵtext(1, "Value");
+    i0.ɵɵelementEnd();
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 33);
+    i0.ɵɵtext(1, "Old");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "span", 34);
+    i0.ɵɵtext(3, "New");
+    i0.ɵɵelementEnd();
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 42);
+    i0.ɵɵelementStart(1, "span", 43);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵclassMap(field_r7.BooleanValue ? "fa-solid fa-square-check mf-bool-true" : "fa-regular fa-square mf-bool-false");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r7.BooleanValue ? "Yes" : "No");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "a", 44);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_2_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r8); const field_r7 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnEntityLinkClicked($event, field_r7)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementStart(2, "span", 45);
+    i0.ɵɵtext(3);
+    i0.ɵɵpipe(4, "slice");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(5, "i", 46);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵproperty("title", field_r7.ForeignKeyEntityName + ": " + field_r7.ForeignKeyRecordId);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", field_r7.ForeignKeyDisplayValue, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("(", i0.ɵɵpipeBind3(4, 3, field_r7.ForeignKeyRecordId, 0, 8), "...)");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "a", 44);
+    i0.ɵɵlistener("click", function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_3_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r9); const field_r7 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.OnEntityLinkClicked($event, field_r7)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelement(2, "i", 46);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵproperty("title", "Open " + field_r7.ForeignKeyEntityName);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", field_r7.Value, " ");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "pre", 41);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(field_r7.Value);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵtextInterpolate1(" ", field_r7.Value, " ");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 39);
+    i0.ɵɵconditionalCreate(1, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_1_Template, 3, 3);
+    i0.ɵɵconditionalCreate(2, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_2_Template, 6, 7, "a", 40);
+    i0.ɵɵconditionalCreate(3, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_3_Template, 3, 2, "a", 40);
+    i0.ɵɵconditionalCreate(4, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_4_Template, 2, 1, "pre", 41);
+    i0.ɵɵconditionalCreate(5, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Conditional_5_Template, 1, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("title", field_r7.Value);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(field_r7.IsBoolean && !field_r7.IsNull ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!field_r7.IsBoolean && field_r7.ForeignKeyEntityName && field_r7.ForeignKeyDisplayValue ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!field_r7.IsBoolean && field_r7.ForeignKeyEntityName && !field_r7.ForeignKeyDisplayValue ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!field_r7.IsBoolean && !field_r7.ForeignKeyEntityName && field_r7.IsJson ? 4 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!field_r7.IsBoolean && !field_r7.ForeignKeyEntityName && !field_r7.IsJson ? 5 : -1);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 47);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "span", 48);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("title", field_r7.OldValue);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", field_r7.OldValue || field_r7.Value, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", field_r7.Value);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", field_r7.Value, " ");
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 35)(1, "span", 36);
+    i0.ɵɵelement(2, "i", 37);
+    i0.ɵɵelementStart(3, "span", 38);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(5, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_5_Template, 6, 6, "span", 39);
+    i0.ɵɵconditionalCreate(6, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Conditional_6_Template, 4, 4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r7 = ctx.$implicit;
+    const ɵ$index_123_r10 = ctx.$index;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("odd", ɵ$index_123_r10 % 2 !== 0);
+    i0.ɵɵproperty("ngClass", field_r7.DiffClass);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("title", field_r7.Description);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.GetTypeIcon(field_r7.Type));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r7.DisplayName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.HasDiffs ? 5 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.HasDiffs ? 6 : -1);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 10);
+    i0.ɵɵconditionalCreate(1, MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_1_Template, 5, 2, "div", 25);
+    i0.ɵɵelementStart(2, "div", 26)(3, "span", 27);
+    i0.ɵɵtext(4, "Field");
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(5, MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_5_Template, 2, 0, "span", 28);
+    i0.ɵɵconditionalCreate(6, MjRecordMicroViewComponent_ng_template_2_Conditional_5_Conditional_6_Template, 4, 0);
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(7, MjRecordMicroViewComponent_ng_template_2_Conditional_5_For_8_Template, 7, 9, "div", 29, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.HiddenNullCount > 0 ? 1 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(!ctx_r1.HasDiffs ? 5 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.HasDiffs ? 6 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.VisibleFields);
+} }
+function MjRecordMicroViewComponent_ng_template_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 11)(1, "p");
+    i0.ɵɵtext(2, "No field data available.");
+    i0.ɵɵelementEnd()();
+} }
+function MjRecordMicroViewComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, MjRecordMicroViewComponent_ng_template_2_Conditional_0_Template, 17, 5, "div", 5);
+    i0.ɵɵconditionalCreate(1, MjRecordMicroViewComponent_ng_template_2_Conditional_1_Template, 14, 5, "div", 6);
+    i0.ɵɵelementStart(2, "div", 7);
+    i0.ɵɵconditionalCreate(3, MjRecordMicroViewComponent_ng_template_2_Conditional_3_Template, 1, 0, "mj-loading", 8);
+    i0.ɵɵconditionalCreate(4, MjRecordMicroViewComponent_ng_template_2_Conditional_4_Template, 4, 1, "div", 9);
+    i0.ɵɵconditionalCreate(5, MjRecordMicroViewComponent_ng_template_2_Conditional_5_Template, 9, 3, "div", 10);
+    i0.ɵɵconditionalCreate(6, MjRecordMicroViewComponent_ng_template_2_Conditional_6_Template, 3, 0, "div", 11);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(!ctx_r1.Inline ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.Inline ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("micro-content-inline", ctx_r1.Inline);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.IsLoading ? 3 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.IsLoading && ctx_r1.ErrorMessage ? 4 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.IsLoading && !ctx_r1.ErrorMessage && ctx_r1.Fields.length > 0 ? 5 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.IsLoading && !ctx_r1.ErrorMessage && ctx_r1.Fields.length === 0 ? 6 : -1);
+} }
+export class MjRecordMicroViewComponent {
+    cdr;
+    Data;
+    Inline = false;
+    Close = new EventEmitter();
+    EntityLinkClick = new EventEmitter();
+    OpenRecord = new EventEmitter();
+    IsLoading = true;
+    IsVisible = false;
+    Fields = [];
+    ErrorMessage = '';
+    ShowNullValues = false;
+    /** Formatted display of the record primary key (simplified for single-value PKs) */
+    DisplayRecordID = '';
+    /** The value of the IsNameField for display in the header */
+    RecordDisplayName = '';
+    /** Icon CSS class from EntityInfo.Icon, falls back to 'fa-solid fa-table' */
+    EntityIcon = 'fa-solid fa-table';
+    metadata = new Metadata();
+    constructor(cdr) {
+        this.cdr = cdr;
+    }
+    ngOnInit() {
+        if (this.Inline) {
+            this.IsVisible = true;
+        }
+        else {
+            Promise.resolve().then(() => {
+                this.IsVisible = true;
+                this.cdr.markForCheck();
+            });
+        }
+        this.DisplayRecordID = this.formatRecordId(this.Data.RecordID);
+        this.loadRecordData();
+    }
+    OnEscapeKey() {
+        if (!this.Inline) {
+            this.OnClose();
+        }
+    }
+    OnClose() {
+        if (this.Inline) {
+            this.Close.emit();
+        }
+        else {
+            this.IsVisible = false;
+            this.cdr.markForCheck();
+            setTimeout(() => this.Close.emit(), 250);
+        }
+    }
+    OnBackdropClick() {
+        this.OnClose();
+    }
+    GetTypeIcon(type) {
+        const icons = {
+            'uniqueidentifier': 'fa-solid fa-fingerprint',
+            'datetime': 'fa-solid fa-calendar',
+            'datetimeoffset': 'fa-solid fa-calendar',
+            'date': 'fa-solid fa-calendar-day',
+            'time': 'fa-solid fa-clock',
+            'bit': 'fa-solid fa-toggle-on',
+            'boolean': 'fa-solid fa-toggle-on',
+            'int': 'fa-solid fa-hashtag',
+            'bigint': 'fa-solid fa-hashtag',
+            'float': 'fa-solid fa-hashtag',
+            'decimal': 'fa-solid fa-hashtag',
+            'money': 'fa-solid fa-hashtag',
+            'number': 'fa-solid fa-hashtag',
+            'nvarchar': 'fa-solid fa-font',
+            'varchar': 'fa-solid fa-font',
+            'ntext': 'fa-solid fa-align-left',
+            'text': 'fa-solid fa-align-left',
+            'string': 'fa-solid fa-font',
+            'object': 'fa-solid fa-code',
+            'null': 'fa-solid fa-circle-xmark'
+        };
+        return icons[type.toLowerCase()] ?? 'fa-solid fa-font';
+    }
+    get HasDiffs() {
+        return this.Data.FieldDiffs != null && this.Data.FieldDiffs.length > 0;
+    }
+    get VisibleFields() {
+        if (this.ShowNullValues) {
+            return this.Fields;
+        }
+        return this.Fields.filter(f => !f.IsNull);
+    }
+    get HiddenNullCount() {
+        return this.Fields.filter(f => f.IsNull).length;
+    }
+    ToggleShowNulls() {
+        this.ShowNullValues = !this.ShowNullValues;
+        this.cdr.markForCheck();
+    }
+    OnEntityLinkClicked(event, field) {
+        event.stopPropagation();
+        if (field.ForeignKeyEntityName && field.ForeignKeyRecordId) {
+            const pkey = new CompositeKey([{ FieldName: 'ID', Value: field.ForeignKeyRecordId }]);
+            this.EntityLinkClick.emit({
+                EntityName: field.ForeignKeyEntityName,
+                RecordID: field.ForeignKeyRecordId,
+                CompositeKey: pkey
+            });
+        }
+    }
+    OnOpenRecord() {
+        if (this.Data.EntityName && this.Data.RecordID) {
+            const rawId = this.extractRawId(this.Data.RecordID);
+            const pkey = new CompositeKey([{ FieldName: 'ID', Value: rawId }]);
+            this.OpenRecord.emit({
+                EntityName: this.Data.EntityName,
+                RecordID: rawId,
+                CompositeKey: pkey
+            });
+        }
+    }
+    // =========================================================================
+    // Data loading
+    // =========================================================================
+    async loadRecordData() {
+        this.IsLoading = true;
+        this.cdr.markForCheck();
+        try {
+            let recordData = this.Data.FullRecordJSON;
+            if (!recordData && this.Data.RecordChangeID) {
+                recordData = await this.loadRecordChangeJson(this.Data.RecordChangeID);
+            }
+            if (recordData) {
+                const entityInfo = this.findEntityInfo();
+                this.EntityIcon = entityInfo?.Icon || 'fa-solid fa-table';
+                this.RecordDisplayName = this.extractNameFieldValue(entityInfo, recordData);
+                this.Fields = this.buildFieldList(recordData, entityInfo);
+            }
+            else {
+                this.ErrorMessage = 'Unable to load record data.';
+            }
+        }
+        catch (e) {
+            this.ErrorMessage = e instanceof Error ? e.message : 'Failed to load record data.';
+        }
+        finally {
+            this.IsLoading = false;
+            this.cdr.markForCheck();
+        }
+    }
+    async loadRecordChangeJson(changeId) {
+        const rv = new RunView();
+        const result = await rv.RunView({
+            EntityName: 'Record Changes',
+            ExtraFilter: `ID = '${changeId}'`,
+            Fields: ['FullRecordJSON'],
+            ResultType: 'simple'
+        });
+        if (result.Success && result.Results.length > 0) {
+            const json = result.Results[0].FullRecordJSON;
+            if (json) {
+                return JSON.parse(json);
+            }
+        }
+        return null;
+    }
+    // =========================================================================
+    // Field building
+    // =========================================================================
+    buildFieldList(data, entityInfo) {
+        const diffMap = this.buildDiffMap();
+        const fkMap = this.buildForeignKeyMap(entityInfo, data);
+        const virtualFieldNames = this.getVirtualFieldNames(entityInfo);
+        const fields = [];
+        for (const [key, value] of Object.entries(data)) {
+            if (key.startsWith('__mj_'))
+                continue;
+            // Skip virtual fields that we've merged into their FK counterpart
+            if (virtualFieldNames.has(key))
+                continue;
+            const fieldMeta = entityInfo?.Fields.find(f => f.Name === key);
+            const diff = diffMap.get(key);
+            const fkInfo = fkMap.get(key);
+            const fieldType = fieldMeta?.Type ?? this.inferType(value);
+            const isBooleanField = this.isBooleanType(fieldType, value);
+            const isJsonField = this.isJsonValue(value);
+            fields.push({
+                Name: key,
+                DisplayName: fieldMeta?.DisplayNameOrName ?? key,
+                Value: this.formatValue(value, isJsonField),
+                Type: fieldType,
+                Description: fieldMeta?.Description ?? '',
+                DiffClass: diff?.ChangeType ? `diff-${diff.ChangeType.toLowerCase()}` : '',
+                OldValue: diff?.OldValue ?? '',
+                IsNull: value == null,
+                IsBoolean: isBooleanField,
+                BooleanValue: this.toBooleanValue(value),
+                IsJson: isJsonField,
+                Sequence: fieldMeta?.Sequence ?? 9999,
+                ForeignKeyDisplayValue: fkInfo?.DisplayValue ?? '',
+                ForeignKeyEntityName: fkInfo?.EntityName ?? '',
+                ForeignKeyRecordId: fkInfo?.RecordId ?? ''
+            });
+        }
+        return fields.sort((a, b) => a.Sequence - b.Sequence);
+    }
+    /**
+     * Find the entity's NameField (uses EntityInfo.NameField getter which checks
+     * IsNameField first, then falls back to a field called "Name").
+     */
+    extractNameFieldValue(entityInfo, data) {
+        if (!entityInfo)
+            return '';
+        const nameField = entityInfo.NameField;
+        if (nameField && data[nameField.Name] != null) {
+            return String(data[nameField.Name]);
+        }
+        return '';
+    }
+    findEntityInfo() {
+        if (this.Data.EntityName && this.Data.EntityName !== 'Unknown') {
+            return this.metadata.Entities.find(e => e.Name === this.Data.EntityName);
+        }
+        if (this.Data.EntityID) {
+            return this.metadata.Entities.find(e => e.ID === this.Data.EntityID);
+        }
+        return undefined;
+    }
+    buildDiffMap() {
+        const map = new Map();
+        if (this.Data.FieldDiffs) {
+            for (const diff of this.Data.FieldDiffs) {
+                map.set(diff.FieldName, { ChangeType: diff.ChangeType, OldValue: diff.OldValue });
+            }
+        }
+        return map;
+    }
+    /**
+     * Build a map of FK field name -> { DisplayValue, EntityName, RecordId }
+     * by matching FK fields to their associated virtual (display) fields.
+     */
+    buildForeignKeyMap(entityInfo, data) {
+        const map = new Map();
+        if (!entityInfo)
+            return map;
+        for (const field of entityInfo.Fields) {
+            if (!field.RelatedEntityID || field.Name === 'ID')
+                continue;
+            // Find the related entity name
+            const relatedEntity = this.metadata.Entities.find(e => e.ID === field.RelatedEntityID);
+            if (!relatedEntity)
+                continue;
+            const fkValue = data[field.Name];
+            if (fkValue == null)
+                continue;
+            // Find display value from the associated virtual field
+            const displayValue = this.findFkDisplayValue(entityInfo, field.Name, data);
+            map.set(field.Name, {
+                DisplayValue: displayValue,
+                EntityName: relatedEntity.Name,
+                RecordId: String(fkValue)
+            });
+        }
+        return map;
+    }
+    /**
+     * Find the display value for a FK field by checking multiple strategies:
+     * 1. Look for a virtual field with RelatedEntityNameFieldMap pointing to this FK
+     * 2. Look for any virtual field whose name is derived from the FK name
+     * 3. Scan data keys for common naming patterns (e.g., "TypeID" -> "Type")
+     */
+    findFkDisplayValue(entityInfo, fkFieldName, data) {
+        // Strategy 1: Metadata-linked virtual field via RelatedEntityNameFieldMap
+        const linkedVirtual = entityInfo.Fields.find(f => f.RelatedEntityNameFieldMap === fkFieldName && f.IsVirtual);
+        if (linkedVirtual && data[linkedVirtual.Name] != null) {
+            return String(data[linkedVirtual.Name]);
+        }
+        // Strategy 2: Find any virtual field that looks like a display field for this FK
+        // by checking all virtual fields and matching via naming patterns
+        const virtualFields = entityInfo.Fields.filter(f => f.IsVirtual);
+        for (const vf of virtualFields) {
+            // Check if this virtual field's RelatedEntityNameFieldMap matches (case-insensitive)
+            if (vf.RelatedEntityNameFieldMap &&
+                vf.RelatedEntityNameFieldMap.toLowerCase() === fkFieldName.toLowerCase() &&
+                data[vf.Name] != null) {
+                return String(data[vf.Name]);
+            }
+        }
+        // Strategy 3: Try common naming conventions in the data itself
+        // e.g., "TypeID" -> look for "Type" key in data
+        //        "OwnerUserID" -> look for "Owner User" or "OwnerUser"
+        // Strip trailing "ID" from the FK name and try variations
+        if (fkFieldName.endsWith('ID') && fkFieldName.length > 2) {
+            const baseName = fkFieldName.slice(0, -2);
+            // Direct match in data (e.g., "CategoryID" -> "Category")
+            if (data[baseName] != null && typeof data[baseName] === 'string' &&
+                !this.looksLikeGuid(data[baseName])) {
+                return String(data[baseName]);
+            }
+            // Try with space before capitals (e.g., "OwnerUserID" -> "Owner User")
+            const spacedName = baseName.replace(/([a-z])([A-Z])/g, '$1 $2');
+            if (spacedName !== baseName && data[spacedName] != null &&
+                typeof data[spacedName] === 'string' &&
+                !this.looksLikeGuid(data[spacedName])) {
+                return String(data[spacedName]);
+            }
+        }
+        return '';
+    }
+    /** Quick check if a string looks like a GUID (to avoid using GUIDs as display values). */
+    looksLikeGuid(value) {
+        return /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(value);
+    }
+    /**
+     * Get the set of virtual field names so we can skip them in the main field list.
+     * Virtual fields are display-only fields whose values are merged into FK rows.
+     * We skip ALL virtual fields — not just ones with RelatedEntityNameFieldMap —
+     * because they are derived/computed and don't represent stored data.
+     */
+    getVirtualFieldNames(entityInfo) {
+        const names = new Set();
+        if (!entityInfo)
+            return names;
+        for (const field of entityInfo.Fields) {
+            if (field.IsVirtual) {
+                names.add(field.Name);
+            }
+        }
+        return names;
+    }
+    // =========================================================================
+    // Record ID formatting
+    // =========================================================================
+    /**
+     * For single-value PKs like "ID|<uuid>", extract just the uuid.
+     * For composite keys, show the full concatenated string.
+     */
+    formatRecordId(recordId) {
+        if (!recordId)
+            return '';
+        const parts = recordId.split('||');
+        if (parts.length === 1) {
+            const singleParts = recordId.split('|');
+            if (singleParts.length === 2) {
+                return singleParts[1];
+            }
+        }
+        return recordId;
+    }
+    /**
+     * Extract the raw ID value from a potentially formatted record ID string.
+     */
+    extractRawId(recordId) {
+        if (!recordId)
+            return '';
+        const parts = recordId.split('||');
+        if (parts.length === 1) {
+            const singleParts = recordId.split('|');
+            if (singleParts.length === 2) {
+                return singleParts[1];
+            }
+        }
+        return recordId;
+    }
+    // =========================================================================
+    // Type helpers
+    // =========================================================================
+    isBooleanType(type, value) {
+        const t = type.toLowerCase();
+        if (t === 'bit' || t === 'boolean')
+            return true;
+        if (value === true || value === false)
+            return true;
+        return false;
+    }
+    toBooleanValue(value) {
+        if (value === true || value === 1 || value === '1' || value === 'true')
+            return true;
+        return false;
+    }
+    isJsonValue(value) {
+        if (typeof value === 'object' && value != null)
+            return true;
+        if (typeof value === 'string') {
+            const trimmed = value.trim();
+            return (trimmed.startsWith('{') && trimmed.endsWith('}')) ||
+                (trimmed.startsWith('[') && trimmed.endsWith(']'));
+        }
+        return false;
+    }
+    // =========================================================================
+    // Formatting helpers
+    // =========================================================================
+    formatValue(value, isJson) {
+        if (value == null)
+            return 'null';
+        if (typeof value === 'boolean')
+            return value ? 'true' : 'false';
+        if (typeof value === 'number')
+            return String(value);
+        if (typeof value === 'string') {
+            if (this.isDateString(value))
+                return this.formatDate(value);
+            // Try to pretty-print JSON strings
+            if (isJson)
+                return this.formatJsonString(value);
+            if (value.length > 300)
+                return value.substring(0, 300) + '...';
+            return value;
+        }
+        if (typeof value === 'object') {
+            try {
+                return JSON.stringify(value, null, 2);
+            }
+            catch {
+                return String(value);
+            }
+        }
+        return String(value);
+    }
+    formatJsonString(value) {
+        try {
+            const parsed = JSON.parse(value);
+            return JSON.stringify(parsed, null, 2);
+        }
+        catch {
+            return value;
+        }
+    }
+    isDateString(value) {
+        return /^\d{4}-\d{2}-\d{2}T/.test(value);
+    }
+    formatDate(value) {
+        try {
+            const d = new Date(value);
+            return d.toLocaleDateString('en-US', {
+                month: 'short', day: 'numeric', year: 'numeric',
+                hour: '2-digit', minute: '2-digit'
+            });
+        }
+        catch {
+            return value;
+        }
+    }
+    inferType(value) {
+        if (value == null)
+            return 'null';
+        if (typeof value === 'boolean')
+            return 'bit';
+        if (typeof value === 'number')
+            return 'int';
+        if (typeof value === 'string') {
+            if (this.isDateString(value))
+                return 'datetime';
+            if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(value))
+                return 'uniqueidentifier';
+            return 'nvarchar';
+        }
+        return 'object';
+    }
+    static ɵfac = function MjRecordMicroViewComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MjRecordMicroViewComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MjRecordMicroViewComponent, selectors: [["mj-record-micro-view"]], hostBindings: function MjRecordMicroViewComponent_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("keydown.escape", function MjRecordMicroViewComponent_keydown_escape_HostBindingHandler() { return ctx.OnEscapeKey(); }, i0.ɵɵresolveDocument);
+        } }, inputs: { Data: "Data", Inline: "Inline" }, outputs: { Close: "Close", EntityLinkClick: "EntityLinkClick", OpenRecord: "OpenRecord" }, standalone: false, decls: 4, vars: 2, consts: [["microContent", ""], [1, "micro-inline"], [1, "micro-backdrop", 3, "click"], [1, "micro-panel"], [4, "ngTemplateOutlet"], [1, "micro-header"], [1, "micro-inline-header"], [1, "micro-content"], ["text", "Loading record data..."], [1, "micro-error"], [1, "micro-fields"], [1, "micro-empty"], [1, "micro-header-info"], [1, "micro-entity"], [1, "micro-entity-icon"], [1, "micro-record-name"], [1, "micro-record-id"], [1, "fa-solid", "fa-fingerprint"], [1, "micro-header-actions"], ["title", "Open this record", 1, "micro-open-btn", 3, "click"], [1, "fa-solid", "fa-arrow-up-right-from-square"], [1, "micro-close", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "micro-header-left"], [1, "fa-solid", "fa-circle-exclamation"], [1, "micro-toolbar"], [1, "micro-field-header"], [1, "mf-col-name"], [1, "mf-col-value"], [1, "micro-field-row", 3, "odd", "ngClass"], [1, "null-toggle"], ["type", "checkbox", 3, "change", "checked"], [1, "null-toggle-label"], [1, "mf-col-old"], [1, "mf-col-new"], [1, "micro-field-row", 3, "ngClass"], [1, "mf-col-name", 3, "title"], [1, "mf-type-icon"], [1, "mf-field-name"], [1, "mf-col-value", 3, "title"], [1, "mf-fk-link", 3, "title"], [1, "mf-json-value"], [1, "mf-bool-icon"], [1, "mf-bool-label"], [1, "mf-fk-link", 3, "click", "title"], [1, "mf-fk-id"], [1, "fa-solid", "fa-arrow-up-right-from-square", "mf-fk-icon"], [1, "mf-col-old", 3, "title"], [1, "mf-col-new", 3, "title"]], template: function MjRecordMicroViewComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵconditionalCreate(0, MjRecordMicroViewComponent_Conditional_0_Template, 3, 5);
+            i0.ɵɵconditionalCreate(1, MjRecordMicroViewComponent_Conditional_1_Template, 2, 1, "div", 1);
+            i0.ɵɵtemplate(2, MjRecordMicroViewComponent_ng_template_2_Template, 7, 8, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+        } if (rf & 2) {
+            i0.ɵɵconditional(!ctx.Inline ? 0 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.Inline ? 1 : -1);
+        } }, dependencies: [i1.NgClass, i1.NgTemplateOutlet, i2.LoadingComponent, i1.SlicePipe], styles: ["\n\n\n\n\n\n\n.micro-backdrop[_ngcontent-%COMP%] {\n    position: fixed;\n    inset: 0;\n    background: rgba(0, 0, 0, 0);\n    z-index: 1100;\n    transition: background 0.25s ease;\n    pointer-events: none;\n}\n\n.micro-backdrop.visible[_ngcontent-%COMP%] {\n    background: rgba(0, 0, 0, 0.15);\n    pointer-events: auto;\n}\n\n.micro-panel[_ngcontent-%COMP%] {\n    position: fixed;\n    top: 0;\n    right: 0;\n    width: 480px;\n    max-width: 90vw;\n    height: 100vh;\n    background: var(--card-background, #ffffff);\n    box-shadow: -6px 0 24px rgba(0, 0, 0, 0.1);\n    z-index: 1101;\n    display: flex;\n    flex-direction: column;\n    transform: translateX(100%);\n    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.micro-panel.visible[_ngcontent-%COMP%] {\n    transform: translateX(0);\n}\n\n\n\n\n\n\n\n\n.micro-inline[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n.micro-inline-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 16px;\n    padding: 16px 24px;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    flex-shrink: 0;\n}\n\n.micro-header-left[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    min-width: 0;\n}\n\n.micro-content-inline[_ngcontent-%COMP%] {\n    padding: 0;\n}\n\n\n\n\n\n\n\n\n.micro-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    padding: 16px 20px;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    flex-shrink: 0;\n}\n\n.micro-header-info[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    min-width: 0;\n}\n\n.micro-header-actions[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-shrink: 0;\n}\n\n.micro-entity[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--text-primary, #1f2937);\n}\n\n.micro-entity-icon[_ngcontent-%COMP%] {\n    color: #3b82f6;\n}\n\n\n\n.micro-record-name[_ngcontent-%COMP%] {\n    color: #6366f1;\n    font-weight: 700;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.micro-record-id[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 12px;\n    color: var(--text-tertiary, #9ca3af);\n    font-family: 'SF Mono', 'Fira Code', monospace;\n}\n\n.micro-record-id[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 11px;\n}\n\n\n\n.micro-open-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    padding: 6px 12px;\n    background: var(--card-background, #ffffff);\n    border: 1px solid var(--border-color, #e5e7eb);\n    border-radius: 6px;\n    color: #3b82f6;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: all 0.15s ease;\n    white-space: nowrap;\n    flex-shrink: 0;\n}\n\n.micro-open-btn[_ngcontent-%COMP%]:hover {\n    background: #3b82f6;\n    color: white;\n    border-color: #3b82f6;\n}\n\n.micro-open-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 11px;\n}\n\n.micro-close[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: none;\n    border: none;\n    border-radius: 6px;\n    color: var(--text-secondary, #6b7280);\n    cursor: pointer;\n    transition: all 0.15s ease;\n    font-size: 14px;\n    flex-shrink: 0;\n}\n\n.micro-close[_ngcontent-%COMP%]:hover {\n    background: var(--hover-background, #f3f4f6);\n    color: var(--text-primary, #1f2937);\n}\n\n\n\n\n\n\n\n\n.micro-content[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px 0;\n}\n\n.micro-error[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 20px;\n    margin: 0 20px;\n    background: rgba(239, 68, 68, 0.06);\n    border: 1px solid rgba(239, 68, 68, 0.15);\n    border-radius: 8px;\n    font-size: 13px;\n    color: #ef4444;\n}\n\n\n\n.micro-toolbar[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    padding: 8px 20px;\n    border-bottom: 1px solid var(--border-color, #f3f4f6);\n}\n\n.null-toggle[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    cursor: pointer;\n    font-size: 12px;\n    color: var(--text-secondary, #6b7280);\n    user-select: none;\n}\n\n.null-toggle[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n    width: 14px;\n    height: 14px;\n    accent-color: #6366f1;\n    cursor: pointer;\n}\n\n.null-toggle-label[_ngcontent-%COMP%] {\n    font-weight: 500;\n}\n\n\n\n.micro-fields[_ngcontent-%COMP%] {\n    font-size: 13px;\n}\n\n.micro-field-header[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 180px 1fr;\n    padding: 8px 20px;\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--text-tertiary, #9ca3af);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    position: sticky;\n    top: 0;\n    background: var(--card-background, #ffffff);\n    z-index: 1;\n}\n\n.micro-field-header[_ngcontent-%COMP%]:has(.mf-col-old) {\n    grid-template-columns: 160px 1fr 1fr;\n}\n\n.micro-field-row[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 180px 1fr;\n    padding: 7px 20px;\n    align-items: baseline;\n    border-bottom: 1px solid var(--border-color, #f3f4f6);\n    transition: background 0.1s ease;\n}\n\n.micro-field-row[_ngcontent-%COMP%]:hover {\n    background: var(--hover-background, #f9fafb);\n}\n\n.micro-field-row.odd[_ngcontent-%COMP%] {\n    background: var(--hover-background, #fafafa);\n}\n\n.micro-field-row.odd[_ngcontent-%COMP%]:hover {\n    background: #f3f4f6;\n}\n\n\n\n.micro-field-row.diff-added[_ngcontent-%COMP%] {\n    background: rgba(16, 185, 129, 0.04) !important;\n    border-left: 3px solid #10b981;\n}\n\n.micro-field-row.diff-modified[_ngcontent-%COMP%] {\n    background: rgba(245, 158, 11, 0.04) !important;\n    border-left: 3px solid #f59e0b;\n}\n\n.micro-field-row.diff-removed[_ngcontent-%COMP%] {\n    background: rgba(239, 68, 68, 0.04) !important;\n    border-left: 3px solid #ef4444;\n}\n\n.micro-field-row[_ngcontent-%COMP%]:has(.mf-col-old) {\n    grid-template-columns: 160px 1fr 1fr;\n}\n\n.mf-col-name[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    overflow: hidden;\n    cursor: default;\n}\n\n.mf-type-icon[_ngcontent-%COMP%] {\n    color: var(--text-tertiary, #d1d5db);\n    font-size: 11px;\n    width: 14px;\n    text-align: center;\n    flex-shrink: 0;\n}\n\n.mf-field-name[_ngcontent-%COMP%] {\n    font-weight: 500;\n    color: var(--text-primary, #1f2937);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.mf-col-value[_ngcontent-%COMP%], \n.mf-col-old[_ngcontent-%COMP%], \n.mf-col-new[_ngcontent-%COMP%] {\n    color: var(--text-secondary, #6b7280);\n    word-break: break-word;\n    line-height: 1.4;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n    font-size: 12px;\n}\n\n.mf-col-old[_ngcontent-%COMP%] {\n    color: #ef4444;\n    opacity: 0.7;\n    text-decoration: line-through;\n}\n\n.mf-col-new[_ngcontent-%COMP%] {\n    color: #10b981;\n}\n\n\n\n\n\n\n\n\n.mf-bool-icon[_ngcontent-%COMP%] {\n    font-size: 14px;\n    vertical-align: middle;\n}\n\n.mf-bool-true[_ngcontent-%COMP%] {\n    color: #10b981;\n}\n\n.mf-bool-false[_ngcontent-%COMP%] {\n    color: var(--text-tertiary, #d1d5db);\n}\n\n.mf-bool-label[_ngcontent-%COMP%] {\n    margin-left: 6px;\n    font-family: inherit;\n    font-size: 12px;\n    color: var(--text-secondary, #6b7280);\n}\n\n\n\n\n\n\n\n\n.mf-fk-link[_ngcontent-%COMP%] {\n    color: #3b82f6;\n    cursor: pointer;\n    text-decoration: none;\n    font-family: inherit;\n    font-size: inherit;\n    transition: color 0.15s ease;\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mf-fk-link[_ngcontent-%COMP%]:hover {\n    color: #2563eb;\n    text-decoration: underline;\n}\n\n.mf-fk-id[_ngcontent-%COMP%] {\n    color: var(--text-tertiary, #9ca3af);\n    font-size: 10px;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n}\n\n.mf-fk-icon[_ngcontent-%COMP%] {\n    font-size: 9px;\n    opacity: 0.6;\n    transition: opacity 0.15s ease;\n}\n\n.mf-fk-link[_ngcontent-%COMP%]:hover   .mf-fk-icon[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n\n\n\n\n\n\n\n.mf-json-value[_ngcontent-%COMP%] {\n    margin: 0;\n    padding: 8px 10px;\n    background: var(--hover-background, #f9fafb);\n    border: 1px solid var(--border-color, #e5e7eb);\n    border-radius: 6px;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n    font-size: 11px;\n    line-height: 1.5;\n    color: var(--text-secondary, #6b7280);\n    white-space: pre-wrap;\n    word-break: break-word;\n    max-height: 200px;\n    overflow-y: auto;\n}\n\n\n\n.micro-empty[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 40px 20px;\n}\n\n.micro-empty[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--text-tertiary, #9ca3af);\n    margin: 0;\n}\n\n\n\n\n\n\n\n\n.micro-inline[_ngcontent-%COMP%]   .micro-field-header[_ngcontent-%COMP%], \n.micro-inline[_ngcontent-%COMP%]   .micro-field-row[_ngcontent-%COMP%] {\n    padding-left: 24px;\n    padding-right: 24px;\n}\n\n.micro-inline[_ngcontent-%COMP%]   .micro-toolbar[_ngcontent-%COMP%] {\n    padding-left: 24px;\n    padding-right: 24px;\n}\n\n@media (max-width: 600px) {\n    .micro-field-header[_ngcontent-%COMP%], \n   .micro-field-row[_ngcontent-%COMP%] {\n        grid-template-columns: 120px 1fr;\n    }\n\n    .micro-field-header[_ngcontent-%COMP%]:has(.mf-col-old), \n   .micro-field-row[_ngcontent-%COMP%]:has(.mf-col-old) {\n        grid-template-columns: 100px 1fr 1fr;\n    }\n\n    .micro-record-name[_ngcontent-%COMP%] {\n        max-width: 120px;\n    }\n}"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MjRecordMicroViewComponent, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-record-micro-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Overlay mode -->\n@if (!Inline) {\n  <div class=\"micro-backdrop\" [class.visible]=\"IsVisible\" (click)=\"OnBackdropClick()\"></div>\n  <div class=\"micro-panel\" [class.visible]=\"IsVisible\">\n    <ng-container *ngTemplateOutlet=\"microContent\"></ng-container>\n  </div>\n}\n\n<!-- Inline mode (embedded in parent panel) -->\n@if (Inline) {\n  <div class=\"micro-inline\">\n    <ng-container *ngTemplateOutlet=\"microContent\"></ng-container>\n  </div>\n}\n\n<!-- Shared content template -->\n<ng-template #microContent>\n  <!-- Header (overlay mode only) -->\n  @if (!Inline) {\n    <div class=\"micro-header\">\n      <div class=\"micro-header-info\">\n        <div class=\"micro-entity\">\n          <i [class]=\"EntityIcon\" class=\"micro-entity-icon\"></i>\n          <span>{{Data.EntityName}}</span>\n          @if (RecordDisplayName) {\n            <span class=\"micro-record-name\">{{RecordDisplayName}}</span>\n          }\n        </div>\n        <div class=\"micro-record-id\">\n          <i class=\"fa-solid fa-fingerprint\"></i>\n          <span>{{DisplayRecordID}}</span>\n        </div>\n      </div>\n      <div class=\"micro-header-actions\">\n        <button class=\"micro-open-btn\" (click)=\"OnOpenRecord()\" title=\"Open this record\">\n          <i class=\"fa-solid fa-arrow-up-right-from-square\"></i> Open\n        </button>\n        <button class=\"micro-close\" (click)=\"OnClose()\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n    </div>\n  }\n\n  <!-- Inline header -->\n  @if (Inline) {\n    <div class=\"micro-inline-header\">\n      <div class=\"micro-header-left\">\n        <div class=\"micro-entity\">\n          <i [class]=\"EntityIcon\" class=\"micro-entity-icon\"></i>\n          <span>{{Data.EntityName}}</span>\n          @if (RecordDisplayName) {\n            <span class=\"micro-record-name\">{{RecordDisplayName}}</span>\n          }\n        </div>\n        <div class=\"micro-record-id\">\n          <i class=\"fa-solid fa-fingerprint\"></i>\n          <span>{{DisplayRecordID}}</span>\n        </div>\n      </div>\n      <button class=\"micro-open-btn\" (click)=\"OnOpenRecord()\" title=\"Open this record\">\n        <i class=\"fa-solid fa-arrow-up-right-from-square\"></i> Open\n      </button>\n    </div>\n  }\n\n  <!-- Content -->\n  <div class=\"micro-content\" [class.micro-content-inline]=\"Inline\">\n    @if (IsLoading) {\n      <mj-loading text=\"Loading record data...\"></mj-loading>\n    }\n\n    <!-- Error -->\n    @if (!IsLoading && ErrorMessage) {\n      <div class=\"micro-error\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        <span>{{ErrorMessage}}</span>\n      </div>\n    }\n\n    <!-- Field table -->\n    @if (!IsLoading && !ErrorMessage && Fields.length > 0) {\n      <div class=\"micro-fields\">\n        <!-- Null toggle toolbar -->\n        @if (HiddenNullCount > 0) {\n          <div class=\"micro-toolbar\">\n            <label class=\"null-toggle\">\n              <input type=\"checkbox\" [checked]=\"ShowNullValues\" (change)=\"ToggleShowNulls()\" />\n              <span class=\"null-toggle-label\">Show null values ({{HiddenNullCount}})</span>\n            </label>\n          </div>\n        }\n        <div class=\"micro-field-header\">\n          <span class=\"mf-col-name\">Field</span>\n          @if (!HasDiffs) {\n            <span class=\"mf-col-value\">Value</span>\n          }\n          @if (HasDiffs) {\n            <span class=\"mf-col-old\">Old</span>\n            <span class=\"mf-col-new\">New</span>\n          }\n        </div>\n        @for (field of VisibleFields; track field; let odd = $odd) {\n          <div class=\"micro-field-row\"\n            [class.odd]=\"odd\" [ngClass]=\"field.DiffClass\">\n            <span class=\"mf-col-name\" [title]=\"field.Description\">\n              <i [class]=\"GetTypeIcon(field.Type)\" class=\"mf-type-icon\"></i>\n              <span class=\"mf-field-name\">{{field.DisplayName}}</span>\n            </span>\n            @if (!HasDiffs) {\n              <span class=\"mf-col-value\" [title]=\"field.Value\">\n                <!-- Boolean field -->\n                @if (field.IsBoolean && !field.IsNull) {\n                  <i [class]=\"field.BooleanValue ? 'fa-solid fa-square-check mf-bool-true' : 'fa-regular fa-square mf-bool-false'\"\n                  class=\"mf-bool-icon\"></i>\n                  <span class=\"mf-bool-label\">{{field.BooleanValue ? 'Yes' : 'No'}}</span>\n                }\n                <!-- FK field with display value \u2014 show display name (ID) with open icon -->\n                @if (!field.IsBoolean && field.ForeignKeyEntityName && field.ForeignKeyDisplayValue) {\n                  <a class=\"mf-fk-link\" (click)=\"OnEntityLinkClicked($event, field)\"\n                    [title]=\"field.ForeignKeyEntityName + ': ' + field.ForeignKeyRecordId\">\n                    {{field.ForeignKeyDisplayValue}}\n                    <span class=\"mf-fk-id\">({{field.ForeignKeyRecordId | slice:0:8}}...)</span>\n                    <i class=\"fa-solid fa-arrow-up-right-from-square mf-fk-icon\"></i>\n                  </a>\n                }\n                <!-- FK field without display value \u2014 show raw ID with open icon -->\n                @if (!field.IsBoolean && field.ForeignKeyEntityName && !field.ForeignKeyDisplayValue) {\n                  <a class=\"mf-fk-link\" (click)=\"OnEntityLinkClicked($event, field)\"\n                    [title]=\"'Open ' + field.ForeignKeyEntityName\">\n                    {{field.Value}}\n                    <i class=\"fa-solid fa-arrow-up-right-from-square mf-fk-icon\"></i>\n                  </a>\n                }\n                <!-- JSON field \u2014 formatted -->\n                @if (!field.IsBoolean && !field.ForeignKeyEntityName && field.IsJson) {\n                  <pre class=\"mf-json-value\">{{field.Value}}</pre>\n                }\n                <!-- Regular value -->\n                @if (!field.IsBoolean && !field.ForeignKeyEntityName && !field.IsJson) {\n                  {{field.Value}}\n                }\n              </span>\n            }\n            @if (HasDiffs) {\n              <span class=\"mf-col-old\" [title]=\"field.OldValue\">\n                {{field.OldValue || field.Value}}\n              </span>\n              <span class=\"mf-col-new\" [title]=\"field.Value\">\n                {{field.Value}}\n              </span>\n            }\n          </div>\n        }\n      </div>\n    }\n\n    <!-- Empty -->\n    @if (!IsLoading && !ErrorMessage && Fields.length === 0) {\n      <div class=\"micro-empty\">\n        <p>No field data available.</p>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: ["/* ================================================================= */\n/* OVERLAY MODE */\n/* ================================================================= */\n\n.micro-backdrop {\n    position: fixed;\n    inset: 0;\n    background: rgba(0, 0, 0, 0);\n    z-index: 1100;\n    transition: background 0.25s ease;\n    pointer-events: none;\n}\n\n.micro-backdrop.visible {\n    background: rgba(0, 0, 0, 0.15);\n    pointer-events: auto;\n}\n\n.micro-panel {\n    position: fixed;\n    top: 0;\n    right: 0;\n    width: 480px;\n    max-width: 90vw;\n    height: 100vh;\n    background: var(--card-background, #ffffff);\n    box-shadow: -6px 0 24px rgba(0, 0, 0, 0.1);\n    z-index: 1101;\n    display: flex;\n    flex-direction: column;\n    transform: translateX(100%);\n    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.micro-panel.visible {\n    transform: translateX(0);\n}\n\n/* ================================================================= */\n/* INLINE MODE */\n/* ================================================================= */\n\n.micro-inline {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n.micro-inline-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 16px;\n    padding: 16px 24px;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    flex-shrink: 0;\n}\n\n.micro-header-left {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    min-width: 0;\n}\n\n.micro-content-inline {\n    padding: 0;\n}\n\n/* ================================================================= */\n/* HEADER (overlay mode) */\n/* ================================================================= */\n\n.micro-header {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    padding: 16px 20px;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    flex-shrink: 0;\n}\n\n.micro-header-info {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    min-width: 0;\n}\n\n.micro-header-actions {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-shrink: 0;\n}\n\n.micro-entity {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--text-primary, #1f2937);\n}\n\n.micro-entity-icon {\n    color: #3b82f6;\n}\n\n/* Record display name shown prominently next to entity name */\n.micro-record-name {\n    color: #6366f1;\n    font-weight: 700;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.micro-record-id {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 12px;\n    color: var(--text-tertiary, #9ca3af);\n    font-family: 'SF Mono', 'Fira Code', monospace;\n}\n\n.micro-record-id i {\n    font-size: 11px;\n}\n\n/* Open record button */\n.micro-open-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    padding: 6px 12px;\n    background: var(--card-background, #ffffff);\n    border: 1px solid var(--border-color, #e5e7eb);\n    border-radius: 6px;\n    color: #3b82f6;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: all 0.15s ease;\n    white-space: nowrap;\n    flex-shrink: 0;\n}\n\n.micro-open-btn:hover {\n    background: #3b82f6;\n    color: white;\n    border-color: #3b82f6;\n}\n\n.micro-open-btn i {\n    font-size: 11px;\n}\n\n.micro-close {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: none;\n    border: none;\n    border-radius: 6px;\n    color: var(--text-secondary, #6b7280);\n    cursor: pointer;\n    transition: all 0.15s ease;\n    font-size: 14px;\n    flex-shrink: 0;\n}\n\n.micro-close:hover {\n    background: var(--hover-background, #f3f4f6);\n    color: var(--text-primary, #1f2937);\n}\n\n/* ================================================================= */\n/* CONTENT */\n/* ================================================================= */\n\n.micro-content {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px 0;\n}\n\n.micro-error {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 20px;\n    margin: 0 20px;\n    background: rgba(239, 68, 68, 0.06);\n    border: 1px solid rgba(239, 68, 68, 0.15);\n    border-radius: 8px;\n    font-size: 13px;\n    color: #ef4444;\n}\n\n/* Null toggle toolbar */\n.micro-toolbar {\n    display: flex;\n    align-items: center;\n    padding: 8px 20px;\n    border-bottom: 1px solid var(--border-color, #f3f4f6);\n}\n\n.null-toggle {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    cursor: pointer;\n    font-size: 12px;\n    color: var(--text-secondary, #6b7280);\n    user-select: none;\n}\n\n.null-toggle input[type=\"checkbox\"] {\n    width: 14px;\n    height: 14px;\n    accent-color: #6366f1;\n    cursor: pointer;\n}\n\n.null-toggle-label {\n    font-weight: 500;\n}\n\n/* Field table */\n.micro-fields {\n    font-size: 13px;\n}\n\n.micro-field-header {\n    display: grid;\n    grid-template-columns: 180px 1fr;\n    padding: 8px 20px;\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--text-tertiary, #9ca3af);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    border-bottom: 1px solid var(--border-color, #e5e7eb);\n    position: sticky;\n    top: 0;\n    background: var(--card-background, #ffffff);\n    z-index: 1;\n}\n\n.micro-field-header:has(.mf-col-old) {\n    grid-template-columns: 160px 1fr 1fr;\n}\n\n.micro-field-row {\n    display: grid;\n    grid-template-columns: 180px 1fr;\n    padding: 7px 20px;\n    align-items: baseline;\n    border-bottom: 1px solid var(--border-color, #f3f4f6);\n    transition: background 0.1s ease;\n}\n\n.micro-field-row:hover {\n    background: var(--hover-background, #f9fafb);\n}\n\n.micro-field-row.odd {\n    background: var(--hover-background, #fafafa);\n}\n\n.micro-field-row.odd:hover {\n    background: #f3f4f6;\n}\n\n/* Diff styling */\n.micro-field-row.diff-added {\n    background: rgba(16, 185, 129, 0.04) !important;\n    border-left: 3px solid #10b981;\n}\n\n.micro-field-row.diff-modified {\n    background: rgba(245, 158, 11, 0.04) !important;\n    border-left: 3px solid #f59e0b;\n}\n\n.micro-field-row.diff-removed {\n    background: rgba(239, 68, 68, 0.04) !important;\n    border-left: 3px solid #ef4444;\n}\n\n.micro-field-row:has(.mf-col-old) {\n    grid-template-columns: 160px 1fr 1fr;\n}\n\n.mf-col-name {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    overflow: hidden;\n    cursor: default;\n}\n\n.mf-type-icon {\n    color: var(--text-tertiary, #d1d5db);\n    font-size: 11px;\n    width: 14px;\n    text-align: center;\n    flex-shrink: 0;\n}\n\n.mf-field-name {\n    font-weight: 500;\n    color: var(--text-primary, #1f2937);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.mf-col-value,\n.mf-col-old,\n.mf-col-new {\n    color: var(--text-secondary, #6b7280);\n    word-break: break-word;\n    line-height: 1.4;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n    font-size: 12px;\n}\n\n.mf-col-old {\n    color: #ef4444;\n    opacity: 0.7;\n    text-decoration: line-through;\n}\n\n.mf-col-new {\n    color: #10b981;\n}\n\n/* ================================================================= */\n/* BOOLEAN FIELD DISPLAY */\n/* ================================================================= */\n\n.mf-bool-icon {\n    font-size: 14px;\n    vertical-align: middle;\n}\n\n.mf-bool-true {\n    color: #10b981;\n}\n\n.mf-bool-false {\n    color: var(--text-tertiary, #d1d5db);\n}\n\n.mf-bool-label {\n    margin-left: 6px;\n    font-family: inherit;\n    font-size: 12px;\n    color: var(--text-secondary, #6b7280);\n}\n\n/* ================================================================= */\n/* FOREIGN KEY LINK STYLES */\n/* ================================================================= */\n\n.mf-fk-link {\n    color: #3b82f6;\n    cursor: pointer;\n    text-decoration: none;\n    font-family: inherit;\n    font-size: inherit;\n    transition: color 0.15s ease;\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mf-fk-link:hover {\n    color: #2563eb;\n    text-decoration: underline;\n}\n\n.mf-fk-id {\n    color: var(--text-tertiary, #9ca3af);\n    font-size: 10px;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n}\n\n.mf-fk-icon {\n    font-size: 9px;\n    opacity: 0.6;\n    transition: opacity 0.15s ease;\n}\n\n.mf-fk-link:hover .mf-fk-icon {\n    opacity: 1;\n}\n\n/* ================================================================= */\n/* JSON FIELD DISPLAY */\n/* ================================================================= */\n\n.mf-json-value {\n    margin: 0;\n    padding: 8px 10px;\n    background: var(--hover-background, #f9fafb);\n    border: 1px solid var(--border-color, #e5e7eb);\n    border-radius: 6px;\n    font-family: 'SF Mono', 'Fira Code', monospace;\n    font-size: 11px;\n    line-height: 1.5;\n    color: var(--text-secondary, #6b7280);\n    white-space: pre-wrap;\n    word-break: break-word;\n    max-height: 200px;\n    overflow-y: auto;\n}\n\n/* Empty */\n.micro-empty {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 40px 20px;\n}\n\n.micro-empty p {\n    font-size: 14px;\n    color: var(--text-tertiary, #9ca3af);\n    margin: 0;\n}\n\n/* ================================================================= */\n/* INLINE MODE - Responsive */\n/* ================================================================= */\n\n.micro-inline .micro-field-header,\n.micro-inline .micro-field-row {\n    padding-left: 24px;\n    padding-right: 24px;\n}\n\n.micro-inline .micro-toolbar {\n    padding-left: 24px;\n    padding-right: 24px;\n}\n\n@media (max-width: 600px) {\n    .micro-field-header,\n    .micro-field-row {\n        grid-template-columns: 120px 1fr;\n    }\n\n    .micro-field-header:has(.mf-col-old),\n    .micro-field-row:has(.mf-col-old) {\n        grid-template-columns: 100px 1fr 1fr;\n    }\n\n    .micro-record-name {\n        max-width: 120px;\n    }\n}\n"] }]
+    }], () => [{ type: i0.ChangeDetectorRef }], { Data: [{
+            type: Input
+        }], Inline: [{
+            type: Input
+        }], Close: [{
+            type: Output
+        }], EntityLinkClick: [{
+            type: Output
+        }], OpenRecord: [{
+            type: Output
+        }], OnEscapeKey: [{
+            type: HostListener,
+            args: ['document:keydown.escape']
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MjRecordMicroViewComponent, { className: "MjRecordMicroViewComponent", filePath: "src/lib/record-micro-view/record-micro-view.component.ts", lineNumber: 44 }); })();
+//# sourceMappingURL=record-micro-view.component.js.map