@memberjunction/ng-record-changes 2.41.0 → 2.42.1

package/dist/lib/ng-record-changes.component.d.ts

@@ -1,32 +1,61 @@
 import { EventEmitter, OnInit, Renderer2, ElementRef, AfterViewInit, OnDestroy } from '@angular/core';
-import { DomSanitizer } from '@angular/platform-browser';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { SortDescriptor } from '@progress/kendo-data-query';
-import { BaseEntity } from '@memberjunction/core';
+import { BaseEntity, CompositeKey } from '@memberjunction/core';
+import { RecordChangeEntity } from '@memberjunction/core-entities';
+import { MJNotificationService } from '@memberjunction/ng-notifications';
 import * as i0 from "@angular/core";
 export declare class RecordChangesComponent implements OnInit, AfterViewInit, OnDestroy {
-    private sanitizer;
     private renderer;
+    private mjNotificationService;
+    private sanitizer;
     showloader: boolean;
     dialogClosed: EventEmitter<any>;
     record: BaseEntity;
     wrapper: ElementRef;
-    viewData: any;
-    visibleColumns: any;
+    viewData: RecordChangeEntity[];
+    filteredData: RecordChangeEntity[];
+    expandedItems: Set<string>;
+    searchTerm: string;
+    selectedType: string;
+    selectedSource: string;
     sortSettings: SortDescriptor[];
-    constructor(sanitizer: DomSanitizer, renderer: Renderer2);
+    constructor(renderer: Renderer2, mjNotificationService: MJNotificationService, sanitizer: DomSanitizer);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
-    LoadRecordChanges(KeyValuePairString: string, appName: string, entityName: string): Promise<void>;
-    prepareColumns(): void;
+    LoadRecordChanges(pkey: CompositeKey, appName: string, entityName: string): Promise<void>;
     closePropertiesDialog(): void;
-    FormatColumnValue(col: any, value: any, dataItem: any, maxLength?: number, trailingChars?: string): any;
-    protected fieldMarkup(fieldName: string): string;
-    protected valueMarkup(changeInfo: {
+    onSearchChange(): void;
+    onFilterChange(): void;
+    private applyFilters;
+    toggleExpansion(changeId: string): void;
+    onTimelineItemKeydown(event: KeyboardEvent, changeId: string): void;
+    getChangeTypeClass(type: string): string;
+    getChangeTypeIcon(type: string): string;
+    getChangeTypeBadgeClass(type: string): string;
+    getSourceClass(source: string): string;
+    getStatusClass(status: string): string;
+    getTimelineItemLabel(change: RecordChangeEntity): string;
+    formatRelativeTime(date: Date): string;
+    formatFullDateTime(date: Date): string;
+    getChangeSummary(change: RecordChangeEntity): string;
+    getFieldChanges(change: RecordChangeEntity): Array<{
         field: string;
+        displayName: string;
         oldValue: any;
         newValue: any;
-    }, isOldValue: boolean): string;
+        isBooleanField: boolean;
+        diffHtml?: SafeHtml;
+    }>;
+    getCreatedFields(change: RecordChangeEntity): Array<{
+        name: string;
+        displayName: string;
+        value: any;
+    }>;
+    private generateDiffHtml;
+    private shouldUseWordDiff;
+    private escapeHtml;
     static ɵfac: i0.ɵɵFactoryDeclaration<RecordChangesComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<RecordChangesComponent, "mj-record-changes", never, { "record": { "alias": "record"; "required": false; }; }, { "dialogClosed": "dialogClosed"; }, never, never, false, never>;
 }

package/dist/lib/ng-record-changes.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ng-record-changes.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-record-changes.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,YAAY,EAAS,MAAM,EAAU,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAa,MAAM,eAAe,CAAC;AAC3I,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAyD,MAAM,sBAAsB,CAAC;;AAEzG,qBAKa,sBAAuB,YAAW,MAAM,EAAE,aAAa,EAAE,SAAS;IAkBjE,OAAO,CAAC,SAAS;IAAgB,OAAO,CAAC,QAAQ;IAjBtD,UAAU,EAAE,OAAO,CAAS;IACzB,YAAY,oBAAsB;IACnC,MAAM,EAAG,UAAU,CAAC;IAEwB,OAAO,EAAG,UAAU,CAAC;IAG1E,QAAQ,EAAE,GAAG,CAAM;IACnB,cAAc,EAAE,GAAG,CAAM;IACzB,YAAY,EAAE,cAAc,EAAE,CAK5B;gBAGkB,SAAS,EAAE,YAAY,EAAU,QAAQ,EAAE,SAAS;IAExE,QAAQ,IAAI,IAAI;IAQhB,eAAe,IAAI,IAAI;IAMvB,WAAW,IAAI,IAAI;IAMb,iBAAiB,CAAC,kBAAkB,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;IAevF,cAAc;IAcd,qBAAqB;IAIrB,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,SAAS,GAAE,MAAU,EAAE,aAAa,GAAE,MAAc;IAiE3G,SAAS,CAAC,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM;IAGhD,SAAS,CAAC,WAAW,CAAC,UAAU,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,GAAG,CAAC;QAAC,QAAQ,EAAE,GAAG,CAAA;KAAC,EAAE,UAAU,EAAE,OAAO,GAAG,MAAM;yCA7IlG,sBAAsB;2CAAtB,sBAAsB;CAgJlC"}
+{"version":3,"file":"ng-record-changes.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-record-changes.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,YAAY,EAAS,MAAM,EAAU,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAgC,MAAM,eAAe,CAAC;AAC9J,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,YAAY,EAAgD,MAAM,sBAAsB,CAAC;AAC9G,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;;AAGzE,qBAMa,sBAAuB,YAAW,MAAM,EAAE,aAAa,EAAE,SAAS;IAwBjE,OAAO,CAAC,QAAQ;IAAa,OAAO,CAAC,qBAAqB;IAAyB,OAAO,CAAC,SAAS;IAvBzG,UAAU,EAAE,OAAO,CAAS;IACzB,YAAY,oBAAsB;IACnC,MAAM,EAAG,UAAU,CAAC;IAEwB,OAAO,EAAG,UAAU,CAAC;IAE1E,QAAQ,EAAE,kBAAkB,EAAE,CAAM;IACpC,YAAY,EAAE,kBAAkB,EAAE,CAAM;IACxC,aAAa,EAAE,GAAG,CAAC,MAAM,CAAC,CAAa;IAGvC,UAAU,EAAE,MAAM,CAAM;IACxB,YAAY,EAAE,MAAM,CAAM;IAC1B,cAAc,EAAE,MAAM,CAAM;IAE5B,YAAY,EAAE,cAAc,EAAE,CAK5B;gBAGkB,QAAQ,EAAE,SAAS,EAAU,qBAAqB,EAAE,qBAAqB,EAAU,SAAS,EAAE,YAAY;IAE9H,QAAQ,IAAI,IAAI;IAOhB,eAAe,IAAI,IAAI;IAMvB,WAAW,IAAI,IAAI;IAMN,iBAAiB,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM;IAetF,qBAAqB;IAKrB,cAAc,IAAI,IAAI;IAItB,cAAc,IAAI,IAAI;IAItB,OAAO,CAAC,YAAY;IA2BpB,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAQvC,qBAAqB,CAAC,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI;IAQnE,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IASxC,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IASvC,uBAAuB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IAS7C,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAItC,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAStC,oBAAoB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM;IAIxD,kBAAkB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAmBtC,kBAAkB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAYtC,gBAAgB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM;IAwCpD,eAAe,CAAC,MAAM,EAAE,kBAAkB,GAAG,KAAK,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,GAAG,CAAC;QAAC,QAAQ,EAAE,GAAG,CAAC;QAAC,cAAc,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,EAAE,QAAQ,CAAA;KAAC,CAAC;IAuCpK,gBAAgB,CAAC,MAAM,EAAE,kBAAkB,GAAG,KAAK,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,GAAG,CAAA;KAAC,CAAC;IAmBpG,OAAO,CAAC,gBAAgB;IAoCxB,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,UAAU;yCA/UP,sBAAsB;2CAAtB,sBAAsB;CAoVlC"}

package/dist/lib/ng-record-changes.component.js

@@ -7,56 +7,372 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-import { EntityFieldTSType, LogError, RunView } from '@memberjunction/core';
+import { Component, EventEmitter, Input, Output, ViewChild, ViewEncapsulation } from '@angular/core';
+import { EntityFieldTSType, Metadata } from '@memberjunction/core';
+import { diffChars, diffWords } from 'diff';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/platform-browser";
-import * as i2 from "@angular/common";
-import * as i3 from "@progress/kendo-angular-grid";
-import * as i4 from "@progress/kendo-angular-dialog";
-import * as i5 from "@progress/kendo-angular-indicators";
+import * as i1 from "@memberjunction/ng-notifications";
+import * as i2 from "@angular/platform-browser";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/forms";
+import * as i5 from "@progress/kendo-angular-dialog";
+import * as i6 from "@progress/kendo-angular-indicators";
 const _c0 = ["recordChangesWrapper"];
-const _c1 = () => ({ "font-weight": "bold", "background-color": "#a9c2af" });
+const _forTrack0 = ($index, $item) => $item.ID;
+const _forTrack1 = ($index, $item) => $item.name;
+const _forTrack2 = ($index, $item) => $item.field;
 function RecordChangesComponent_kendo_loader_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "kendo-loader", 6);
 } }
-function RecordChangesComponent_div_5_kendo_grid_column_4_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 13);
+function RecordChangesComponent_Conditional_5_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2(" Showing ", ctx_r2.filteredData.length, " of ", ctx_r2.viewData.length, " changes ");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_23_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 22);
+    i0.ɵɵtext(1, " No changes found for this record. ");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_23_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 23);
+    i0.ɵɵtext(1, " No changes match your current filters. ");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 20);
+    i0.ɵɵtemplate(1, RecordChangesComponent_Conditional_5_Conditional_23_Conditional_1_Template, 2, 0)(2, RecordChangesComponent_Conditional_5_Conditional_23_Conditional_2_Template, 2, 0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.viewData.length === 0 ? 1 : 2);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 28);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 38);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" via ", change_r5.Integration, " ");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 39);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.getChangeSummary(change_r5), " ");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Conditional_4_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 50)(1, "span", 51);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 52);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const field_r6 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r6.displayName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(field_r6.value);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 49);
+    i0.ɵɵrepeaterCreate(1, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Conditional_4_For_2_Template, 5, 2, "div", 50, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext(3).$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r2.getCreatedFields(change_r5));
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 43)(1, "h4");
+    i0.ɵɵelement(2, "i", 48);
+    i0.ɵɵtext(3, " Record Created");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(4, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Conditional_4_Template, 3, 0, "div", 49);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const dataItem_r2 = ctx.$implicit;
-    const item_r3 = i0.ɵɵnextContext().$implicit;
-    const ctx_r3 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("innerHTML", ctx_r3.FormatColumnValue(item_r3, dataItem_r2[item_r3.field], dataItem_r2), i0.ɵɵsanitizeHtml);
+    const change_r5 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(change_r5.FullRecordJSON ? 4 : -1);
 } }
-function RecordChangesComponent_div_5_kendo_grid_column_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "kendo-grid-column", 11);
-    i0.ɵɵtemplate(1, RecordChangesComponent_div_5_kendo_grid_column_4_ng_template_1_Template, 1, 1, "ng-template", 12);
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 44)(1, "h4");
+    i0.ɵɵelement(2, "i", 53);
+    i0.ɵɵtext(3, " Record Deleted");
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p", 54);
+    i0.ɵɵtext(5, "This record was permanently removed from the system.");
+    i0.ɵɵelementEnd()();
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 57)(1, "span", 60);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const item_r3 = ctx.$implicit;
-    i0.ɵɵpropertyInterpolate("field", item_r3.field);
-    i0.ɵɵpropertyInterpolate("title", item_r3.title);
-    i0.ɵɵproperty("width", item_r3.width)("headerStyle", i0.ɵɵpureFunction0(4, _c1));
+    const fieldChange_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(fieldChange_r7.newValue);
 } }
-function RecordChangesComponent_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 7, 1)(2, "div", 8)(3, "kendo-grid", 9);
-    i0.ɵɵtemplate(4, RecordChangesComponent_div_5_kendo_grid_column_4_Template, 2, 5, "kendo-grid-column", 10);
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 58);
+    i0.ɵɵelement(1, "div", 61);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const fieldChange_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("innerHTML", fieldChange_r7.diffHtml, i0.ɵɵsanitizeHtml);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 59)(1, "div", 62)(2, "span", 63);
+    i0.ɵɵtext(3, "From:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 64);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(6, "div", 65);
+    i0.ɵɵelement(7, "i", 66);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 60)(9, "span", 63);
+    i0.ɵɵtext(10, "To:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "span", 64);
+    i0.ɵɵtext(12);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r3 = i0.ɵɵnextContext();
+    const fieldChange_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(fieldChange_r7.oldValue || "(empty)");
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate(fieldChange_r7.newValue || "(empty)");
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 56)(1, "div", 51);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(3, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_3_Template, 3, 1, "div", 57)(4, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_4_Template, 2, 1, "div", 58)(5, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Conditional_5_Template, 13, 2, "div", 59);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const fieldChange_r7 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(fieldChange_r7.displayName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(fieldChange_r7.isBooleanField ? 3 : fieldChange_r7.diffHtml ? 4 : 5);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 45)(1, "h4");
+    i0.ɵɵelement(2, "i", 55);
+    i0.ɵɵtext(3, " Fields Changed");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "div", 49);
+    i0.ɵɵrepeaterCreate(5, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_For_6_Template, 6, 2, "div", 56, _forTrack2);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext(2).$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(5);
+    i0.ɵɵrepeater(ctx_r2.getFieldChanges(change_r5));
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 46)(1, "h5");
+    i0.ɵɵelement(2, "i", 67);
+    i0.ɵɵtext(3, " Comments");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(change_r5.Comments);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 47)(1, "h5");
+    i0.ɵɵelement(2, "i", 68);
+    i0.ɵɵtext(3, " Errors");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "pre", 69);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(change_r5.ErrorLog);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 40)(1, "div", 41);
+    i0.ɵɵelement(2, "i", 42);
+    i0.ɵɵelementStart(3, "strong");
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(5, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_5_Template, 5, 1, "div", 43)(6, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_6_Template, 6, 0, "div", 44)(7, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_7_Template, 7, 0, "div", 45)(8, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_8_Template, 6, 1, "div", 46)(9, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Conditional_9_Template, 6, 1, "div", 47);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const change_r5 = i0.ɵɵnextContext().$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r2.formatFullDateTime(change_r5.ChangedAt));
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(change_r5.Type === "Create" ? 5 : change_r5.Type === "Delete" ? 6 : 7);
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("kendoGridBinding", ctx_r3.viewData)("pageSize", 100)("sortable", true)("sort", ctx_r3.sortSettings)("loading", ctx_r3.showloader)("resizable", true)("navigable", true);
+    i0.ɵɵconditional(change_r5.Comments ? 8 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r3.visibleColumns);
+    i0.ɵɵconditional(change_r5.ErrorLog ? 9 : -1);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 25);
+    i0.ɵɵlistener("click", function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Template_div_click_0_listener() { const change_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.toggleExpansion(change_r5.ID)); })("keydown", function RecordChangesComponent_Conditional_5_Conditional_24_For_2_Template_div_keydown_0_listener($event) { const change_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onTimelineItemKeydown($event, change_r5.ID)); });
+    i0.ɵɵelementStart(1, "div", 26)(2, "div", 27);
+    i0.ɵɵelement(3, "i");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(4, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_4_Template, 1, 0, "div", 28);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 29)(6, "div", 30)(7, "div", 31)(8, "span", 32);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "span", 33);
+    i0.ɵɵtext(11);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "span", 34);
+    i0.ɵɵtext(13);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(14, "div", 35)(15, "span", 36);
+    i0.ɵɵtext(16);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "span", 37);
+    i0.ɵɵtext(18);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(19, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_19_Template, 2, 1, "span", 38);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(20, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_20_Template, 2, 1, "div", 39)(21, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Conditional_21_Template, 10, 4, "div", 40);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const change_r5 = ctx.$implicit;
+    const ɵ$index_65_r8 = ctx.$index;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("expanded", ctx_r2.expandedItems.has(change_r5.ID));
+    i0.ɵɵattribute("tabindex", 0)("aria-expanded", ctx_r2.expandedItems.has(change_r5.ID))("aria-label", ctx_r2.getTimelineItemLabel(change_r5));
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassMap(ctx_r2.getChangeTypeClass(change_r5.Type));
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r2.getChangeTypeIcon(change_r5.Type));
+    i0.ɵɵattribute("aria-hidden", true);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ɵ$index_65_r8 < ctx_r2.filteredData.length - 1 ? 4 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵclassMap(ctx_r2.getChangeTypeBadgeClass(change_r5.Type));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", change_r5.Type, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(change_r5.User || "Unknown User");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r2.getSourceClass(change_r5.Source));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", change_r5.Source, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("title", ctx_r2.formatFullDateTime(change_r5.ChangedAt));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.formatRelativeTime(change_r5.ChangedAt), " ");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r2.getStatusClass(change_r5.Status));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", change_r5.Status, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(change_r5.Integration ? 19 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r2.expandedItems.has(change_r5.ID) ? 20 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.expandedItems.has(change_r5.ID) ? 21 : -1);
+} }
+function RecordChangesComponent_Conditional_5_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21);
+    i0.ɵɵrepeaterCreate(1, RecordChangesComponent_Conditional_5_Conditional_24_For_2_Template, 22, 26, "div", 24, _forTrack0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r2.filteredData);
+} }
+function RecordChangesComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 5, 1)(2, "div", 7)(3, "div", 8)(4, "input", 9);
+    i0.ɵɵtwoWayListener("ngModelChange", function RecordChangesComponent_Conditional_5_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r2.searchTerm, $event) || (ctx_r2.searchTerm = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("input", function RecordChangesComponent_Conditional_5_Template_input_input_4_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSearchChange()); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "select", 10);
+    i0.ɵɵtwoWayListener("ngModelChange", function RecordChangesComponent_Conditional_5_Template_select_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r2.selectedType, $event) || (ctx_r2.selectedType = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("change", function RecordChangesComponent_Conditional_5_Template_select_change_5_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onFilterChange()); });
+    i0.ɵɵelementStart(6, "option", 11);
+    i0.ɵɵtext(7, "All Changes");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "option", 12);
+    i0.ɵɵtext(9, "Created");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "option", 13);
+    i0.ɵɵtext(11, "Updated");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "option", 14);
+    i0.ɵɵtext(13, "Deleted");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(14, "select", 15);
+    i0.ɵɵtwoWayListener("ngModelChange", function RecordChangesComponent_Conditional_5_Template_select_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r2.selectedSource, $event) || (ctx_r2.selectedSource = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("change", function RecordChangesComponent_Conditional_5_Template_select_change_14_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onFilterChange()); });
+    i0.ɵɵelementStart(15, "option", 11);
+    i0.ɵɵtext(16, "All Sources");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "option", 16);
+    i0.ɵɵtext(18, "Internal");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "option", 17);
+    i0.ɵɵtext(20, "External");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵtemplate(21, RecordChangesComponent_Conditional_5_Conditional_21_Template, 2, 2, "div", 18);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(22, "div", 19);
+    i0.ɵɵtemplate(23, RecordChangesComponent_Conditional_5_Conditional_23_Template, 3, 1, "div", 20)(24, RecordChangesComponent_Conditional_5_Conditional_24_Template, 3, 0, "div", 21);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r2.searchTerm);
+    i0.ɵɵadvance();
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r2.selectedType);
+    i0.ɵɵadvance(9);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r2.selectedSource);
+    i0.ɵɵadvance(7);
+    i0.ɵɵconditional(ctx_r2.filteredData.length !== ctx_r2.viewData.length ? 21 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵattribute("aria-label", "Timeline of changes for " + ctx_r2.record.EntityInfo.Name + " record");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.filteredData.length === 0 ? 23 : 24);
 } }
 export class RecordChangesComponent {
-    constructor(sanitizer, renderer) {
-        this.sanitizer = sanitizer;
+    constructor(renderer, mjNotificationService, sanitizer) {
         this.renderer = renderer;
+        this.mjNotificationService = mjNotificationService;
+        this.sanitizer = sanitizer;
         this.showloader = false;
         this.dialogClosed = new EventEmitter();
         this.viewData = [];
-        this.visibleColumns = [];
+        this.filteredData = [];
+        this.expandedItems = new Set();
+        // Filter properties
+        this.searchTerm = '';
+        this.selectedType = '';
+        this.selectedSource = '';
         this.sortSettings = [
             {
                 field: "ChangedAt",
@@ -67,8 +383,7 @@ export class RecordChangesComponent {
     ngOnInit() {
         if (this.record) {
             this.showloader = true;
-            this.LoadRecordChanges(this.record.PrimaryKey.ToConcatenatedString(), '', this.record.EntityInfo.Name);
-            this.prepareColumns();
+            this.LoadRecordChanges(this.record.PrimaryKey, '', this.record.EntityInfo.Name);
         }
     }
     ngAfterViewInit() {
@@ -81,131 +396,296 @@ export class RecordChangesComponent {
         if (this.renderer && this.wrapper && this.wrapper.nativeElement)
             this.renderer.removeChild(document.body, this.wrapper.nativeElement);
     }
-    LoadRecordChanges(KeyValuePairString, appName, entityName) {
+    LoadRecordChanges(pkey, appName, entityName) {
         return __awaiter(this, void 0, void 0, function* () {
-            // Perform any necessary actions with the ViewID, such as fetching data
-            if (KeyValuePairString && entityName) {
-                const rv = new RunView();
-                const response = yield rv.RunView({ EntityName: "Record Changes", ExtraFilter: `Entity='${entityName}' AND RecordID='${KeyValuePairString}'` });
-                if (response.Success) {
-                    this.viewData = response.Results;
+            if (pkey && entityName) {
+                const md = new Metadata();
+                const changes = yield md.GetRecordChanges(entityName, pkey);
+                if (changes) {
+                    this.viewData = changes.sort((a, b) => new Date(b.ChangedAt).getTime() - new Date(a.ChangedAt).getTime());
+                    this.filteredData = [...this.viewData];
                     this.showloader = false;
                 }
                 else {
-                    LogError(response.ErrorMessage);
+                    this.mjNotificationService.CreateSimpleNotification(`Error loading record changes for ${entityName} with primary key ${pkey.ToString()}.`, 'error');
                     this.showloader = false;
                 }
             }
         });
     }
-    prepareColumns() {
-        this.visibleColumns = [{
-                field: 'ChangedAt',
-                title: 'Date',
-                type: 'datetime',
-                width: 175,
-            },
-            {
-                field: 'ChangesDescription',
-                title: 'Changes',
-                type: 'description',
-            }];
-    }
     closePropertiesDialog() {
         this.dialogClosed.emit();
     }
-    FormatColumnValue(col, value, dataItem, maxLength = 0, trailingChars = "...") {
-        if (value === null)
-            return null;
+    // Filter and search methods
+    onSearchChange() {
+        this.applyFilters();
+    }
+    onFilterChange() {
+        this.applyFilters();
+    }
+    applyFilters() {
+        let filtered = [...this.viewData];
+        // Apply search filter
+        if (this.searchTerm.trim()) {
+            const search = this.searchTerm.toLowerCase();
+            filtered = filtered.filter(change => {
+                var _a, _b, _c;
+                return ((_a = change.ChangesDescription) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(search)) ||
+                    ((_b = change.User) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(search)) ||
+                    ((_c = change.Comments) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes(search));
+            });
+        }
+        // Apply type filter
+        if (this.selectedType) {
+            filtered = filtered.filter(change => change.Type === this.selectedType);
+        }
+        // Apply source filter
+        if (this.selectedSource) {
+            filtered = filtered.filter(change => change.Source === this.selectedSource);
+        }
+        this.filteredData = filtered;
+    }
+    // Timeline interaction methods
+    toggleExpansion(changeId) {
+        if (this.expandedItems.has(changeId)) {
+            this.expandedItems.delete(changeId);
+        }
+        else {
+            this.expandedItems.add(changeId);
+        }
+    }
+    onTimelineItemKeydown(event, changeId) {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.toggleExpansion(changeId);
+        }
+    }
+    // Utility methods for timeline display
+    getChangeTypeClass(type) {
+        switch (type) {
+            case 'Create': return 'change-create';
+            case 'Update': return 'change-update';
+            case 'Delete': return 'change-delete';
+            default: return 'change-unknown';
+        }
+    }
+    getChangeTypeIcon(type) {
+        switch (type) {
+            case 'Create': return 'fa-solid fa-plus';
+            case 'Update': return 'fa-solid fa-edit';
+            case 'Delete': return 'fa-solid fa-trash';
+            default: return 'fa-solid fa-question';
+        }
+    }
+    getChangeTypeBadgeClass(type) {
+        switch (type) {
+            case 'Create': return 'badge-create';
+            case 'Update': return 'badge-update';
+            case 'Delete': return 'badge-delete';
+            default: return 'badge-unknown';
+        }
+    }
+    getSourceClass(source) {
+        return source === 'Internal' ? 'source-internal' : 'source-external';
+    }
+    getStatusClass(status) {
+        switch (status) {
+            case 'Complete': return 'status-complete';
+            case 'Pending': return 'status-pending';
+            case 'Error': return 'status-error';
+            default: return 'status-unknown';
+        }
+    }
+    getTimelineItemLabel(change) {
+        return `${change.Type} by ${change.User || 'Unknown User'} on ${this.formatFullDateTime(change.ChangedAt)}`;
+    }
+    formatRelativeTime(date) {
+        const now = new Date();
+        const diffMs = now.getTime() - new Date(date).getTime();
+        const diffMins = Math.floor(diffMs / 60000);
+        const diffHours = Math.floor(diffMins / 60);
+        const diffDays = Math.floor(diffHours / 24);
+        if (diffMins < 1)
+            return 'Just now';
+        if (diffMins < 60)
+            return `${diffMins} min${diffMins > 1 ? 's' : ''} ago`;
+        if (diffHours < 24)
+            return `${diffHours} hour${diffHours > 1 ? 's' : ''} ago`;
+        if (diffDays < 7)
+            return `${diffDays} day${diffDays > 1 ? 's' : ''} ago`;
+        return new Intl.DateTimeFormat('en-US', {
+            month: 'short',
+            day: 'numeric',
+            year: diffDays > 365 ? 'numeric' : undefined
+        }).format(new Date(date));
+    }
+    formatFullDateTime(date) {
+        return new Intl.DateTimeFormat('en-US', {
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric',
+            hour: 'numeric',
+            minute: 'numeric',
+            hour12: true,
+            timeZoneName: 'short'
+        }).format(new Date(date));
+    }
+    getChangeSummary(change) {
+        if (change.Type === 'Create') {
+            return 'Record was created';
+        }
+        if (change.Type === 'Delete') {
+            return 'Record was deleted';
+        }
         try {
-            switch (col.type.toLowerCase()) {
-                case 'datetime':
-                    let utcDate = new Date(value); // UTC date
-                    // Calculate the local timezone offset and adjust the date
-                    const localDate = new Date(utcDate.getTime() - utcDate.getTimezoneOffset() * 60000);
-                    return new Intl.DateTimeFormat('en-US', {
-                        year: 'numeric',
-                        month: 'short',
-                        day: 'numeric',
-                        hour: 'numeric',
-                        minute: 'numeric',
-                        hour12: true,
-                    }).format(localDate);
-                case 'int':
-                    return new Intl.NumberFormat(undefined, { minimumFractionDigits: 0, maximumFractionDigits: 0 }).format(value);
-                case 'description':
-                    // while the database stores a description, it is easier to use the ChangesJSON field to get the structured data and then generate our HTML
-                    const json = JSON.parse(dataItem.ChangesJSON);
-                    if (!json)
-                        return value;
-                    else {
-                        const fields = Object.keys(json); // each field that was changed is a key in the JSON object
-                        let formattedDescription = '<div>';
-                        for (let i = 0; i < fields.length; i++) {
-                            const changeInfo = json[fields[i]];
-                            const field = this.record.EntityInfo.Fields.find((f) => { var _a; return f.Name.trim().toLowerCase() === ((_a = changeInfo.field) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()); });
-                            let innerDescription = "";
-                            if (field) {
-                                // we have field metadata, so we can use that 
-                                if (field.TSType === EntityFieldTSType.Boolean) {
-                                    // for boolean fields, it is cleaner to just show new value, no need to show old value as it is always the opposite
-                                    innerDescription = `${this.fieldMarkup(field.DisplayNameOrName)} set to ${this.valueMarkup(changeInfo, false)}`;
-                                }
-                                else {
-                                    innerDescription = `${this.fieldMarkup(field.DisplayNameOrName)} changed from ${this.valueMarkup(changeInfo, true)} to ${this.valueMarkup(changeInfo, false)}`;
-                                }
-                            }
-                            else {
-                                // we don't have field metadata - this could happen if a field was removed or renamed after a record change was recorded in the database, so just use what we have
-                                innerDescription = `${this.fieldMarkup(changeInfo.field)} changed from ${this.valueMarkup(changeInfo, true)}} to ${this.valueMarkup(changeInfo, false)}`;
-                            }
-                            formattedDescription += `<div>${innerDescription}</div>`;
-                        }
-                        formattedDescription += '</div>';
-                        return this.sanitizer.bypassSecurityTrustHtml(formattedDescription);
-                    }
-                default:
-                    return value;
+            const changesJson = JSON.parse(change.ChangesJSON || '{}');
+            const fields = Object.keys(changesJson);
+            if (fields.length === 0)
+                return 'No field changes detected';
+            // Get field display names
+            const fieldNames = fields.map(fieldKey => {
+                const changeInfo = changesJson[fieldKey];
+                const field = this.record.EntityInfo.Fields.find((f) => { var _a; return f.Name.trim().toLowerCase() === ((_a = changeInfo.field) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()); });
+                return (field === null || field === void 0 ? void 0 : field.DisplayNameOrName) || changeInfo.field;
+            });
+            if (fieldNames.length === 1) {
+                return `${fieldNames[0]} changed`;
+            }
+            if (fieldNames.length === 2) {
+                return `${fieldNames[0]} and ${fieldNames[1]} changed`;
             }
+            if (fieldNames.length <= 4) {
+                const lastField = fieldNames.pop();
+                return `${fieldNames.join(', ')}, and ${lastField} changed`;
+            }
+            // For more than 4 fields, show first 3 and count
+            return `${fieldNames.slice(0, 3).join(', ')}, and ${fieldNames.length - 3} other field${fieldNames.length - 3 > 1 ? 's' : ''} changed`;
         }
-        catch (e) {
-            LogError(e);
-            return value;
+        catch (_a) {
+            return change.ChangesDescription || 'Changes made';
         }
     }
-    fieldMarkup(fieldName) {
-        return `<b>${fieldName}</b>`;
+    getFieldChanges(change) {
+        try {
+            const changesJson = JSON.parse(change.ChangesJSON || '{}');
+            const fields = Object.keys(changesJson);
+            return fields.map(fieldKey => {
+                var _a, _b;
+                const changeInfo = changesJson[fieldKey];
+                const field = this.record.EntityInfo.Fields.find((f) => { var _a; return f.Name.trim().toLowerCase() === ((_a = changeInfo.field) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()); });
+                const isBooleanField = (field === null || field === void 0 ? void 0 : field.TSType) === EntityFieldTSType.Boolean;
+                let diffHtml;
+                // Generate diff HTML for non-boolean text fields
+                if (!isBooleanField) {
+                    const oldStr = String((_a = changeInfo.oldValue) !== null && _a !== void 0 ? _a : '');
+                    const newStr = String((_b = changeInfo.newValue) !== null && _b !== void 0 ? _b : '');
+                    // Always show diff if values are different, even if one is empty
+                    if (oldStr !== newStr) {
+                        diffHtml = this.generateDiffHtml(oldStr, newStr);
+                    }
+                }
+                return {
+                    field: changeInfo.field,
+                    displayName: (field === null || field === void 0 ? void 0 : field.DisplayNameOrName) || changeInfo.field,
+                    oldValue: changeInfo.oldValue,
+                    newValue: changeInfo.newValue,
+                    isBooleanField,
+                    diffHtml
+                };
+            });
+        }
+        catch (_a) {
+            return [];
+        }
+    }
+    getCreatedFields(change) {
+        try {
+            if (!change.FullRecordJSON)
+                return [];
+            const record = JSON.parse(change.FullRecordJSON);
+            const fields = this.record.EntityInfo.Fields;
+            return fields
+                .filter((field) => record[field.Name] !== null && record[field.Name] !== undefined && record[field.Name] !== '')
+                .map((field) => ({
+                name: field.Name,
+                displayName: field.DisplayNameOrName,
+                value: record[field.Name]
+            }));
+        }
+        catch (_a) {
+            return [];
+        }
+    }
+    generateDiffHtml(oldValue, newValue) {
+        // Handle empty values
+        if (!oldValue && !newValue) {
+            return this.sanitizer.bypassSecurityTrustHtml('<div class="diff-container"><span class="diff-unchanged">(no change)</span></div>');
+        }
+        if (!oldValue) {
+            return this.sanitizer.bypassSecurityTrustHtml(`<div class="diff-container"><span class="diff-added">${this.escapeHtml(newValue)}</span></div>`);
+        }
+        if (!newValue) {
+            return this.sanitizer.bypassSecurityTrustHtml(`<div class="diff-container"><span class="diff-removed">${this.escapeHtml(oldValue)}</span></div>`);
+        }
+        // Decide between character and word diff based on content length and type
+        const useWordDiff = this.shouldUseWordDiff(oldValue, newValue);
+        const diffs = useWordDiff ? diffWords(oldValue, newValue) : diffChars(oldValue, newValue);
+        let html = '<div class="diff-container">';
+        diffs.forEach((part) => {
+            const escapedValue = this.escapeHtml(part.value);
+            if (part.added) {
+                html += `<span class="diff-added">${escapedValue}</span>`;
+            }
+            else if (part.removed) {
+                html += `<span class="diff-removed">${escapedValue}</span>`;
+            }
+            else {
+                html += `<span class="diff-unchanged">${escapedValue}</span>`;
+            }
+        });
+        html += '</div>';
+        return this.sanitizer.bypassSecurityTrustHtml(html);
+    }
+    shouldUseWordDiff(oldValue, newValue) {
+        // Use word diff for longer text with spaces (sentences/paragraphs)
+        // Use character diff for shorter text, codes, IDs, etc.
+        const hasMultipleWords = (text) => text.includes(' ') && text.split(' ').length > 3;
+        const isLongText = (text) => text.length > 50;
+        return (hasMultipleWords(oldValue) || hasMultipleWords(newValue)) &&
+            (isLongText(oldValue) || isLongText(newValue));
     }
-    valueMarkup(changeInfo, isOldValue) {
-        return `<span style="color: ${isOldValue ? 'darkgray' : 'blue'};">${isOldValue ? changeInfo.oldValue : changeInfo.newValue}</span>`;
+    escapeHtml(text) {
+        const div = document.createElement('div');
+        div.textContent = text;
+        return div.innerHTML;
     }
 }
-RecordChangesComponent.ɵfac = function RecordChangesComponent_Factory(t) { return new (t || RecordChangesComponent)(i0.ɵɵdirectiveInject(i1.DomSanitizer), i0.ɵɵdirectiveInject(i0.Renderer2)); };
+RecordChangesComponent.ɵfac = function RecordChangesComponent_Factory(t) { return new (t || RecordChangesComponent)(i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i1.MJNotificationService), i0.ɵɵdirectiveInject(i2.DomSanitizer)); };
 RecordChangesComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: RecordChangesComponent, selectors: [["mj-record-changes"]], viewQuery: function RecordChangesComponent_Query(rf, ctx) { if (rf & 1) {
         i0.ɵɵviewQuery(_c0, 7);
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.wrapper = _t.first);
-    } }, inputs: { record: "record" }, outputs: { dialogClosed: "dialogClosed" }, decls: 6, vars: 7, consts: [["recordChangesWrapper", ""], ["dialogContainer", ""], [1, "k-overlay"], ["title", "Record Changes", 1, "kendo-window-custom", 3, "close", "width", "height", "minHeight", "minWidth", "resizable"], ["type", "converging-spinner", 4, "ngIf"], ["class", "k-d-flex k-flex-col k-justify-content-between k-h-full", 4, "ngIf"], ["type", "converging-spinner"], [1, "k-d-flex", "k-flex-col", "k-justify-content-between", "k-h-full"], [1, "kendo-grid-container"], ["scrollable", "virtual", 3, "kendoGridBinding", "pageSize", "sortable", "sort", "loading", "resizable", "navigable"], [3, "field", "title", "width", "headerStyle", 4, "ngFor", "ngForOf"], [3, "field", "title", "width", "headerStyle"], ["kendoGridCellTemplate", ""], [3, "innerHTML"]], template: function RecordChangesComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { record: "record" }, outputs: { dialogClosed: "dialogClosed" }, decls: 6, vars: 9, consts: [["recordChangesWrapper", ""], ["dialogContainer", ""], [1, "k-overlay"], ["title", "Record Changes History", 1, "kendo-window-custom", 3, "close", "width", "height", "minHeight", "minWidth", "resizable", "top", "left"], ["type", "converging-spinner", 4, "ngIf"], [1, "record-changes-container"], ["type", "converging-spinner"], [1, "filter-panel"], [1, "filter-controls"], ["type", "text", "placeholder", "Search changes...", "aria-label", "Search record changes", 1, "search-input", 3, "ngModelChange", "input", "ngModel"], ["aria-label", "Filter by change type", 1, "filter-select", 3, "ngModelChange", "change", "ngModel"], ["value", ""], ["value", "Create"], ["value", "Update"], ["value", "Delete"], ["aria-label", "Filter by change source", 1, "filter-select", 3, "ngModelChange", "change", "ngModel"], ["value", "Internal"], ["value", "External"], [1, "filter-results"], [1, "timeline-container"], [1, "no-changes-message"], [1, "timeline"], [1, "fa-solid", "fa-info-circle"], [1, "fa-solid", "fa-search"], [1, "timeline-item", 3, "expanded"], [1, "timeline-item", 3, "click", "keydown"], [1, "timeline-marker"], [1, "timeline-icon"], [1, "timeline-line"], [1, "timeline-content"], [1, "change-header"], [1, "change-title"], [1, "change-type-badge"], [1, "change-user"], [1, "change-source"], [1, "change-meta"], [1, "change-time", 3, "title"], [1, "change-status"], [1, "change-integration"], [1, "change-summary"], [1, "change-details"], [1, "change-timestamp"], ["aria-hidden", "true", 1, "fa-solid", "fa-clock"], [1, "creation-details"], [1, "deletion-details"], [1, "update-details"], [1, "change-comments"], [1, "change-errors"], [1, "fa-solid", "fa-plus"], [1, "field-changes"], [1, "field-change", "created"], [1, "field-name"], [1, "field-value", "new-value"], [1, "fa-solid", "fa-trash"], [1, "deletion-note"], [1, "fa-solid", "fa-edit"], [1, "field-change"], [1, "boolean-change"], [1, "diff-view"], [1, "value-diff"], [1, "new-value"], [1, "diff-content", 3, "innerHTML"], [1, "old-value"], [1, "value-label"], [1, "value"], [1, "diff-arrow"], ["aria-hidden", "true", 1, "fa-solid", "fa-arrow-right"], [1, "fa-solid", "fa-comment"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "error-log"]], template: function RecordChangesComponent_Template(rf, ctx) { if (rf & 1) {
         const _r1 = i0.ɵɵgetCurrentView();
         i0.ɵɵelementStart(0, "div", null, 0);
         i0.ɵɵelement(2, "div", 2);
         i0.ɵɵelementStart(3, "kendo-window", 3);
         i0.ɵɵlistener("close", function RecordChangesComponent_Template_kendo_window_close_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.closePropertiesDialog()); });
-        i0.ɵɵtemplate(4, RecordChangesComponent_kendo_loader_4_Template, 1, 0, "kendo-loader", 4)(5, RecordChangesComponent_div_5_Template, 5, 8, "div", 5);
+        i0.ɵɵtemplate(4, RecordChangesComponent_kendo_loader_4_Template, 1, 0, "kendo-loader", 4)(5, RecordChangesComponent_Conditional_5_Template, 25, 6, "div", 5);
         i0.ɵɵelementEnd()();
     } if (rf & 2) {
         i0.ɵɵadvance(3);
-        i0.ɵɵproperty("width", 700)("height", 525)("minHeight", 300)("minWidth", 400)("resizable", true);
+        i0.ɵɵproperty("width", 800)("height", 650)("minHeight", 400)("minWidth", 600)("resizable", true)("top", 50)("left", 50);
         i0.ɵɵadvance();
         i0.ɵɵproperty("ngIf", ctx.showloader);
         i0.ɵɵadvance();
-        i0.ɵɵproperty("ngIf", !ctx.showloader);
-    } }, dependencies: [i2.NgForOf, i2.NgIf, i3.GridComponent, i3.DataBindingDirective, i3.ColumnComponent, i3.CellTemplateDirective, i4.WindowComponent, i5.LoaderComponent] });
+        i0.ɵɵconditional(!ctx.showloader ? 5 : -1);
+    } }, dependencies: [i3.NgIf, i4.NgSelectOption, i4.ɵNgSelectMultipleOption, i4.DefaultValueAccessor, i4.SelectControlValueAccessor, i4.NgControlStatus, i4.NgModel, i5.WindowComponent, i6.LoaderComponent], styles: ["/* Record Changes Timeline Styles */\n.record-changes-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  padding: 1rem;\n}\n\n/* Filter Panel */\n.filter-panel {\n  background: #f8f9fa;\n  border-radius: 8px;\n  padding: 1rem;\n  margin-bottom: 1rem;\n  border: 1px solid #e9ecef;\n}\n\n.filter-controls {\n  display: flex;\n  gap: 1rem;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-input {\n  flex: 1;\n  min-width: 200px;\n  padding: 0.5rem 1rem;\n  border: 1px solid #ced4da;\n  border-radius: 4px;\n  font-size: 0.9rem;\n}\n\n.search-input:focus {\n  outline: none;\n  border-color: #007bff;\n  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);\n}\n\n.filter-select {\n  padding: 0.5rem;\n  border: 1px solid #ced4da;\n  border-radius: 4px;\n  background: white;\n  font-size: 0.9rem;\n  min-width: 120px;\n}\n\n.filter-select:focus {\n  outline: none;\n  border-color: #007bff;\n  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);\n}\n\n.filter-results {\n  margin-top: 0.5rem;\n  font-size: 0.85rem;\n  color: #6c757d;\n  font-style: italic;\n}\n\n/* Timeline Container */\n.timeline-container {\n  flex: 1;\n  overflow-y: auto;\n  padding-right: 0.5rem;\n}\n\n.no-changes-message {\n  text-align: center;\n  padding: 3rem 1rem;\n  color: #6c757d;\n  font-size: 1.1rem;\n}\n\n.no-changes-message i {\n  display: block;\n  font-size: 2rem;\n  margin-bottom: 1rem;\n  color: #adb5bd;\n}\n\n/* Timeline */\n.timeline {\n  position: relative;\n  padding-left: 2rem;\n}\n\n.timeline-item {\n  position: relative;\n  margin-bottom: 1.5rem;\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.timeline-item:hover {\n  transform: translateX(2px);\n}\n\n.timeline-item:focus {\n  outline: 2px solid #007bff;\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n.timeline-item.expanded {\n  margin-bottom: 2rem;\n}\n\n/* Timeline Marker */\n.timeline-marker {\n  position: absolute;\n  left: -2rem;\n  top: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.timeline-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.9rem;\n  color: white;\n  box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n  z-index: 2;\n}\n\n.timeline-icon.change-create {\n  background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.timeline-icon.change-update {\n  background: linear-gradient(135deg, #007bff, #6f42c1);\n}\n\n.timeline-icon.change-delete {\n  background: linear-gradient(135deg, #dc3545, #fd7e14);\n}\n\n.timeline-icon.change-unknown {\n  background: linear-gradient(135deg, #6c757d, #adb5bd);\n}\n\n.timeline-line {\n  width: 2px;\n  height: 2rem;\n  background: #e9ecef;\n  margin-top: 0.5rem;\n}\n\n/* Timeline Content */\n.timeline-content {\n  background: white;\n  border: 1px solid #e9ecef;\n  border-radius: 8px;\n  padding: 1rem;\n  box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n  transition: box-shadow 0.2s ease;\n}\n\n.timeline-item:hover .timeline-content {\n  box-shadow: 0 4px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-item.expanded .timeline-content {\n  box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n}\n\n/* Change Header */\n.change-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 0.75rem;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n}\n\n.change-title {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  flex-wrap: wrap;\n}\n\n.change-type-badge {\n  font-size: 0.75rem;\n  font-weight: 600;\n  padding: 0.25rem 0.5rem;\n  border-radius: 12px;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.badge-create {\n  background: #d4edda;\n  color: #155724;\n}\n\n.badge-update {\n  background: #cce7ff;\n  color: #004085;\n}\n\n.badge-delete {\n  background: #f8d7da;\n  color: #721c24;\n}\n\n.badge-unknown {\n  background: #e2e3e5;\n  color: #383d41;\n}\n\n.change-user {\n  font-weight: 600;\n  color: #495057;\n}\n\n.change-source {\n  font-size: 0.8rem;\n  padding: 0.2rem 0.4rem;\n  border-radius: 8px;\n  font-weight: 500;\n}\n\n.source-internal {\n  background: #e7f3ff;\n  color: #0056b3;\n}\n\n.source-external {\n  background: #fff3cd;\n  color: #856404;\n}\n\n.change-meta {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  font-size: 0.85rem;\n  color: #6c757d;\n  flex-wrap: wrap;\n}\n\n.change-time {\n  font-weight: 500;\n}\n\n.change-status {\n  padding: 0.2rem 0.4rem;\n  border-radius: 8px;\n  font-size: 0.75rem;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-complete {\n  background: #d4edda;\n  color: #155724;\n}\n\n.status-pending {\n  background: #fff3cd;\n  color: #856404;\n}\n\n.status-error {\n  background: #f8d7da;\n  color: #721c24;\n}\n\n.status-unknown {\n  background: #e2e3e5;\n  color: #383d41;\n}\n\n.change-integration {\n  font-style: italic;\n  color: #495057;\n}\n\n/* Change Summary */\n.change-summary {\n  color: #6c757d;\n  font-size: 0.9rem;\n  line-height: 1.4;\n}\n\n/* Change Details */\n.change-details {\n  margin-top: 1rem;\n  padding-top: 1rem;\n  border-top: 1px solid #e9ecef;\n}\n\n.change-timestamp {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  margin-bottom: 1rem;\n  padding: 0.5rem;\n  background: #f8f9fa;\n  border-radius: 6px;\n  border-left: 4px solid #6c757d;\n  font-size: 0.9rem;\n  color: #495057;\n}\n\n.change-timestamp i {\n  color: #6c757d;\n}\n\n.change-details h4 {\n  font-size: 1rem;\n  margin-bottom: 1rem;\n  color: #495057;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.change-details h5 {\n  font-size: 0.9rem;\n  margin-bottom: 0.5rem;\n  color: #495057;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n/* Field Changes */\n.field-changes {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.field-change {\n  background: #f8f9fa;\n  border-radius: 6px;\n  padding: 0.75rem;\n  border-left: 4px solid #007bff;\n}\n\n.field-change.created {\n  border-left-color: #28a745;\n}\n\n.field-name {\n  font-weight: 600;\n  color: #495057;\n  margin-bottom: 0.5rem;\n  display: block;\n}\n\n.field-value {\n  font-family: 'Courier New', monospace;\n  font-size: 0.85rem;\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  background: white;\n  border: 1px solid #dee2e6;\n}\n\n.value-diff {\n  display: grid;\n  grid-template-columns: 1fr auto 1fr;\n  gap: 1rem;\n  align-items: center;\n}\n\n.old-value, .new-value {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n}\n\n.value-label {\n  font-size: 0.75rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: #6c757d;\n}\n\n.old-value .value {\n  color: #6c757d;\n  background: #f8f9fa;\n  text-decoration: line-through;\n}\n\n.new-value .value {\n  color: #155724;\n  background: #d4edda;\n  font-weight: 500;\n}\n\n.value {\n  font-family: 'Courier New', monospace;\n  font-size: 0.85rem;\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  border: 1px solid #dee2e6;\n  word-break: break-all;\n}\n\n.diff-arrow {\n  color: #007bff;\n  font-size: 1.2rem;\n}\n\n.boolean-change .new-value {\n  font-weight: 600;\n  color: #007bff;\n  font-size: 0.9rem;\n}\n\n/* Creation Details */\n.creation-details .field-change {\n  border-left-color: #28a745;\n}\n\n.creation-details .field-value {\n  color: #155724;\n  background: #d4edda;\n  font-weight: 500;\n}\n\n/* Deletion Details */\n.deletion-details {\n  text-align: center;\n  padding: 1rem;\n}\n\n.deletion-note {\n  color: #6c757d;\n  font-style: italic;\n  margin-bottom: 0;\n}\n\n/* Diff View Styles - Scoped to this component */\nmj-record-changes .diff-view,\n.record-changes-container .diff-view {\n  margin-top: 0.5rem !important;\n  border: 1px dashed #28a745;\n  border-radius: 4px;\n  padding: 0.25rem;\n}\n\nmj-record-changes .diff-content,\n.record-changes-container .diff-content {\n  background: #ffffff !important;\n  border: 2px solid #007bff !important;\n  border-radius: 6px;\n  padding: 0.75rem !important;\n  font-family: 'SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', monospace !important;\n  font-size: 0.85rem !important;\n  line-height: 1.45 !important;\n  overflow-x: auto;\n  min-height: 2rem;\n}\n\nmj-record-changes .diff-container,\n.record-changes-container .diff-container {\n  word-wrap: break-word;\n  white-space: pre-wrap;\n}\n\nmj-record-changes .diff-added,\n.record-changes-container .diff-added {\n  background-color: #d1f5d3 !important;\n  color: #22863a !important;\n  text-decoration: none !important;\n  border-radius: 3px;\n  padding: 2px 4px !important;\n  font-weight: 600 !important;\n  display: inline;\n  border: 1px solid #28a745;\n}\n\nmj-record-changes .diff-removed,\n.record-changes-container .diff-removed {\n  background-color: #ffeef0 !important;\n  color: #d73a49 !important;\n  text-decoration: line-through !important;\n  border-radius: 3px;\n  padding: 2px 4px !important;\n  font-weight: 600 !important;\n  display: inline;\n  border: 1px solid #dc3545;\n}\n\nmj-record-changes .diff-unchanged,\n.record-changes-container .diff-unchanged {\n  color: #24292e !important;\n  display: inline;\n}\n\n/* Enhanced diff styling for better readability */\nmj-record-changes .diff-added:not(:empty)::before,\n.record-changes-container .diff-added:not(:empty)::before {\n  content: '';\n  background: #28a745;\n  width: 3px;\n  height: 100%;\n  position: absolute;\n  left: -1px;\n  border-radius: 1px;\n}\n\nmj-record-changes .diff-removed:not(:empty)::before,\n.record-changes-container .diff-removed:not(:empty)::before {\n  content: '';\n  background: #dc3545;\n  width: 3px;\n  height: 100%;\n  position: absolute;\n  left: -1px;\n  border-radius: 1px;\n}\n\nmj-record-changes .diff-added, \nmj-record-changes .diff-removed,\n.record-changes-container .diff-added, \n.record-changes-container .diff-removed {\n  position: relative;\n  margin: 0 1px;\n  display: inline;\n}\n\n/* Hover effects for diff elements */\nmj-record-changes .diff-added:hover,\n.record-changes-container .diff-added:hover {\n  background-color: #c3f0c5 !important;\n  box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);\n}\n\nmj-record-changes .diff-removed:hover,\n.record-changes-container .diff-removed:hover {\n  background-color: #ffd6dd !important;\n  box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.15);\n}\n\n/* Multi-line diff styling */\nmj-record-changes .diff-content .diff-added,\nmj-record-changes .diff-content .diff-removed,\n.record-changes-container .diff-content .diff-added,\n.record-changes-container .diff-content .diff-removed {\n  padding: 1px 3px;\n  border-radius: 3px;\n}\n\nmj-record-changes .diff-content .diff-added + .diff-added,\nmj-record-changes .diff-content .diff-removed + .diff-removed,\n.record-changes-container .diff-content .diff-added + .diff-added,\n.record-changes-container .diff-content .diff-removed + .diff-removed {\n  margin-left: 0;\n}\n\n/* Word diff specific styling */\nmj-record-changes .diff-container.word-diff .diff-added,\nmj-record-changes .diff-container.word-diff .diff-removed,\n.record-changes-container .diff-container.word-diff .diff-added,\n.record-changes-container .diff-container.word-diff .diff-removed {\n  padding: 2px 4px;\n  margin: 0 1px;\n  border-radius: 4px;\n}\n\n/* Comments and Errors */\n.change-comments, .change-errors {\n  margin-top: 1rem;\n  padding: 0.75rem;\n  border-radius: 6px;\n}\n\n.change-comments {\n  background: #e7f3ff;\n  border-left: 4px solid #007bff;\n}\n\n.change-errors {\n  background: #f8d7da;\n  border-left: 4px solid #dc3545;\n}\n\n.error-log {\n  background: #ffffff;\n  padding: 0.5rem;\n  border-radius: 4px;\n  font-family: 'Courier New', monospace;\n  font-size: 0.8rem;\n  color: #721c24;\n  margin: 0;\n  white-space: pre-wrap;\n  overflow-x: auto;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n  .filter-controls {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  \n  .search-input, .filter-select {\n    width: 100%;\n  }\n  \n  .change-header {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n  \n  .change-meta {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 0.25rem;\n  }\n  \n  .value-diff {\n    grid-template-columns: 1fr;\n    gap: 0.5rem;\n  }\n  \n  .diff-arrow {\n    justify-self: center;\n    transform: rotate(90deg);\n  }\n  \n  .timeline {\n    padding-left: 1.5rem;\n  }\n  \n  .timeline-marker {\n    left: -1.5rem;\n  }\n  \n  .timeline-icon {\n    width: 2rem;\n    height: 2rem;\n    font-size: 0.8rem;\n  }\n  \n  /* Responsive diff view */\n  .diff-content {\n    font-size: 0.8rem;\n    padding: 0.5rem;\n  }\n  \n  .diff-added, .diff-removed {\n    padding: 1px 2px;\n  }\n}\n\n@media (max-width: 480px) {\n  .record-changes-container {\n    padding: 0.5rem;\n  }\n  \n  .timeline-content {\n    padding: 0.75rem;\n  }\n  \n  .field-change {\n    padding: 0.5rem;\n  }\n}"], encapsulation: 2 });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(RecordChangesComponent, [{
         type: Component,
-        args: [{ selector: 'mj-record-changes', template: "<div #recordChangesWrapper>\n    <div class=\"k-overlay\"></div>\n    <kendo-window \n        class=\"kendo-window-custom\"\n        [width]=\"700\"\n        [height]=\"525\"\n        [minHeight]=\"300\"\n        [minWidth]=\"400\"\n        [resizable]=\"true\"\n        title=\"Record Changes\"\n        (close)=\"closePropertiesDialog()\"\n    >\n        <kendo-loader *ngIf=\"showloader\" type=\"converging-spinner\" ></kendo-loader>\n        <div class=\"k-d-flex k-flex-col k-justify-content-between k-h-full\" #dialogContainer *ngIf=\"!showloader\">\n            <div class=\"kendo-grid-container\">\n                <kendo-grid \n                    [kendoGridBinding]=\"viewData\" \n                    scrollable=\"virtual\" \n                    [pageSize]=\"100\" \n                    [sortable]=\"true\"\n                    [sort]=\"sortSettings\" \n                    [loading]=\"showloader\" \n                    [resizable]=\"true\" \n                    [navigable]=\"true\"\n                >\n                    <kendo-grid-column \n                        *ngFor=\"let item of visibleColumns; let i = index\" \n                        field=\"{{item.field}}\"\n                        title=\"{{item.title}}\" \n                        [width]=\"item.width\"\n                        [headerStyle]=\"{ 'font-weight' : 'bold', 'background-color': '#a9c2af' }\"\n                    >\n                        <ng-template kendoGridCellTemplate let-dataItem>\n                            <span [innerHTML]=\"FormatColumnValue(item, dataItem[item.field], dataItem)\"></span>\n                        </ng-template>\n                    </kendo-grid-column>\n                </kendo-grid>\n            </div>\n        </div>\n    </kendo-window>\n</div>" }]
-    }], () => [{ type: i1.DomSanitizer }, { type: i0.Renderer2 }], { dialogClosed: [{
+        args: [{ selector: 'mj-record-changes', encapsulation: ViewEncapsulation.None, template: "<div #recordChangesWrapper>\n    <div class=\"k-overlay\"></div>\n    <kendo-window \n        class=\"kendo-window-custom\"\n        [width]=\"800\"\n        [height]=\"650\"\n        [minHeight]=\"400\"\n        [minWidth]=\"600\"\n        [resizable]=\"true\"\n        [top]=\"50\"\n        [left]=\"50\"\n        title=\"Record Changes History\"\n        (close)=\"closePropertiesDialog()\"\n    >\n        <kendo-loader *ngIf=\"showloader\" type=\"converging-spinner\"></kendo-loader>\n        @if (!showloader) {\n            <div class=\"record-changes-container\" #dialogContainer>\n                <!-- Filter Panel -->\n                <div class=\"filter-panel\">\n                    <div class=\"filter-controls\">\n                        <input \n                            type=\"text\" \n                            class=\"search-input\"\n                            placeholder=\"Search changes...\"\n                            [(ngModel)]=\"searchTerm\"\n                            (input)=\"onSearchChange()\"\n                            aria-label=\"Search record changes\"\n                        />\n                        <select \n                            class=\"filter-select\"\n                            [(ngModel)]=\"selectedType\"\n                            (change)=\"onFilterChange()\"\n                            aria-label=\"Filter by change type\"\n                        >\n                            <option value=\"\">All Changes</option>\n                            <option value=\"Create\">Created</option>\n                            <option value=\"Update\">Updated</option>\n                            <option value=\"Delete\">Deleted</option>\n                        </select>\n                        <select \n                            class=\"filter-select\"\n                            [(ngModel)]=\"selectedSource\"\n                            (change)=\"onFilterChange()\"\n                            aria-label=\"Filter by change source\"\n                        >\n                            <option value=\"\">All Sources</option>\n                            <option value=\"Internal\">Internal</option>\n                            <option value=\"External\">External</option>\n                        </select>\n                    </div>\n                    @if (filteredData.length !== viewData.length) {\n                        <div class=\"filter-results\">\n                            Showing {{ filteredData.length }} of {{ viewData.length }} changes\n                        </div>\n                    }\n                </div>\n\n                <!-- Timeline Container -->\n                <div class=\"timeline-container\" [attr.aria-label]=\"'Timeline of changes for ' + record.EntityInfo.Name + ' record'\">\n                    @if (filteredData.length === 0) {\n                        <div class=\"no-changes-message\">\n                            @if (viewData.length === 0) {\n                                <i class=\"fa-solid fa-info-circle\"></i>\n                                No changes found for this record.\n                            } @else {\n                                <i class=\"fa-solid fa-search\"></i>\n                                No changes match your current filters.\n                            }\n                        </div>\n                    } @else {\n                        <div class=\"timeline\">\n                            @for (change of filteredData; track change.ID; let i = $index) {\n                                <div \n                                    class=\"timeline-item\"\n                                    [class.expanded]=\"expandedItems.has(change.ID)\"\n                                    [attr.tabindex]=\"0\"\n                                    [attr.aria-expanded]=\"expandedItems.has(change.ID)\"\n                                    [attr.aria-label]=\"getTimelineItemLabel(change)\"\n                                    (click)=\"toggleExpansion(change.ID)\"\n                                    (keydown)=\"onTimelineItemKeydown($event, change.ID)\"\n                                >\n                                    <div class=\"timeline-marker\">\n                                        <div class=\"timeline-icon\" [class]=\"getChangeTypeClass(change.Type)\">\n                                            <i [class]=\"getChangeTypeIcon(change.Type)\" [attr.aria-hidden]=\"true\"></i>\n                                        </div>\n                                        @if (i < filteredData.length - 1) {\n                                            <div class=\"timeline-line\"></div>\n                                        }\n                                    </div>\n                                    \n                                    <div class=\"timeline-content\">\n                                        <div class=\"change-header\">\n                                            <div class=\"change-title\">\n                                                <span class=\"change-type-badge\" [class]=\"getChangeTypeBadgeClass(change.Type)\">\n                                                    {{ change.Type }}\n                                                </span>\n                                                <span class=\"change-user\">{{ change.User || 'Unknown User' }}</span>\n                                                <span class=\"change-source\" [class]=\"getSourceClass(change.Source)\">\n                                                    {{ change.Source }}\n                                                </span>\n                                            </div>\n                                            <div class=\"change-meta\">\n                                                <span class=\"change-time\" [title]=\"formatFullDateTime(change.ChangedAt)\">\n                                                    {{ formatRelativeTime(change.ChangedAt) }}\n                                                </span>\n                                                <span class=\"change-status\" [class]=\"getStatusClass(change.Status)\">\n                                                    {{ change.Status }}\n                                                </span>\n                                                @if (change.Integration) {\n                                                    <span class=\"change-integration\">\n                                                        via {{ change.Integration }}\n                                                    </span>\n                                                }\n                                            </div>\n                                        </div>\n                                        \n                                        @if (!expandedItems.has(change.ID)) {\n                                            <div class=\"change-summary\">\n                                                {{ getChangeSummary(change) }}\n                                            </div>\n                                        }\n                                        \n                                        @if (expandedItems.has(change.ID)) {\n                                            <div class=\"change-details\">\n                                                <div class=\"change-timestamp\">\n                                                    <i class=\"fa-solid fa-clock\" aria-hidden=\"true\"></i>\n                                                    <strong>{{ formatFullDateTime(change.ChangedAt) }}</strong>\n                                                </div>\n                                                @if (change.Type === 'Create') {\n                                                    <div class=\"creation-details\">\n                                                        <h4><i class=\"fa-solid fa-plus\"></i> Record Created</h4>\n                                                        @if (change.FullRecordJSON) {\n                                                            <div class=\"field-changes\">\n                                                                @for (field of getCreatedFields(change); track field.name) {\n                                                                    <div class=\"field-change created\">\n                                                                        <span class=\"field-name\">{{ field.displayName }}</span>\n                                                                        <span class=\"field-value new-value\">{{ field.value }}</span>\n                                                                    </div>\n                                                                }\n                                                            </div>\n                                                        }\n                                                    </div>\n                                                } @else if (change.Type === 'Delete') {\n                                                    <div class=\"deletion-details\">\n                                                        <h4><i class=\"fa-solid fa-trash\"></i> Record Deleted</h4>\n                                                        <p class=\"deletion-note\">This record was permanently removed from the system.</p>\n                                                    </div>\n                                                } @else {\n                                                    <div class=\"update-details\">\n                                                        <h4><i class=\"fa-solid fa-edit\"></i> Fields Changed</h4>\n                                                        <div class=\"field-changes\">\n                                                            @for (fieldChange of getFieldChanges(change); track fieldChange.field) {\n                                                                <div class=\"field-change\">\n                                                                    <div class=\"field-name\">{{ fieldChange.displayName }}</div>\n                                                                    @if (fieldChange.isBooleanField) {\n                                                                        <div class=\"boolean-change\">\n                                                                            <span class=\"new-value\">{{ fieldChange.newValue }}</span>\n                                                                        </div>\n                                                                    } @else if (fieldChange.diffHtml) {\n                                                                        <div class=\"diff-view\">\n                                                                            <div class=\"diff-content\" [innerHTML]=\"fieldChange.diffHtml\"></div>\n                                                                        </div>\n                                                                    } @else {\n                                                                        <div class=\"value-diff\">\n                                                                            <div class=\"old-value\">\n                                                                                <span class=\"value-label\">From:</span>\n                                                                                <span class=\"value\">{{ fieldChange.oldValue || '(empty)' }}</span>\n                                                                            </div>\n                                                                            <div class=\"diff-arrow\">\n                                                                                <i class=\"fa-solid fa-arrow-right\" aria-hidden=\"true\"></i>\n                                                                            </div>\n                                                                            <div class=\"new-value\">\n                                                                                <span class=\"value-label\">To:</span>\n                                                                                <span class=\"value\">{{ fieldChange.newValue || '(empty)' }}</span>\n                                                                            </div>\n                                                                        </div>\n                                                                    }\n                                                                </div>\n                                                            }\n                                                        </div>\n                                                    </div>\n                                                }\n                                                \n                                                @if (change.Comments) {\n                                                    <div class=\"change-comments\">\n                                                        <h5><i class=\"fa-solid fa-comment\"></i> Comments</h5>\n                                                        <p>{{ change.Comments }}</p>\n                                                    </div>\n                                                }\n                                                \n                                                @if (change.ErrorLog) {\n                                                    <div class=\"change-errors\">\n                                                        <h5><i class=\"fa-solid fa-exclamation-triangle\"></i> Errors</h5>\n                                                        <pre class=\"error-log\">{{ change.ErrorLog }}</pre>\n                                                    </div>\n                                                }\n                                            </div>\n                                        }\n                                    </div>\n                                </div>\n                            }\n                        </div>\n                    }\n                </div>\n            </div>\n        }\n    </kendo-window>\n</div>", styles: ["/* Record Changes Timeline Styles */\n.record-changes-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  padding: 1rem;\n}\n\n/* Filter Panel */\n.filter-panel {\n  background: #f8f9fa;\n  border-radius: 8px;\n  padding: 1rem;\n  margin-bottom: 1rem;\n  border: 1px solid #e9ecef;\n}\n\n.filter-controls {\n  display: flex;\n  gap: 1rem;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-input {\n  flex: 1;\n  min-width: 200px;\n  padding: 0.5rem 1rem;\n  border: 1px solid #ced4da;\n  border-radius: 4px;\n  font-size: 0.9rem;\n}\n\n.search-input:focus {\n  outline: none;\n  border-color: #007bff;\n  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);\n}\n\n.filter-select {\n  padding: 0.5rem;\n  border: 1px solid #ced4da;\n  border-radius: 4px;\n  background: white;\n  font-size: 0.9rem;\n  min-width: 120px;\n}\n\n.filter-select:focus {\n  outline: none;\n  border-color: #007bff;\n  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);\n}\n\n.filter-results {\n  margin-top: 0.5rem;\n  font-size: 0.85rem;\n  color: #6c757d;\n  font-style: italic;\n}\n\n/* Timeline Container */\n.timeline-container {\n  flex: 1;\n  overflow-y: auto;\n  padding-right: 0.5rem;\n}\n\n.no-changes-message {\n  text-align: center;\n  padding: 3rem 1rem;\n  color: #6c757d;\n  font-size: 1.1rem;\n}\n\n.no-changes-message i {\n  display: block;\n  font-size: 2rem;\n  margin-bottom: 1rem;\n  color: #adb5bd;\n}\n\n/* Timeline */\n.timeline {\n  position: relative;\n  padding-left: 2rem;\n}\n\n.timeline-item {\n  position: relative;\n  margin-bottom: 1.5rem;\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.timeline-item:hover {\n  transform: translateX(2px);\n}\n\n.timeline-item:focus {\n  outline: 2px solid #007bff;\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n.timeline-item.expanded {\n  margin-bottom: 2rem;\n}\n\n/* Timeline Marker */\n.timeline-marker {\n  position: absolute;\n  left: -2rem;\n  top: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n\n.timeline-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.9rem;\n  color: white;\n  box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n  z-index: 2;\n}\n\n.timeline-icon.change-create {\n  background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.timeline-icon.change-update {\n  background: linear-gradient(135deg, #007bff, #6f42c1);\n}\n\n.timeline-icon.change-delete {\n  background: linear-gradient(135deg, #dc3545, #fd7e14);\n}\n\n.timeline-icon.change-unknown {\n  background: linear-gradient(135deg, #6c757d, #adb5bd);\n}\n\n.timeline-line {\n  width: 2px;\n  height: 2rem;\n  background: #e9ecef;\n  margin-top: 0.5rem;\n}\n\n/* Timeline Content */\n.timeline-content {\n  background: white;\n  border: 1px solid #e9ecef;\n  border-radius: 8px;\n  padding: 1rem;\n  box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n  transition: box-shadow 0.2s ease;\n}\n\n.timeline-item:hover .timeline-content {\n  box-shadow: 0 4px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-item.expanded .timeline-content {\n  box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n}\n\n/* Change Header */\n.change-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 0.75rem;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n}\n\n.change-title {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  flex-wrap: wrap;\n}\n\n.change-type-badge {\n  font-size: 0.75rem;\n  font-weight: 600;\n  padding: 0.25rem 0.5rem;\n  border-radius: 12px;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n}\n\n.badge-create {\n  background: #d4edda;\n  color: #155724;\n}\n\n.badge-update {\n  background: #cce7ff;\n  color: #004085;\n}\n\n.badge-delete {\n  background: #f8d7da;\n  color: #721c24;\n}\n\n.badge-unknown {\n  background: #e2e3e5;\n  color: #383d41;\n}\n\n.change-user {\n  font-weight: 600;\n  color: #495057;\n}\n\n.change-source {\n  font-size: 0.8rem;\n  padding: 0.2rem 0.4rem;\n  border-radius: 8px;\n  font-weight: 500;\n}\n\n.source-internal {\n  background: #e7f3ff;\n  color: #0056b3;\n}\n\n.source-external {\n  background: #fff3cd;\n  color: #856404;\n}\n\n.change-meta {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  font-size: 0.85rem;\n  color: #6c757d;\n  flex-wrap: wrap;\n}\n\n.change-time {\n  font-weight: 500;\n}\n\n.change-status {\n  padding: 0.2rem 0.4rem;\n  border-radius: 8px;\n  font-size: 0.75rem;\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.status-complete {\n  background: #d4edda;\n  color: #155724;\n}\n\n.status-pending {\n  background: #fff3cd;\n  color: #856404;\n}\n\n.status-error {\n  background: #f8d7da;\n  color: #721c24;\n}\n\n.status-unknown {\n  background: #e2e3e5;\n  color: #383d41;\n}\n\n.change-integration {\n  font-style: italic;\n  color: #495057;\n}\n\n/* Change Summary */\n.change-summary {\n  color: #6c757d;\n  font-size: 0.9rem;\n  line-height: 1.4;\n}\n\n/* Change Details */\n.change-details {\n  margin-top: 1rem;\n  padding-top: 1rem;\n  border-top: 1px solid #e9ecef;\n}\n\n.change-timestamp {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  margin-bottom: 1rem;\n  padding: 0.5rem;\n  background: #f8f9fa;\n  border-radius: 6px;\n  border-left: 4px solid #6c757d;\n  font-size: 0.9rem;\n  color: #495057;\n}\n\n.change-timestamp i {\n  color: #6c757d;\n}\n\n.change-details h4 {\n  font-size: 1rem;\n  margin-bottom: 1rem;\n  color: #495057;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.change-details h5 {\n  font-size: 0.9rem;\n  margin-bottom: 0.5rem;\n  color: #495057;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n/* Field Changes */\n.field-changes {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.field-change {\n  background: #f8f9fa;\n  border-radius: 6px;\n  padding: 0.75rem;\n  border-left: 4px solid #007bff;\n}\n\n.field-change.created {\n  border-left-color: #28a745;\n}\n\n.field-name {\n  font-weight: 600;\n  color: #495057;\n  margin-bottom: 0.5rem;\n  display: block;\n}\n\n.field-value {\n  font-family: 'Courier New', monospace;\n  font-size: 0.85rem;\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  background: white;\n  border: 1px solid #dee2e6;\n}\n\n.value-diff {\n  display: grid;\n  grid-template-columns: 1fr auto 1fr;\n  gap: 1rem;\n  align-items: center;\n}\n\n.old-value, .new-value {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n}\n\n.value-label {\n  font-size: 0.75rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: #6c757d;\n}\n\n.old-value .value {\n  color: #6c757d;\n  background: #f8f9fa;\n  text-decoration: line-through;\n}\n\n.new-value .value {\n  color: #155724;\n  background: #d4edda;\n  font-weight: 500;\n}\n\n.value {\n  font-family: 'Courier New', monospace;\n  font-size: 0.85rem;\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  border: 1px solid #dee2e6;\n  word-break: break-all;\n}\n\n.diff-arrow {\n  color: #007bff;\n  font-size: 1.2rem;\n}\n\n.boolean-change .new-value {\n  font-weight: 600;\n  color: #007bff;\n  font-size: 0.9rem;\n}\n\n/* Creation Details */\n.creation-details .field-change {\n  border-left-color: #28a745;\n}\n\n.creation-details .field-value {\n  color: #155724;\n  background: #d4edda;\n  font-weight: 500;\n}\n\n/* Deletion Details */\n.deletion-details {\n  text-align: center;\n  padding: 1rem;\n}\n\n.deletion-note {\n  color: #6c757d;\n  font-style: italic;\n  margin-bottom: 0;\n}\n\n/* Diff View Styles - Scoped to this component */\nmj-record-changes .diff-view,\n.record-changes-container .diff-view {\n  margin-top: 0.5rem !important;\n  border: 1px dashed #28a745;\n  border-radius: 4px;\n  padding: 0.25rem;\n}\n\nmj-record-changes .diff-content,\n.record-changes-container .diff-content {\n  background: #ffffff !important;\n  border: 2px solid #007bff !important;\n  border-radius: 6px;\n  padding: 0.75rem !important;\n  font-family: 'SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', monospace !important;\n  font-size: 0.85rem !important;\n  line-height: 1.45 !important;\n  overflow-x: auto;\n  min-height: 2rem;\n}\n\nmj-record-changes .diff-container,\n.record-changes-container .diff-container {\n  word-wrap: break-word;\n  white-space: pre-wrap;\n}\n\nmj-record-changes .diff-added,\n.record-changes-container .diff-added {\n  background-color: #d1f5d3 !important;\n  color: #22863a !important;\n  text-decoration: none !important;\n  border-radius: 3px;\n  padding: 2px 4px !important;\n  font-weight: 600 !important;\n  display: inline;\n  border: 1px solid #28a745;\n}\n\nmj-record-changes .diff-removed,\n.record-changes-container .diff-removed {\n  background-color: #ffeef0 !important;\n  color: #d73a49 !important;\n  text-decoration: line-through !important;\n  border-radius: 3px;\n  padding: 2px 4px !important;\n  font-weight: 600 !important;\n  display: inline;\n  border: 1px solid #dc3545;\n}\n\nmj-record-changes .diff-unchanged,\n.record-changes-container .diff-unchanged {\n  color: #24292e !important;\n  display: inline;\n}\n\n/* Enhanced diff styling for better readability */\nmj-record-changes .diff-added:not(:empty)::before,\n.record-changes-container .diff-added:not(:empty)::before {\n  content: '';\n  background: #28a745;\n  width: 3px;\n  height: 100%;\n  position: absolute;\n  left: -1px;\n  border-radius: 1px;\n}\n\nmj-record-changes .diff-removed:not(:empty)::before,\n.record-changes-container .diff-removed:not(:empty)::before {\n  content: '';\n  background: #dc3545;\n  width: 3px;\n  height: 100%;\n  position: absolute;\n  left: -1px;\n  border-radius: 1px;\n}\n\nmj-record-changes .diff-added, \nmj-record-changes .diff-removed,\n.record-changes-container .diff-added, \n.record-changes-container .diff-removed {\n  position: relative;\n  margin: 0 1px;\n  display: inline;\n}\n\n/* Hover effects for diff elements */\nmj-record-changes .diff-added:hover,\n.record-changes-container .diff-added:hover {\n  background-color: #c3f0c5 !important;\n  box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);\n}\n\nmj-record-changes .diff-removed:hover,\n.record-changes-container .diff-removed:hover {\n  background-color: #ffd6dd !important;\n  box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.15);\n}\n\n/* Multi-line diff styling */\nmj-record-changes .diff-content .diff-added,\nmj-record-changes .diff-content .diff-removed,\n.record-changes-container .diff-content .diff-added,\n.record-changes-container .diff-content .diff-removed {\n  padding: 1px 3px;\n  border-radius: 3px;\n}\n\nmj-record-changes .diff-content .diff-added + .diff-added,\nmj-record-changes .diff-content .diff-removed + .diff-removed,\n.record-changes-container .diff-content .diff-added + .diff-added,\n.record-changes-container .diff-content .diff-removed + .diff-removed {\n  margin-left: 0;\n}\n\n/* Word diff specific styling */\nmj-record-changes .diff-container.word-diff .diff-added,\nmj-record-changes .diff-container.word-diff .diff-removed,\n.record-changes-container .diff-container.word-diff .diff-added,\n.record-changes-container .diff-container.word-diff .diff-removed {\n  padding: 2px 4px;\n  margin: 0 1px;\n  border-radius: 4px;\n}\n\n/* Comments and Errors */\n.change-comments, .change-errors {\n  margin-top: 1rem;\n  padding: 0.75rem;\n  border-radius: 6px;\n}\n\n.change-comments {\n  background: #e7f3ff;\n  border-left: 4px solid #007bff;\n}\n\n.change-errors {\n  background: #f8d7da;\n  border-left: 4px solid #dc3545;\n}\n\n.error-log {\n  background: #ffffff;\n  padding: 0.5rem;\n  border-radius: 4px;\n  font-family: 'Courier New', monospace;\n  font-size: 0.8rem;\n  color: #721c24;\n  margin: 0;\n  white-space: pre-wrap;\n  overflow-x: auto;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n  .filter-controls {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  \n  .search-input, .filter-select {\n    width: 100%;\n  }\n  \n  .change-header {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n  \n  .change-meta {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 0.25rem;\n  }\n  \n  .value-diff {\n    grid-template-columns: 1fr;\n    gap: 0.5rem;\n  }\n  \n  .diff-arrow {\n    justify-self: center;\n    transform: rotate(90deg);\n  }\n  \n  .timeline {\n    padding-left: 1.5rem;\n  }\n  \n  .timeline-marker {\n    left: -1.5rem;\n  }\n  \n  .timeline-icon {\n    width: 2rem;\n    height: 2rem;\n    font-size: 0.8rem;\n  }\n  \n  /* Responsive diff view */\n  .diff-content {\n    font-size: 0.8rem;\n    padding: 0.5rem;\n  }\n  \n  .diff-added, .diff-removed {\n    padding: 1px 2px;\n  }\n}\n\n@media (max-width: 480px) {\n  .record-changes-container {\n    padding: 0.5rem;\n  }\n  \n  .timeline-content {\n    padding: 0.75rem;\n  }\n  \n  .field-change {\n    padding: 0.5rem;\n  }\n}"] }]
+    }], () => [{ type: i0.Renderer2 }, { type: i1.MJNotificationService }, { type: i2.DomSanitizer }], { dialogClosed: [{
             type: Output
         }], record: [{
             type: Input
@@ -213,5 +693,5 @@ RecordChangesComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Reco
             type: ViewChild,
             args: ['recordChangesWrapper', { static: true }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(RecordChangesComponent, { className: "RecordChangesComponent", filePath: "src/lib/ng-record-changes.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(RecordChangesComponent, { className: "RecordChangesComponent", filePath: "src/lib/ng-record-changes.component.ts", lineNumber: 15 }); })();
 //# sourceMappingURL=ng-record-changes.component.js.map

package/dist/lib/ng-record-changes.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"ng-record-changes.component.js","sourceRoot":"","sources":["../../src/lib/ng-record-changes.component.ts","../../src/lib/ng-record-changes.component.html"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-record-changes.component.js","sourceRoot":"","sources":["../../src/lib/ng-record-changes.component.ts","../../src/lib/ng-record-changes.component.html"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,MAAM,EAAmD,SAAS,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAG9J,OAAO,EAA6C,iBAAiB,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAG9G,OAAO,EAAE,SAAS,EAAE,SAAS,EAAU,MAAM,MAAM,CAAC;;;;;;;;;;;;;ICQ5C,kCAA0E;;;IAqC1D,+BAA4B;IACxB,YACJ;IAAA,iBAAM;;;IADF,cACJ;IADI,2GACJ;;;IASQ,wBAAuC;IACvC,mDACJ;;;IACI,wBAAkC;IAClC,wDACJ;;;IAPJ,+BAAgC;IAI1B,AAHF,kGAA6B,qFAGpB;IAIb,iBAAM;;;IAPF,cAMC;IAND,sDAMC;;;IAmBe,0BAAiC;;;IAuBzB,gCAAiC;IAC7B,YACJ;IAAA,iBAAO;;;IADH,cACJ;IADI,0DACJ;;;IAMR,+BAA4B;IACxB,YACJ;IAAA,iBAAM;;;;IADF,cACJ;IADI,mEACJ;;;IAgB4B,AADJ,+BAAkC,eACL;IAAA,YAAuB;IAAA,iBAAO;IACvD,gCAAoC;IAAA,YAAiB;IACzD,AADyD,iBAAO,EAC1D;;;IAFuB,eAAuB;IAAvB,0CAAuB;IACZ,eAAiB;IAAjB,oCAAiB;;;IAJjE,+BAA2B;IACvB,wKAKC;IACL,iBAAM;;;;IANF,cAKC;IALD,cAAA,kCAAwB,CAKvB;;;IART,AADJ,+BAA8B,SACtB;IAAA,wBAAgC;IAAC,+BAAc;IAAA,iBAAK;IACxD,gJAA6B;IAUjC,iBAAM;;;IAVF,eASC;IATD,mDASC;;;IAID,AADJ,+BAA8B,SACtB;IAAA,wBAAiC;IAAC,+BAAc;IAAA,iBAAK;IACzD,6BAAyB;IAAA,oEAAoD;IACjF,AADiF,iBAAI,EAC/E;;;IAUkB,AADJ,+BAA4B,eACA;IAAA,YAA0B;IACtD,AADsD,iBAAO,EACvD;;;IADsB,eAA0B;IAA1B,6CAA0B;;;IAGtD,+BAAuB;IACnB,0BAAmE;IACvE,iBAAM;;;IADwB,cAAkC;IAAlC,sEAAkC;;;IAKxD,AADJ,AADJ,+BAAwB,cACG,eACO;IAAA,qBAAK;IAAA,iBAAO;IACtC,gCAAoB;IAAA,YAAuC;IAC/D,AAD+D,iBAAO,EAChE;IACN,+BAAwB;IACpB,wBAA0D;IAC9D,iBAAM;IAEF,AADJ,+BAAuB,eACO;IAAA,oBAAG;IAAA,iBAAO;IACpC,iCAAoB;IAAA,aAAuC;IAEnE,AADI,AAD+D,iBAAO,EAChE,EACJ;;;IATsB,eAAuC;IAAvC,0DAAuC;IAOvC,eAAuC;IAAvC,0DAAuC;;;IApBvE,AADJ,+BAA0B,cACE;IAAA,YAA6B;IAAA,iBAAM;IASzD,AAJA,AAJF,sJAAkC,yIAIC,0IAI1B;IAeb,iBAAM;;;IAxBsB,eAA6B;IAA7B,gDAA6B;IACrD,cAsBC;IAtBD,qFAsBC;;;IA3Bb,AADJ,+BAA4B,SACpB;IAAA,wBAAgC;IAAC,+BAAc;IAAA,iBAAK;IACxD,+BAA2B;IACvB,0JA2BC;IAET,AADI,iBAAM,EACJ;;;;IA7BE,eA2BC;IA3BD,cAAA,iCAAuB,CA2BtB;;;IAOL,AADJ,+BAA6B,SACrB;IAAA,wBAAmC;IAAC,yBAAQ;IAAA,iBAAK;IACrD,yBAAG;IAAA,YAAqB;IAC5B,AAD4B,iBAAI,EAC1B;;;IADC,eAAqB;IAArB,wCAAqB;;;IAMxB,AADJ,+BAA2B,SACnB;IAAA,wBAAgD;IAAC,uBAAM;IAAA,iBAAK;IAChE,+BAAuB;IAAA,YAAqB;IAChD,AADgD,iBAAM,EAChD;;;IADqB,eAAqB;IAArB,wCAAqB;;;IArEpD,AADJ,+BAA4B,cACM;IAC1B,wBAAoD;IACpD,8BAAQ;IAAA,YAA0C;IACtD,AADsD,iBAAS,EACzD;IA+DN,AAPA,AApCE,AALA,AAdF,kIAAgC,qHAcO,qHAK9B,qHAoCc,qHAOA;IAM3B,iBAAM;;;;IAtEU,eAA0C;IAA1C,oEAA0C;IAEtD,cAqDC;IArDD,uFAqDC;IAED,eAKC;IALD,6CAKC;IAED,cAKC;IALD,6CAKC;;;;IA3HjB,+BAQC;IADG,AADA,yOAAS,oCAA0B,KAAC,sOACzB,kDAAwC,KAAC;IAGhD,AADJ,+BAA6B,cAC4C;IACjE,oBAA0E;IAC9E,iBAAM;IACN,mHAAmC;IAGvC,iBAAM;IAKM,AADJ,AADJ,AADJ,+BAA8B,cACC,cACG,eACyD;IAC3E,YACJ;IAAA,iBAAO;IACP,iCAA0B;IAAA,aAAmC;IAAA,iBAAO;IACpE,iCAAoE;IAChE,aACJ;IACJ,AADI,iBAAO,EACL;IAEF,AADJ,gCAAyB,gBACoD;IACrE,aACJ;IAAA,iBAAO;IACP,iCAAoE;IAChE,aACJ;IAAA,iBAAO;IACP,sHAA0B;IAMlC,AADI,iBAAM,EACJ;IAQN,AANA,qHAAqC,yGAMD;IA6E5C,AADI,iBAAM,EACJ;;;;;IA7HF,kEAA+C;;IAQhB,eAAyC;IAAzC,wDAAyC;IAC7D,cAAwC;IAAxC,uDAAwC;;IAE/C,cAEC;IAFD,yEAEC;IAMuC,eAA8C;IAA9C,6DAA8C;IAC1E,cACJ;IADI,+CACJ;IAC0B,eAAmC;IAAnC,sDAAmC;IACjC,cAAuC;IAAvC,sDAAuC;IAC/D,cACJ;IADI,iDACJ;IAG0B,eAA8C;IAA9C,sEAA8C;IACpE,cACJ;IADI,+EACJ;IAC4B,cAAuC;IAAvC,sDAAuC;IAC/D,cACJ;IADI,iDACJ;IACA,cAIC;IAJD,iDAIC;IAIT,cAIC;IAJD,mEAIC;IAED,cA2EC;IA3ED,kEA2EC;;;IA/HjB,+BAAsB;IAClB,yHAiIC;IACL,iBAAM;;;IAlIF,cAiIC;IAjID,kCAiIC;;;;IApLL,AADJ,AADJ,AAFJ,iCAAuD,aAEzB,aACO,eAQvB;IAHE,kTAAwB;IACxB,yLAAS,uBAAgB,KAAC;IAL9B,iBAOE;IACF,kCAKC;IAHG,uTAA0B;IAC1B,4LAAU,uBAAgB,KAAC;IAG3B,kCAAiB;IAAA,2BAAW;IAAA,iBAAS;IACrC,kCAAuB;IAAA,uBAAO;IAAA,iBAAS;IACvC,mCAAuB;IAAA,wBAAO;IAAA,iBAAS;IACvC,mCAAuB;IAAA,wBAAO;IAClC,AADkC,iBAAS,EAClC;IACT,mCAKC;IAHG,4TAA4B;IAC5B,6LAAU,uBAAgB,KAAC;IAG3B,mCAAiB;IAAA,4BAAW;IAAA,iBAAS;IACrC,mCAAyB;IAAA,yBAAQ;IAAA,iBAAS;IAC1C,mCAAyB;IAAA,yBAAQ;IAEzC,AADI,AADqC,iBAAS,EACrC,EACP;IACN,gGAA+C;IAKnD,iBAAM;IAGN,gCAAoH;IAW9G,AAVF,gGAAiC,mFAUxB;IAuIjB,AADI,iBAAM,EACJ;;;IApLU,eAAwB;IAAxB,iDAAwB;IAMxB,cAA0B;IAA1B,mDAA0B;IAW1B,eAA4B;IAA5B,qDAA4B;IASpC,eAIC;IAJD,iFAIC;IAI2B,cAAmF;;IAC/G,cA+IC;IA/ID,4DA+IC;;AD5LrB,MAAM,OAAO,sBAAsB;IAwBjC,YAAoB,QAAmB,EAAU,qBAA4C,EAAU,SAAuB;QAA1G,aAAQ,GAAR,QAAQ,CAAW;QAAU,0BAAqB,GAArB,qBAAqB,CAAuB;QAAU,cAAS,GAAT,SAAS,CAAc;QAvBvH,eAAU,GAAY,KAAK,CAAC;QACzB,iBAAY,GAAG,IAAI,YAAY,EAAE,CAAC;QAK5C,aAAQ,GAAyB,EAAE,CAAC;QACpC,iBAAY,GAAyB,EAAE,CAAC;QACxC,kBAAa,GAAgB,IAAI,GAAG,EAAE,CAAC;QAEvC,oBAAoB;QACpB,eAAU,GAAW,EAAE,CAAC;QACxB,iBAAY,GAAW,EAAE,CAAC;QAC1B,mBAAc,GAAW,EAAE,CAAC;QAE5B,iBAAY,GAAqB;YAC/B;gBACE,KAAK,EAAE,WAAW;gBAClB,GAAG,EAAE,MAAM;aACZ;SACF,CAAC;IAGgI,CAAC;IAEnI,QAAQ;QACN,IAAG,IAAI,CAAC,MAAM,EAAC,CAAC;YACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAClF,CAAC;IACH,CAAC;IAED,eAAe;QACb,iEAAiE;QACjE,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa;YAC7D,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACzE,CAAC;IAED,WAAW;QACT,mEAAmE;QACnE,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,aAAa;YAC7D,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACzE,CAAC;IAEY,iBAAiB,CAAC,IAAkB,EAAE,OAAe,EAAE,UAAkB;;YACpF,IAAI,IAAI,IAAI,UAAU,EAAE,CAAC;gBACvB,MAAM,EAAE,GAAG,IAAI,QAAQ,EAAE,CAAC;gBAC1B,MAAM,OAAO,GAAG,MAAM,EAAE,CAAC,gBAAgB,CAAqB,UAAU,EAAE,IAAI,CAAC,CAAC;gBAChF,IAAG,OAAO,EAAC,CAAC;oBACV,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC;oBAC1G,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;oBACvC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;gBAC1B,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,qBAAqB,CAAC,wBAAwB,CAAC,oCAAoC,UAAU,qBAAqB,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC;oBACpJ,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;gBAC1B,CAAC;YACH,CAAC;QACH,CAAC;KAAA;IAED,qBAAqB;QACnB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAED,4BAA4B;IAC5B,cAAc;QACZ,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAEO,YAAY;QAClB,IAAI,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;QAElC,sBAAsB;QACtB,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,CAAC;YAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;YAC7C,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;;gBAClC,OAAA,CAAA,MAAA,MAAM,CAAC,kBAAkB,0CAAE,WAAW,GAAG,QAAQ,CAAC,MAAM,CAAC;qBACzD,MAAA,MAAM,CAAC,IAAI,0CAAE,WAAW,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAA;qBAC3C,MAAA,MAAM,CAAC,QAAQ,0CAAE,WAAW,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAA,CAAA;aAAA,CAChD,CAAC;QACJ,CAAC;QAED,oBAAoB;QACpB,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC;QAC1E,CAAC;QAED,sBAAsB;QACtB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc,CAAC,CAAC;QAC9E,CAAC;QAED,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IAC/B,CAAC;IAED,+BAA+B;IAC/B,eAAe,CAAC,QAAgB;QAC9B,IAAI,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YACrC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACtC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,qBAAqB,CAAC,KAAoB,EAAE,QAAgB;QAC1D,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YAC/C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QACjC,CAAC;IACH,CAAC;IAED,uCAAuC;IACvC,kBAAkB,CAAC,IAAY;QAC7B,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,QAAQ,CAAC,CAAC,OAAO,eAAe,CAAC;YACtC,KAAK,QAAQ,CAAC,CAAC,OAAO,eAAe,CAAC;YACtC,KAAK,QAAQ,CAAC,CAAC,OAAO,eAAe,CAAC;YACtC,OAAO,CAAC,CAAC,OAAO,gBAAgB,CAAC;QACnC,CAAC;IACH,CAAC;IAED,iBAAiB,CAAC,IAAY;QAC5B,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,QAAQ,CAAC,CAAC,OAAO,kBAAkB,CAAC;YACzC,KAAK,QAAQ,CAAC,CAAC,OAAO,kBAAkB,CAAC;YACzC,KAAK,QAAQ,CAAC,CAAC,OAAO,mBAAmB,CAAC;YAC1C,OAAO,CAAC,CAAC,OAAO,sBAAsB,CAAC;QACzC,CAAC;IACH,CAAC;IAED,uBAAuB,CAAC,IAAY;QAClC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,QAAQ,CAAC,CAAC,OAAO,cAAc,CAAC;YACrC,KAAK,QAAQ,CAAC,CAAC,OAAO,cAAc,CAAC;YACrC,KAAK,QAAQ,CAAC,CAAC,OAAO,cAAc,CAAC;YACrC,OAAO,CAAC,CAAC,OAAO,eAAe,CAAC;QAClC,CAAC;IACH,CAAC;IAED,cAAc,CAAC,MAAc;QAC3B,OAAO,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC;IACvE,CAAC;IAED,cAAc,CAAC,MAAc;QAC3B,QAAQ,MAAM,EAAE,CAAC;YACf,KAAK,UAAU,CAAC,CAAC,OAAO,iBAAiB,CAAC;YAC1C,KAAK,SAAS,CAAC,CAAC,OAAO,gBAAgB,CAAC;YACxC,KAAK,OAAO,CAAC,CAAC,OAAO,cAAc,CAAC;YACpC,OAAO,CAAC,CAAC,OAAO,gBAAgB,CAAC;QACnC,CAAC;IACH,CAAC;IAED,oBAAoB,CAAC,MAA0B;QAC7C,OAAO,GAAG,MAAM,CAAC,IAAI,OAAO,MAAM,CAAC,IAAI,IAAI,cAAc,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC;IAC9G,CAAC;IAED,kBAAkB,CAAC,IAAU;QAC3B,MAAM,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC;QACvB,MAAM,MAAM,GAAG,GAAG,CAAC,OAAO,EAAE,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;QACxD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC;QAC5C,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC;QAE5C,IAAI,QAAQ,GAAG,CAAC;YAAE,OAAO,UAAU,CAAC;QACpC,IAAI,QAAQ,GAAG,EAAE;YAAE,OAAO,GAAG,QAAQ,OAAO,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC;QAC1E,IAAI,SAAS,GAAG,EAAE;YAAE,OAAO,GAAG,SAAS,QAAQ,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC;QAC9E,IAAI,QAAQ,GAAG,CAAC;YAAE,OAAO,GAAG,QAAQ,OAAO,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC;QAEzE,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE;YACtC,KAAK,EAAE,OAAO;YACd,GAAG,EAAE,SAAS;YACd,IAAI,EAAE,QAAQ,GAAG,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;SAC7C,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IAC5B,CAAC;IAED,kBAAkB,CAAC,IAAU;QAC3B,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE;YACtC,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,MAAM;YACb,GAAG,EAAE,SAAS;YACd,IAAI,EAAE,SAAS;YACf,MAAM,EAAE,SAAS;YACjB,MAAM,EAAE,IAAI;YACZ,YAAY,EAAE,OAAO;SACtB,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IAC5B,CAAC;IAED,gBAAgB,CAAC,MAA0B;QACzC,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC7B,OAAO,oBAAoB,CAAC;QAC9B,CAAC;QACD,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC7B,OAAO,oBAAoB,CAAC;QAC9B,CAAC;QAED,IAAI,CAAC;YACH,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,IAAI,IAAI,CAAC,CAAC;YAC3D,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YACxC,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;gBAAE,OAAO,2BAA2B,CAAC;YAE5D,0BAA0B;YAC1B,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;gBACvC,MAAM,UAAU,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;gBACzC,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAkB,EAAE,EAAE,WACtE,OAAA,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,MAAK,MAAA,UAAU,CAAC,KAAK,0CAAE,IAAI,GAAG,WAAW,EAAE,CAAA,CAAA,EAAA,CACvE,CAAC;gBACF,OAAO,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,iBAAiB,KAAI,UAAU,CAAC,KAAK,CAAC;YACtD,CAAC,CAAC,CAAC;YAEH,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAC5B,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC;YACpC,CAAC;YACD,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAC5B,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC,QAAQ,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC;YACzD,CAAC;YACD,IAAI,UAAU,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;gBAC3B,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC;gBACnC,OAAO,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,SAAS,UAAU,CAAC;YAC9D,CAAC;YAED,iDAAiD;YACjD,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,UAAU,CAAC,MAAM,GAAG,CAAC,eAAe,UAAU,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;QACzI,CAAC;QAAC,WAAM,CAAC;YACP,OAAO,MAAM,CAAC,kBAAkB,IAAI,cAAc,CAAC;QACrD,CAAC;IACH,CAAC;IAED,eAAe,CAAC,MAA0B;QACxC,IAAI,CAAC;YACH,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,IAAI,IAAI,CAAC,CAAC;YAC3D,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YAExC,OAAO,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;;gBAC3B,MAAM,UAAU,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;gBACzC,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAkB,EAAE,EAAE,WACtE,OAAA,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,MAAK,MAAA,UAAU,CAAC,KAAK,0CAAE,IAAI,GAAG,WAAW,EAAE,CAAA,CAAA,EAAA,CACvE,CAAC;gBAEF,MAAM,cAAc,GAAG,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,MAAK,iBAAiB,CAAC,OAAO,CAAC;gBACnE,IAAI,QAA8B,CAAC;gBAEnC,iDAAiD;gBACjD,IAAI,CAAC,cAAc,EAAE,CAAC;oBACpB,MAAM,MAAM,GAAG,MAAM,CAAC,MAAA,UAAU,CAAC,QAAQ,mCAAI,EAAE,CAAC,CAAC;oBACjD,MAAM,MAAM,GAAG,MAAM,CAAC,MAAA,UAAU,CAAC,QAAQ,mCAAI,EAAE,CAAC,CAAC;oBAEjD,iEAAiE;oBACjE,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;wBACtB,QAAQ,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;oBACnD,CAAC;gBACH,CAAC;gBAED,OAAO;oBACL,KAAK,EAAE,UAAU,CAAC,KAAK;oBACvB,WAAW,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,iBAAiB,KAAI,UAAU,CAAC,KAAK;oBACzD,QAAQ,EAAE,UAAU,CAAC,QAAQ;oBAC7B,QAAQ,EAAE,UAAU,CAAC,QAAQ;oBAC7B,cAAc;oBACd,QAAQ;iBACT,CAAC;YACJ,CAAC,CAAC,CAAC;QACL,CAAC;QAAC,WAAM,CAAC;YACP,OAAO,EAAE,CAAC;QACZ,CAAC;IACH,CAAC;IAED,gBAAgB,CAAC,MAA0B;QACzC,IAAI,CAAC;YACH,IAAI,CAAC,MAAM,CAAC,cAAc;gBAAE,OAAO,EAAE,CAAC;YAEtC,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;YACjD,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC;YAE7C,OAAO,MAAM;iBACV,MAAM,CAAC,CAAC,KAAsB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,SAAS,IAAI,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;iBAChI,GAAG,CAAC,CAAC,KAAsB,EAAE,EAAE,CAAC,CAAC;gBAChC,IAAI,EAAE,KAAK,CAAC,IAAI;gBAChB,WAAW,EAAE,KAAK,CAAC,iBAAiB;gBACpC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;aAC1B,CAAC,CAAC,CAAC;QACR,CAAC;QAAC,WAAM,CAAC;YACP,OAAO,EAAE,CAAC;QACZ,CAAC;IACH,CAAC;IAEO,gBAAgB,CAAC,QAAgB,EAAE,QAAgB;QACzD,sBAAsB;QACtB,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,EAAE,CAAC;YAC3B,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,mFAAmF,CAAC,CAAC;QACrI,CAAC;QAED,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,wDAAwD,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QAClJ,CAAC;QAED,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,0DAA0D,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACpJ,CAAC;QAED,0EAA0E;QAC1E,MAAM,WAAW,GAAG,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAC/D,MAAM,KAAK,GAAG,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAE1F,IAAI,IAAI,GAAG,8BAA8B,CAAC;QAE1C,KAAK,CAAC,OAAO,CAAC,CAAC,IAAY,EAAE,EAAE;YAC7B,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACjD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,IAAI,IAAI,4BAA4B,YAAY,SAAS,CAAC;YAC5D,CAAC;iBAAM,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBACxB,IAAI,IAAI,8BAA8B,YAAY,SAAS,CAAC;YAC9D,CAAC;iBAAM,CAAC;gBACN,IAAI,IAAI,gCAAgC,YAAY,SAAS,CAAC;YAChE,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,IAAI,QAAQ,CAAC;QAEjB,OAAO,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,IAAI,CAAC,CAAC;IACtD,CAAC;IAEO,iBAAiB,CAAC,QAAgB,EAAE,QAAgB;QAC1D,mEAAmE;QACnE,wDAAwD;QACxD,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QAC5F,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC;QAEtD,OAAO,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YAC1D,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;IACxD,CAAC;IAEO,UAAU,CAAC,IAAY;QAC7B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1C,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC;QACvB,OAAO,GAAG,CAAC,SAAS,CAAC;IACvB,CAAC;;4FAnVU,sBAAsB;yEAAtB,sBAAsB;;;;;;;QCdnC,oCAA2B;QACvB,yBAA6B;QAC7B,uCAWC;QADG,+IAAS,2BAAuB,KAAC;QAGjC,AADA,yFAA2D,mEACxC;QAgM3B,AADI,iBAAe,EACb;;QA3ME,eAAa;QAMb,AADA,AADA,AADA,AADA,AADA,AADA,2BAAa,eACC,kBACG,iBACD,mBACE,WACR,YACC;QAII,cAAgB;QAAhB,qCAAgB;QAC/B,cA8LC;QA9LD,0CA8LC;;iFD/LI,sBAAsB;cANlC,SAAS;2BACE,mBAAmB,iBAGd,iBAAiB,CAAC,IAAI;yGAI3B,YAAY;kBAArB,MAAM;YACE,MAAM;kBAAd,KAAK;YAE+C,OAAO;kBAA3D,SAAS;mBAAC,sBAAsB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;kFALxC,sBAAsB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-record-changes",
-  "version": "2.41.0",
+  "version": "2.42.1",
   "description": "MemberJunction: Angular pop-up window and grid to show changes made to a specific individual record",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -27,10 +27,12 @@
     "@progress/kendo-angular-indicators": "16.2.0"
   },
   "dependencies": {
-    "@memberjunction/core": "2.41.0",
-    "@memberjunction/global": "2.41.0",
-    "@memberjunction/ng-compare-records": "2.41.0",
-    "@memberjunction/ng-container-directives": "2.41.0",
+    "@memberjunction/core": "2.42.1",
+    "@memberjunction/global": "2.42.1",
+    "@memberjunction/ng-compare-records": "2.42.1",
+    "@memberjunction/ng-container-directives": "2.42.1",
+    "@memberjunction/ng-notifications": "2.42.1",
+    "diff": "8.0.2",
     "tslib": "^2.3.0"
   },
   "sideEffects": false