@memberjunction/ng-list-detail-grid 1.4.1

package/dist/lib/ng-list-detail-grid.component.d.ts

@@ -0,0 +1,127 @@
+import { ElementRef, EventEmitter, OnInit, AfterViewInit, Renderer2 } from '@angular/core';
+import { FormBuilder, FormGroup } from '@angular/forms';
+import { Router } from '@angular/router';
+import { BaseEntity, RunViewParams, EntityFieldInfo, EntityInfo, CompositeKey } from '@memberjunction/core';
+import { ViewColumnInfo, UserViewEntityExtended } from '@memberjunction/core-entities';
+import { CellClickEvent, GridDataResult, PageChangeEvent, GridComponent, CellCloseEvent, ColumnReorderEvent, ColumnResizeArgs, SelectionEvent, SelectableSettings } from "@progress/kendo-angular-grid";
+import { ExcelExportComponent } from '@progress/kendo-angular-excel-export';
+import { CompareRecordsComponent } from '@memberjunction/ng-compare-records';
+import { TextAreaComponent } from '@progress/kendo-angular-inputs';
+import * as i0 from "@angular/core";
+export type GridRowClickedEvent = {
+    entityId: number;
+    entityName: string;
+    CompositeKey: CompositeKey;
+};
+export type GridRowEditedEvent = {
+    record: BaseEntity;
+    row: number;
+    saved: boolean;
+};
+export type GridPendingRecordItem = {
+    record: BaseEntity;
+    row: number;
+    dataItem: any;
+};
+export declare class ListDetailGridComponent implements OnInit, AfterViewInit {
+    private formBuilder;
+    private router;
+    private renderer;
+    title: string;
+    Params: RunViewParams | undefined;
+    BottomMargin: number;
+    InEditMode: boolean;
+    EditMode: "None" | "Save" | "Queue";
+    AutoNavigate: boolean;
+    rowClicked: EventEmitter<GridRowClickedEvent>;
+    rowEdited: EventEmitter<GridRowEditedEvent>;
+    kendoGridElement: GridComponent | null;
+    kendoGridElementRef: ElementRef | null;
+    kendoExcelExport: ExcelExportComponent | null;
+    recordCompareComponent: CompareRecordsComponent | null;
+    analysisQuestion: TextAreaComponent | null;
+    analysisResults: ElementRef | null;
+    private compareDialogContainer;
+    private _pendingRecords;
+    viewData: any[];
+    totalRowCount: number;
+    formattedData: {
+        [key: string]: any;
+    }[];
+    viewColumns: ViewColumnInfo[];
+    visibleColumns: ViewColumnInfo[];
+    sortSettings: any[];
+    entityRecord: BaseEntity | null;
+    skip: number;
+    pageSize: number;
+    isLoading: boolean;
+    gridView: GridDataResult;
+    gridHeight: number;
+    _viewEntity: UserViewEntityExtended | undefined;
+    _entityInfo: EntityInfo | undefined;
+    private _newGridState;
+    private editModeEnded;
+    recordsToCompare: any[];
+    compareMode: boolean;
+    mergeMode: boolean;
+    duplicateMode: boolean;
+    selectableSettings: SelectableSettings;
+    selectedKeys: any[];
+    isCompareDialogOpened: boolean;
+    isConfirmDialogOpen: boolean;
+    showRefreshButton: boolean;
+    viewExecutionTime: number;
+    get PendingRecords(): GridPendingRecordItem[];
+    get ViewID(): number;
+    protected StartEditMode(): void;
+    protected EndEditMode(): void;
+    EditingComplete(): Promise<boolean>;
+    IsDynamicView(): boolean;
+    pageChange(event: PageChangeEvent): void;
+    data: {
+        text: string;
+    }[];
+    private virtualLoadData;
+    constructor(formBuilder: FormBuilder, router: Router, renderer: Renderer2);
+    private _saveTimeout;
+    private SaveView;
+    private _viewDirty;
+    innerSaveView(): Promise<void>;
+    protected CreateSimpleNotification(message: string, style: "none" | "success" | "error" | "warning" | "info", duration: number): void;
+    columnReorder(args: ColumnReorderEvent): Promise<void>;
+    columnResize(args: ColumnResizeArgs[]): Promise<void>;
+    sortChanged(sort: any): Promise<void>;
+    cellClickHandler(args: CellClickEvent): Promise<void>;
+    createFormGroup(dataItem: any): FormGroup;
+    getEditor(ef: EntityFieldInfo): "boolean" | "text" | "numeric" | "date";
+    cellCloseHandler(args: CellCloseEvent): Promise<void>;
+    RevertPendingChanges(): void;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    private _movedToBody;
+    moveDialogToBody(): void;
+    private _deferLoadCount;
+    private _allowLoad;
+    get AllowLoad(): boolean;
+    set AllowLoad(value: boolean);
+    RefreshFromSavedParams(): Promise<void>;
+    Refresh(params: RunViewParams): Promise<void>;
+    GetColumnTitle(col: ViewColumnInfo): string;
+    GetColumnCellStyle(col: ViewColumnInfo): {
+        'text-align': string;
+        'vertical-align': string;
+    };
+    selectionChange(args: SelectionEvent): void;
+    enableMergeOrCompare(cancel: boolean | undefined, type: 'merge' | 'compare'): void;
+    enableCheckbox(cancel: boolean | undefined, type: 'merge' | 'compare' | 'duplicate' | ''): void;
+    closeConfirmMergeDialog(event: 'cancel' | 'yes' | 'no'): Promise<void>;
+    closeCompareDialog(event: 'close' | 'cancel' | 'merge' | 'duplicate'): Promise<void>;
+    findDuplicateRecords(): Promise<void>;
+    exportColumns: ViewColumnInfo[];
+    exportData: any[];
+    doExcelExport(): Promise<void>;
+    protected getExportData(): Promise<any[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ListDetailGridComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ListDetailGridComponent, "mj-list-detail-grid", never, { "Params": { "alias": "Params"; "required": false; }; "BottomMargin": { "alias": "BottomMargin"; "required": false; }; "InEditMode": { "alias": "InEditMode"; "required": false; }; "EditMode": { "alias": "EditMode"; "required": false; }; "AutoNavigate": { "alias": "AutoNavigate"; "required": false; }; "AllowLoad": { "alias": "AllowLoad"; "required": false; }; }, { "rowClicked": "rowClicked"; "rowEdited": "rowEdited"; }, never, never, false, never>;
+}
+//# sourceMappingURL=ng-list-detail-grid.component.d.ts.map

package/dist/lib/ng-list-detail-grid.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-list-detail-grid.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-list-detail-grid.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/ng-list-detail-grid.component.js

@@ -0,0 +1,950 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Component, ViewChild, ElementRef, Output, EventEmitter, Input } from '@angular/core';
+import { Metadata, RunView, EntityFieldTSType, LogError, CompositeKey, PotentialDuplicateRequest } from '@memberjunction/core';
+import { ViewInfo } from '@memberjunction/core-entities';
+import { GridComponent } from "@progress/kendo-angular-grid";
+import { Keys } from '@progress/kendo-angular-common';
+import { Subject } from 'rxjs';
+import { ExcelExportComponent } from '@progress/kendo-angular-excel-export';
+import { MJEventType, MJGlobal } from '@memberjunction/global';
+import { TextAreaComponent } from '@progress/kendo-angular-inputs';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "@angular/router";
+import * as i3 from "@angular/common";
+import * as i4 from "@progress/kendo-angular-grid";
+import * as i5 from "@progress/kendo-angular-excel-export";
+import * as i6 from "@progress/kendo-angular-buttons";
+import * as i7 from "@memberjunction/ng-container-directives";
+const _c0 = ["kendoGrid"];
+const _c1 = ["excelExport"];
+const _c2 = ["recordCompareRef"];
+const _c3 = ["analysisQuestion"];
+const _c4 = ["analysisResults"];
+const _c5 = ["compareDialogContainer"];
+function ListDetailGridComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 9);
+    i0.ɵɵlistener("click", function ListDetailGridComponent_ng_template_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r6 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r6.doExcelExport()); });
+    i0.ɵɵelement(1, "span", 10);
+    i0.ɵɵtext(2, " Export to Excel ");
+    i0.ɵɵelementEnd();
+} }
+const _c6 = () => ({ "text-align": "center", "vertical-align": "center" });
+const _c7 = () => ({ "font-weight": "bold", "background-color": "white" });
+function ListDetailGridComponent_kendo_grid_checkbox_column_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "kendo-grid-checkbox-column", 11);
+} if (rf & 2) {
+    i0.ɵɵstyleMap(i0.ɵɵpureFunction0(4, _c6));
+    i0.ɵɵproperty("width", 50)("headerStyle", i0.ɵɵpureFunction0(5, _c7));
+} }
+function ListDetailGridComponent_kendo_grid_column_5_1_ng_template_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+    i0.ɵɵpipe(1, "number");
+    i0.ɵɵpipe(2, "number");
+    i0.ɵɵelement(3, "br");
+    i0.ɵɵelementStart(4, "span", 15);
+    i0.ɵɵtext(5);
+    i0.ɵɵpipe(6, "number");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r10 = i0.ɵɵnextContext(3);
+    i0.ɵɵtextInterpolate2(" ", i0.ɵɵpipeBind1(1, 3, ctx_r10.viewData.length), "", ctx_r10.totalRowCount > ctx_r10.viewData.length ? " of " + i0.ɵɵpipeBind1(2, 5, ctx_r10.totalRowCount) : " rows", "");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind2(6, 7, ctx_r10.viewExecutionTime, "1.2-2"), " seconds");
+} }
+function ListDetailGridComponent_kendo_grid_column_5_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ListDetailGridComponent_kendo_grid_column_5_1_ng_template_0_Template, 7, 10, "ng-template", 14);
+} }
+function ListDetailGridComponent_kendo_grid_column_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "kendo-grid-column", 12);
+    i0.ɵɵtemplate(1, ListDetailGridComponent_kendo_grid_column_5_1_Template, 1, 0, null, 13);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const item_r8 = ctx.$implicit;
+    const ctx_r3 = i0.ɵɵnextContext();
+    i0.ɵɵstyleMap(ctx_r3.GetColumnCellStyle(item_r8));
+    i0.ɵɵproperty("field", item_r8.Name)("title", ctx_r3.GetColumnTitle(item_r8))("width", item_r8.width ? item_r8.width : 100)("editable", item_r8.EntityField.AllowUpdateAPI)("editor", ctx_r3.getEditor(item_r8.EntityField))("headerStyle", i0.ɵɵpureFunction0(9, _c7));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", item_r8 === ctx_r3.visibleColumns[0]);
+} }
+function ListDetailGridComponent_kendo_excelexport_column_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "kendo-excelexport-column", 16);
+} if (rf & 2) {
+    const exportCol_r11 = ctx.$implicit;
+    i0.ɵɵproperty("field", exportCol_r11.Name)("title", exportCol_r11.Name);
+} }
+export class ListDetailGridComponent {
+    get PendingRecords() {
+        return this._pendingRecords;
+    }
+    get ViewID() {
+        if (this.Params && this.Params.ViewID)
+            return this.Params.ViewID;
+        else
+            return 0;
+    }
+    StartEditMode() {
+        this.InEditMode = true;
+    }
+    EndEditMode() {
+        this.InEditMode = false;
+        this.editModeEnded.next();
+    }
+    EditingComplete() {
+        var _a, _b;
+        if (this.InEditMode) {
+            // tell our grid to close the cell that is currently being edited
+            (_a = this.kendoGridElement) === null || _a === void 0 ? void 0 : _a.closeCell();
+            (_b = this.kendoGridElement) === null || _b === void 0 ? void 0 : _b.closeRow(); // close the row too
+            // we need to wait for edit mode to end before we can return true
+            return new Promise((resolve, reject) => {
+                const subscription = this.editModeEnded.subscribe(() => {
+                    resolve(true);
+                    subscription.unsubscribe();
+                });
+            });
+        }
+        else
+            return Promise.resolve(true); // not in edit mode, so editing is complete!
+    }
+    IsDynamicView() {
+        return !this._viewEntity; // if we have a viewEntity it is a stored view
+    }
+    pageChange(event) {
+        this.skip = event.skip;
+        this.virtualLoadData();
+    }
+    virtualLoadData() {
+        // check to see if we have already formatted the slice of the data we need right now
+        // we are storing the formattted data in the formattedData array and it has same set
+        // of indexes as the viewData array (raw unformatted data). When we first get viewData
+        // from the server we create an array of the same length as viewData, but have nulls in all of the 
+        // indexes. As we format each row of viewData we store the formatted row in the same index
+        // in the formattedData array. So if we have already formatted the data we need for the current
+        // page, we just use that data, otherwise we format the data we need for the current page
+        try {
+            // check to see if we have already formatted the data we need for the current page
+            for (let i = this.skip; (i < (this.skip + this.pageSize)) && (i < this.viewData.length); i++) {
+                if (!this.formattedData[i]) {
+                    // we have not formatted this row yet, so format it
+                    const r = this.viewColumns.map((c) => {
+                        if (c && c.EntityField && this.viewData[i] && this.viewData[i][c.EntityField.Name]) {
+                            if (!c.hidden && c.EntityField.Name !== 'ID') {
+                                const ef = c.EntityField;
+                                let formattedValue = null;
+                                if (c.EntityField.TSType === EntityFieldTSType.Boolean) {
+                                    formattedValue = this.viewData[i][c.EntityField.Name] ? '✓' : ''; // show a check mark if true, nothing if false
+                                }
+                                else {
+                                    formattedValue = ef.FormatValue(this.viewData[i][c.EntityField.Name], 0, undefined, 300);
+                                }
+                                return { field: c.EntityField.Name, value: formattedValue };
+                            }
+                            else
+                                return { field: c.EntityField.Name, value: this.viewData[i][c.EntityField.Name] }; // hidden column, so just return the value, don't bother formatting
+                        }
+                        else
+                            return { field: c.Name, value: null };
+                    });
+                    // now r is an array of {field: string, value: any} objects, so we need to convert it to an object
+                    // with the field names as the keys and the values as the values
+                    const row = {};
+                    for (let j = 0; j < r.length; j++) {
+                        if (r[j] && r[j].field && r[j].field.length > 0)
+                            row[r[j].field] = r[j].value;
+                    }
+                    this.formattedData[i] = row;
+                }
+            }
+            // now that we have made sure current page of data is formatted, we can return it
+            this.gridView = {
+                data: this.formattedData.slice(this.skip, this.skip + this.pageSize),
+                total: this.viewData.length,
+            };
+        }
+        catch (e) {
+            LogError(e);
+        }
+    }
+    constructor(formBuilder, router, renderer) {
+        this.formBuilder = formBuilder;
+        this.router = router;
+        this.renderer = renderer;
+        this.title = 'ListDetailGrid';
+        this.BottomMargin = 0;
+        this.InEditMode = false;
+        this.EditMode = "None";
+        this.AutoNavigate = true;
+        this.rowClicked = new EventEmitter();
+        this.rowEdited = new EventEmitter();
+        this.kendoGridElement = null;
+        this.kendoGridElementRef = null;
+        this.kendoExcelExport = null;
+        this.recordCompareComponent = null;
+        this.analysisQuestion = null;
+        this.analysisResults = null;
+        this._pendingRecords = [];
+        this.viewData = [];
+        this.totalRowCount = 0;
+        this.formattedData = [];
+        this.viewColumns = [];
+        this.visibleColumns = [];
+        this.sortSettings = [];
+        this.entityRecord = null;
+        this.skip = 0;
+        this.pageSize = 40;
+        this.isLoading = false;
+        this.gridView = { data: [], total: 0 };
+        this.gridHeight = 750;
+        this._newGridState = {};
+        this.editModeEnded = new Subject();
+        this.recordsToCompare = [];
+        this.compareMode = false;
+        this.mergeMode = false;
+        this.duplicateMode = false;
+        this.selectableSettings = {
+            enabled: false
+        };
+        this.selectedKeys = [];
+        this.isCompareDialogOpened = false;
+        this.isConfirmDialogOpen = false;
+        this.showRefreshButton = true;
+        this.viewExecutionTime = 0;
+        this.data = [
+            { text: "Folder" },
+            { text: "Report with Skip" },
+        ];
+        this._viewDirty = false;
+        this._movedToBody = false;
+        this._deferLoadCount = 0;
+        this._allowLoad = true;
+        // Export Functionality
+        this.exportColumns = [];
+        this.exportData = [];
+    }
+    SaveView() {
+        // debounced outer function...
+        clearTimeout(this._saveTimeout);
+        this._saveTimeout = setTimeout(() => __awaiter(this, void 0, void 0, function* () {
+            // when we actually call inner save view we do await
+            yield this.innerSaveView();
+        }), 5000); // 5 seconds delay
+    }
+    ;
+    innerSaveView() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this._viewDirty) {
+                const md = new Metadata();
+                if (this._viewEntity &&
+                    this._viewEntity.Get('UserID') === md.CurrentUser.ID) {
+                    // this view is a saved view, AND it belongs to the current user
+                    // update the grid state if we have settings updates for columns and/or sorts
+                    const tempGridState = JSON.parse(this._viewEntity.Get('GridState'));
+                    const tempColSettings = this._newGridState.columnSettings ? this._newGridState.columnSettings : tempGridState.columnSettings;
+                    tempColSettings.forEach((col) => { col.DisplayName, col.ID, col.Name, col.hidden, col.orderIndex, col.width; }); // remove EntityFieldInfo from the column settings
+                    tempGridState.columnSettings = tempColSettings;
+                    tempGridState.sortSettings = this._newGridState.sortSettings ? this._newGridState.sortSettings : tempGridState.sortSettings;
+                    // now stringify the grid state and save it
+                    this._viewEntity.Set('GridState', JSON.stringify(tempGridState));
+                    const newSortState = tempGridState.sortSettings.map((s) => { return { field: s.field, direction: s.dir }; });
+                    const oldSortState = JSON.parse(this._viewEntity.Get('SortState'));
+                    this._viewEntity.Set('SortState', JSON.stringify(newSortState));
+                    if (yield this._viewEntity.Save()) {
+                        // check to see if sort state changed and if so, refresh the grid
+                        if (JSON.stringify(newSortState) !== JSON.stringify(oldSortState)) {
+                            if (this.Params) // makes sure we have params before we refresh
+                                this.Refresh(this.Params);
+                        }
+                        this._viewDirty = false;
+                    }
+                    else {
+                        this.CreateSimpleNotification('Unable to save view settings', 'error', 5000);
+                    }
+                }
+            }
+        });
+    }
+    CreateSimpleNotification(message, style, duration) {
+        const data = {
+            message: message,
+            style: style,
+            DisplayDuration: duration
+        };
+        MJGlobal.Instance.RaiseEvent({
+            component: this,
+            event: MJEventType.DisplaySimpleNotificationRequest,
+            eventCode: "",
+            args: data
+        });
+    }
+    columnReorder(args) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Remove the column from the original position
+            // need to find the column in the viewColumns array because args.old/new Indexes are from the visibleColumns array
+            const fieldName = args.column.field;
+            if (fieldName) {
+                const vcOldIndex = this.viewColumns.findIndex((vc) => vc.Name === fieldName);
+                const vcNewIndex = this.viewColumns.findIndex((vc) => vc.orderIndex === args.newIndex);
+                if (vcOldIndex >= 0) {
+                    // got the index, now remove the element
+                    const element = this.viewColumns.splice(vcOldIndex, 1)[0];
+                    // Insert it at the new position
+                    this.viewColumns.splice(vcNewIndex, 0, element);
+                    // go through all of the columns and set orderIndex as that isn't done automatically
+                    let visColIndex = 0;
+                    for (let i = 0; i < this.viewColumns.length; i++) {
+                        if (!this.viewColumns[i].hidden) {
+                            this.viewColumns[i].orderIndex = visColIndex;
+                            visColIndex++;
+                        }
+                    }
+                    // now loop through all of the HIDDEN columns and set their orderIndex, done in second loop because we want first loop to give us total number of visible columns
+                    for (let i = 0; i < this.viewColumns.length; i++) {
+                        if (this.viewColumns[i].hidden) {
+                            this.viewColumns[i].orderIndex = visColIndex;
+                            visColIndex++;
+                        }
+                    }
+                    // make sure that _newGridState.columnSettings is set
+                    this._newGridState.columnSettings = this.viewColumns;
+                    this._viewDirty = true;
+                    this.SaveView();
+                }
+            }
+        });
+    }
+    columnResize(args) {
+        return __awaiter(this, void 0, void 0, function* () {
+            for (const col of args) {
+                const c = col.column;
+                const viewCol = this.viewColumns.find(vc => vc.Name === c.field);
+                const visCol = this.visibleColumns.find(vc => vc.Name === c.field);
+                const visCols = this.visibleColumns;
+                if (viewCol)
+                    viewCol.width = col.newWidth;
+            }
+            this._newGridState.columnSettings = this.viewColumns.map(vc => {
+                return {
+                    Name: vc.Name,
+                    DisplayName: vc.DisplayName,
+                    width: vc.width,
+                    orderIndex: vc.orderIndex,
+                    hidden: vc.hidden
+                };
+            });
+            this._viewDirty = true;
+            this.SaveView();
+        });
+    }
+    sortChanged(sort) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (sort && sort.length > 0) {
+                // remove any sort settings that don't have a direction
+                const filterSort = sort.filter((s) => s.dir !== undefined && s.dir !== null && s.dir !== "");
+                this._newGridState.sortSettings = filterSort;
+            }
+            else
+                this._newGridState.sortSettings = sort;
+            this.sortSettings = this._newGridState.sortSettings; // for the UI display - grid binding to this shows that the sort is applied via arrows in the column headers
+            if (this.IsDynamicView()) {
+                // Dynamic View, we have this.Params and can add an OrderBy and then just Refresh() the entire component
+                // that will result in going to the server for a refreshed set of data
+                if (this.Params) {
+                    this.Params.OrderBy = sort[0].field + ' ' + (sort[0].dir);
+                    this.Refresh(this.Params);
+                }
+                else {
+                    LogError("sortChanged() called but this.Params is null or undefined"); // should never get here
+                }
+            }
+            else {
+                // Saved view - we do this on the server side only
+                this._viewDirty = true;
+                this.innerSaveView(); // for sort changes we call innerSaveView() directly, not through SaveView() which is debounced  
+            }
+        });
+    }
+    cellClickHandler(args) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.compareMode || this.mergeMode)
+                return;
+            if (this._entityInfo) {
+                const compositeKey = new CompositeKey();
+                compositeKey.LoadFromEntityInfoAndRecord(this._entityInfo, this.viewData[args.rowIndex]);
+                this.rowClicked.emit({
+                    entityId: this._entityInfo.ID,
+                    entityName: this._entityInfo.Name,
+                    CompositeKey: compositeKey
+                });
+                if (this._entityInfo.AllowUpdateAPI &&
+                    this.EditMode !== "None") {
+                    const perm = this._entityInfo.GetUserPermisions(new Metadata().CurrentUser);
+                    if (perm.CanUpdate) {
+                        this.StartEditMode();
+                        args.sender.editCell(args.rowIndex, args.columnIndex, this.createFormGroup(args.dataItem));
+                    }
+                }
+                if (this.EditMode === 'None' && this.AutoNavigate) {
+                    // tell app router to go to this record
+                    this.router.navigate(['resource', 'record', compositeKey.ToURLSegment()], { queryParams: { Entity: this._entityInfo.Name } });
+                }
+            }
+        });
+    }
+    createFormGroup(dataItem) {
+        const groupFields = {};
+        this.viewColumns.forEach((vc) => {
+            if (vc.EntityField.AllowUpdateAPI &&
+                vc.EntityField.IsVirtual === false &&
+                vc.EntityField.AllowUpdateInView)
+                groupFields[vc.Name] = dataItem[vc.Name];
+        });
+        return this.formBuilder.group(groupFields);
+    }
+    getEditor(ef) {
+        switch (ef.TSType) {
+            case EntityFieldTSType.Boolean:
+                return "boolean";
+            case EntityFieldTSType.Date:
+                return "date";
+            case EntityFieldTSType.Number:
+                return "numeric";
+            default:
+                return "text";
+        }
+    }
+    cellCloseHandler(args) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                if (this._entityInfo && this.EditMode !== "None") {
+                    const { formGroup, dataItem, column } = args;
+                    if (!formGroup.valid) {
+                        // prevent closing the edited cell if there are invalid values.
+                        args.preventDefault();
+                    }
+                    else if (formGroup.dirty) {
+                        if (args.originalEvent && args.originalEvent.keyCode === Keys.Escape)
+                            return; // user hit escape, so don't save their changes
+                        // update the data item with the new values - this drives UI refresh while we save the record...
+                        Object.assign(dataItem, formGroup.value);
+                        const md = new Metadata();
+                        // JONATHAN - TO DO
+                        // @JS-BC - PLEASE FIX
+                        alert('Jonathan fix this code where pkey and below are using a SINGLE valued primary key, must support multi-valued keys everywhere - COMMENTED OUT BROKEN STUFF FOR YOU TO FIX');
+                        //          const pkey = this._entityInfo.PrimaryKey.Name;
+                        let record;
+                        let bSaved = false;
+                        if (this.EditMode === "Save") {
+                            let compositeKey = new CompositeKey();
+                            compositeKey.LoadFromEntityInfoAndRecord(this._entityInfo, dataItem);
+                            record = yield md.GetEntityObject(this._entityInfo.Name);
+                            yield record.InnerLoad(compositeKey);
+                            record.SetMany(formGroup.value);
+                            bSaved = yield record.Save();
+                            // if (!bSaved)
+                            //   this.CreateSimpleNotification("Error saving record: " + record.Get(pkey), 'error', 5000)
+                        }
+                        else {
+                            // JONATHAN - FIX THIS HERE TOO - SAME ISSUE AS ABOVE
+                            // record = this._pendingRecords.find((r: GridPendingRecordItem) => r.record.Get(pkey) === dataItem[pkey])?.record;
+                            if (!record) { // haven't edited this one before 
+                                record = yield md.GetEntityObject(this._viewEntity.Get('Entity'));
+                                let compositeKey = new CompositeKey();
+                                compositeKey.LoadFromEntityInfoAndRecord(this._entityInfo, dataItem);
+                                yield record.InnerLoad(compositeKey);
+                                this._pendingRecords.push({ record,
+                                    row: args.rowIndex,
+                                    dataItem }); // don't save - put the changed record on a queue for saving later by our container
+                            }
+                            // now, based on the column that we're in, update the record with the new value
+                            record.Set(column.field, formGroup.value[column.field]);
+                            // if a boolean value, modify what is in the grid so it is formatted properly
+                            if (column.field && column.field.length > 0) {
+                                const ef = this._entityInfo.Fields.find(f => f.Name === column.field);
+                                if (ef && ef.TSType === EntityFieldTSType.Boolean) {
+                                    dataItem[column.field] = record.Get(column.field) ? '✓' : '';
+                                }
+                            }
+                        }
+                        this.rowEdited.emit({
+                            record: record,
+                            row: args.rowIndex,
+                            saved: bSaved
+                        });
+                    }
+                }
+            }
+            catch (e) {
+                console.error(e);
+            }
+            finally {
+                this.EndEditMode();
+            }
+        });
+    }
+    // this handles reverting pending cahnges to records WITHIN the grid, not the user view settings, unrelated to that.
+    RevertPendingChanges() {
+        if (this._pendingRecords && this._pendingRecords.length > 0) {
+            this._pendingRecords.forEach((r) => {
+                r.record.Revert();
+                Object.assign(r.dataItem, r.record.GetAll()); // copy the original values back to the data Item which gets the grid to display the old values again...
+            });
+            this._pendingRecords = [];
+            if (this.Params)
+                this.Refresh(this.Params);
+        }
+    }
+    ngOnInit() {
+    }
+    ngAfterViewInit() {
+        //this.setGridHeight();
+        if (this.Params)
+            this.Refresh(this.Params);
+    }
+    moveDialogToBody() {
+        if (this._movedToBody)
+            return;
+        const dialogElement = this.compareDialogContainer.nativeElement;
+        this.renderer.appendChild(document.body, dialogElement);
+        this._movedToBody = true;
+    }
+    get AllowLoad() {
+        return this._allowLoad;
+    }
+    set AllowLoad(value) {
+        this._allowLoad = value;
+        if (value === true && this._deferLoadCount === 0) {
+            this._deferLoadCount++; // only do this one time 
+            if (this.Params)
+                this.Refresh(this.Params);
+            return;
+        }
+    }
+    RefreshFromSavedParams() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.Params)
+                this.Refresh(this.Params);
+        });
+    }
+    Refresh(params) {
+        var _a, _b, _c;
+        return __awaiter(this, void 0, void 0, function* () {
+            this.Params = params;
+            if (this.AllowLoad === false) {
+                return;
+            }
+            if (params && (params.ViewEntity || params.ViewID || params.ViewName || (params.EntityName && params.ExtraFilter))) {
+                const startTime = new Date().getTime();
+                this.isLoading = true;
+                const md = new Metadata();
+                const rv = new RunView();
+                // get the view entity first so we can pass it in, otherwise it will end up getting loaded inside of RunView() which is inefficient as we need it too
+                // this is done for performance purposes
+                if (params.ViewEntity) {
+                    // When we receive the .ViewEntity via our params that is a time saver as we don't need to load it again, so ALWAYS use that instance of the entity object for the view entity
+                    this._viewEntity = params.ViewEntity;
+                    const e = md.Entities.find(x => { var _a; return x.ID === ((_a = this._viewEntity) === null || _a === void 0 ? void 0 : _a.EntityID); });
+                    if (e)
+                        this._entityInfo = e;
+                    else
+                        throw new Error("Unable to get entity info for view: " + ((_a = this._viewEntity) === null || _a === void 0 ? void 0 : _a.Name));
+                }
+                else if (!params.ViewEntity && (params.ViewID || params.ViewName)) {
+                    // this is NOT a dyamic view as we got either the ViewID or ViewName, so we can get the ViewEntity
+                    if (params.ViewID && params.ViewID > 0) {
+                        this._viewEntity = (yield ViewInfo.GetViewEntity(params.ViewID));
+                    }
+                    else if (params.ViewName) {
+                        this._viewEntity = (yield ViewInfo.GetViewEntityByName(params.ViewName));
+                    }
+                    params.ViewEntity = this._viewEntity;
+                    const e = md.Entities.find(x => { var _a; return x.ID === ((_a = this._viewEntity) === null || _a === void 0 ? void 0 : _a.EntityID); });
+                    if (e)
+                        this._entityInfo = e;
+                    else
+                        throw new Error("Unable to get entity info for view: " + ((_b = this._viewEntity) === null || _b === void 0 ? void 0 : _b.Name));
+                }
+                else if (params.EntityName) {
+                    // we don't have a ViewEntity because we're doing a dynamic view, so we need to get the entity info from the Entity Name
+                    const e = md.Entities.find(x => x.Name === params.EntityName);
+                    if (e)
+                        this._entityInfo = e;
+                }
+                else
+                    throw new Error("Invalid configuration, we need to receive either a ViewEntity, ViewID, ViewName, or EntityName and ExtraFilter in order to run a view");
+                const rvResult = yield rv.RunView(params);
+                if (!rvResult.Success) {
+                    // it failed
+                    this.CreateSimpleNotification("Error running view:\n\n" + rvResult.ErrorMessage, 'error', 5000);
+                }
+                else {
+                    // it worked
+                    this.viewData = rvResult.Results;
+                    this.totalRowCount = rvResult.TotalRowCount;
+                    this.formattedData = new Array(this.viewData.length);
+                    let cols;
+                    if (this._viewEntity)
+                        cols = this._viewEntity.Columns;
+                    else
+                        cols = (_c = this._entityInfo) === null || _c === void 0 ? void 0 : _c.Fields.filter((f) => f.DefaultInView).map((f) => {
+                            return {
+                                ID: f.ID,
+                                Name: f.Name,
+                                DisplayName: f.DisplayName,
+                                EntityField: f,
+                                hidden: false,
+                                orderIndex: f.Sequence,
+                                width: f.DefaultColumnWidth ? f.DefaultColumnWidth : 100,
+                            };
+                        });
+                    if (cols) {
+                        this.viewColumns = cols;
+                        const tempCols = cols.filter(x => x.hidden === false).sort((a, b) => {
+                            const aOrder = a.orderIndex != null ? a.orderIndex : 9999;
+                            const bOrder = b.orderIndex != null ? b.orderIndex : 9999;
+                            return aOrder - bOrder;
+                        });
+                        this.visibleColumns = tempCols;
+                    }
+                    // sorting setup
+                    if (this._viewEntity) {
+                        const temp = this._viewEntity.ViewSortInfo;
+                        const kendoSortSettings = temp.map((s) => {
+                            let dir;
+                            if (typeof s.direction === 'string')
+                                dir = s.direction.trim().toLowerCase();
+                            else if (typeof s.direction === 'number' && s.direction === 1)
+                                dir = 'asc';
+                            else if (typeof s.direction === 'number' && s.direction === 2)
+                                dir = 'desc';
+                            else
+                                dir = '';
+                            return { field: s.field, dir: dir };
+                        });
+                        this.sortSettings = kendoSortSettings;
+                    }
+                    this.skip = 0;
+                    this.virtualLoadData();
+                }
+                this.viewExecutionTime = (new Date().getTime() - startTime) / 1000; // in seconds
+                this.isLoading = false;
+            }
+            else {
+                LogError("Refresh(params) must have ViewID or ViewName or (EntityName and ExtraFilter)");
+            }
+        });
+    }
+    GetColumnTitle(col) {
+        if (col.DisplayName)
+            return col.DisplayName; // use view's display name first if it exists
+        else if (col.EntityField.DisplayName)
+            return col.EntityField.DisplayName; // then use entity display name, if that exist
+        else
+            return col.Name; // otherwise just use the column name
+    }
+    GetColumnCellStyle(col) {
+        switch (col.EntityField.Type.trim().toLowerCase()) {
+            case "money":
+            case 'decimal':
+            case 'real':
+            case 'float':
+            case 'int':
+                return { 'text-align': 'right', 'vertical-align': 'top' }; // right align numbers,
+            default:
+                return { 'text-align': 'left', 'vertical-align': 'top' }; // left align everything else
+        }
+    }
+    selectionChange(args) {
+        // update recordsToCompare based on the this.selectedKeys property that is bound
+        // selectedKeys is an array of indexes in the this.viewData, and we need to make our 
+        // this.recordsToCompare an array of records from this.viewData so just map() the selectedKeys for this
+        this.recordsToCompare = this.selectedKeys.map((i) => this.viewData[i]);
+    }
+    enableMergeOrCompare(cancel = false, type) {
+        if (!cancel && this.recordsToCompare.length >= 2) {
+            // this scenario occurs when we've already started the merge/compare and the user has selected records, then clicked the merge/compare button again
+            this.isCompareDialogOpened = true;
+            this.moveDialogToBody();
+        }
+        else if (cancel) {
+            // the user clicked cancel in our toolbar
+            if (type === 'merge')
+                this.mergeMode = false;
+            else
+                this.compareMode = false;
+            this.selectedKeys = [];
+            this.recordsToCompare = [];
+        }
+        else {
+            // just turning on merge mode from the merge/compare button, so just turn it on and let the user select records
+            if (type === 'merge')
+                this.mergeMode = true;
+            else
+                this.compareMode = true;
+        }
+    }
+    enableCheckbox(cancel = false, type) {
+        if (!cancel && this.recordsToCompare.length >= 2) {
+            // this scenario occurs when we've already started the merge/compare/duplicate and the user has selected records, then clicked the merge/compare button again
+            this.isCompareDialogOpened = true;
+            this.moveDialogToBody();
+        }
+        else if (cancel) {
+            // the user clicked cancel in our toolbar
+            this.mergeMode = false;
+            this.compareMode = false;
+            this.duplicateMode = false;
+            this.selectedKeys = [];
+            this.recordsToCompare = [];
+        }
+        else {
+            // just turning on the checkbox from the merge/compare/duplicate button, so just turn it on and let the user select records
+            if (type === 'merge') {
+                this.mergeMode = true;
+            }
+            else if (type === 'compare') {
+                this.compareMode = true;
+            }
+            else if (type === 'duplicate') {
+                this.duplicateMode = true;
+            }
+        }
+    }
+    closeConfirmMergeDialog(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (event === 'yes') {
+                if (this._entityInfo && this.recordCompareComponent) {
+                    const md = new Metadata();
+                    const pkeys = this._entityInfo.PrimaryKeys;
+                    const result = yield md.MergeRecords({
+                        EntityName: this._entityInfo.Name,
+                        RecordsToMerge: this.recordsToCompare.map((r) => {
+                            return r.PrimaryKey;
+                        }).filter((compositeKey) => {
+                            if (!this.recordCompareComponent) {
+                                return false;
+                            }
+                            return this.recordCompareComponent.selectedRecordCompositeKey.Equals(compositeKey);
+                        }),
+                        SurvivingRecordCompositeKey: this.recordCompareComponent.selectedRecordCompositeKey,
+                        FieldMap: this.recordCompareComponent.fieldMap.map((fm) => {
+                            return {
+                                FieldName: fm.fieldName,
+                                Value: fm.value
+                            };
+                        })
+                    });
+                    if (result.Success) {
+                        // merge was successful, so refresh the grid
+                        this.selectedKeys = [];
+                        this.recordsToCompare = [];
+                        this.mergeMode = false;
+                        this.compareMode = false;
+                        // close the dialogs
+                        this.isCompareDialogOpened = false;
+                        this.isConfirmDialogOpen = false;
+                        // refresh the grid
+                        this.Refresh(this.Params);
+                    }
+                    else {
+                        // the merge failed, so show an error message
+                        this.isConfirmDialogOpen = false;
+                        this.CreateSimpleNotification("Error merging records: " + result.OverallStatus, 'error', 5000);
+                    }
+                }
+            }
+            else {
+                this.isConfirmDialogOpen = false;
+                // close the dialog and let the user continue to work on the merge, so don't close the compare dialog
+            }
+        });
+    }
+    closeCompareDialog(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            console.log(event);
+            switch (event) {
+                case 'merge':
+                    // user has requested to merge the records and retain the selected record from the compare records component, so run the merge
+                    // first, confirm with the user to make 100% sure they want to do this as it is irreversible
+                    this.isConfirmDialogOpen = true;
+                    break;
+                default: // close and cancel
+                    this.selectedKeys = [];
+                    this.recordsToCompare = [];
+                    this.mergeMode = false;
+                    this.compareMode = false;
+                    this.duplicateMode = false;
+                    this.isCompareDialogOpened = false;
+                    break;
+            }
+        });
+    }
+    findDuplicateRecords() {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this._entityInfo) {
+                console.error("Entity Info is not available");
+                this.closeCompareDialog('duplicate');
+                return;
+            }
+            const md = new Metadata();
+            const list = yield md.GetEntityObject('Lists');
+            list.NewRecord();
+            list.Name = `Potential Duplicate Run`;
+            list.Description = `Potential Duplicate Run for ${this._entityInfo.Name} Entity`;
+            list.EntityID = this._entityInfo.ID;
+            list.UserID = md.CurrentUser.ID;
+            const saveResult = yield list.Save();
+            if (!saveResult) {
+                console.error(`Failed to save list for Potential Duplicate Run`);
+                return;
+            }
+            let params = new PotentialDuplicateRequest();
+            params.EntityID = (_a = this._entityInfo) === null || _a === void 0 ? void 0 : _a.ID;
+            params.ListID = list.ID;
+            params.RecordIDs = [];
+            for (const index of this.selectedKeys) {
+                const viewData = this.viewData[index];
+                const idField = viewData.ID;
+                const listDetail = yield md.GetEntityObject('List Details');
+                listDetail.NewRecord();
+                listDetail.ListID = list.ID;
+                listDetail.RecordID = idField.toString();
+                yield listDetail.Save();
+            }
+            this.closeCompareDialog('duplicate');
+            this.CreateSimpleNotification("Working on finding duplicates, will notify you when it is complete...", 'info', 2000);
+            let response = yield md.GetRecordDuplicates(params, md.CurrentUser);
+            console.log(response);
+        });
+    }
+    doExcelExport() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.kendoExcelExport === null)
+                throw new Error("kendoExcelExport is null, cannot export data");
+            try {
+                this.CreateSimpleNotification("Working on the export, will notify you when it is complete...", 'info', 2000);
+                const data = yield this.getExportData();
+                // we have the data.
+                const cols = this.viewColumns.filter((vc) => vc.hidden === false);
+                this.exportColumns = cols;
+                this.exportData = data;
+                // before we call the save, we need to let Angular do its thing that will result in the kendoExcelExport component binding properly to
+                // the exportColumns and exportData arrays. So we wait for the next tick before we call save()
+                setTimeout(() => {
+                    this.kendoExcelExport.save();
+                    this.CreateSimpleNotification("Excel Export Complete", 'success', 2000);
+                }, 100);
+            }
+            catch (e) {
+                this.CreateSimpleNotification("Error exporting data", 'error', 5000);
+                LogError(e);
+            }
+        });
+    }
+    getExportData() {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Get the data for the ENTIRE view, not just the current page
+            const md = new Metadata();
+            const rv = new RunView();
+            const p = Object.assign(Object.assign({}, this.Params), { IgnoreMaxRows: true, ForceAuditLog: true, AuditLogDescription: `Export of Data From ${this._viewEntity ? '"' + this._viewEntity.Get('Name') + '"' : ''} View for User ${md.CurrentUser.Email}` });
+            const result = yield rv.RunView(p);
+            if (result && result.Success) {
+                return result.Results;
+            }
+            else
+                throw new Error("Unable to get export data");
+        });
+    }
+}
+ListDetailGridComponent.ɵfac = function ListDetailGridComponent_Factory(t) { return new (t || ListDetailGridComponent)(i0.ɵɵdirectiveInject(i1.FormBuilder), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(i0.Renderer2)); };
+ListDetailGridComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ListDetailGridComponent, selectors: [["mj-list-detail-grid"]], viewQuery: function ListDetailGridComponent_Query(rf, ctx) { if (rf & 1) {
+        i0.ɵɵviewQuery(_c0, 5, GridComponent);
+        i0.ɵɵviewQuery(_c0, 5, ElementRef);
+        i0.ɵɵviewQuery(_c1, 5, ExcelExportComponent);
+        i0.ɵɵviewQuery(_c2, 5);
+        i0.ɵɵviewQuery(_c3, 5, TextAreaComponent);
+        i0.ɵɵviewQuery(_c4, 5, ElementRef);
+        i0.ɵɵviewQuery(_c5, 5);
+    } if (rf & 2) {
+        let _t;
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.kendoGridElement = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.kendoGridElementRef = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.kendoExcelExport = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.recordCompareComponent = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.analysisQuestion = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.analysisResults = _t.first);
+        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.compareDialogContainer = _t.first);
+    } }, inputs: { Params: "Params", BottomMargin: "BottomMargin", InEditMode: "InEditMode", EditMode: "EditMode", AutoNavigate: "AutoNavigate", AllowLoad: "AllowLoad" }, outputs: { rowClicked: "rowClicked", rowEdited: "rowEdited" }, decls: 9, vars: 18, consts: [["mjFillContainer", "", 1, "list-detail-grid-wrap"], ["mjFillContainer", "", "scrollable", "virtual", "kendoGridSelectBy", "", 3, "resizable", "data", "skip", "pageSize", "rowHeight", "loading", "height", "sortable", "sort", "reorderable", "selectable", "selectedKeys", "pageChange", "selectedKeysChange", "cellClick", "cellClose", "columnReorder", "columnResize", "selectionChange", "sortChange"], ["kendoGrid", ""], ["kendoGridToolbarTemplate", ""], [3, "width", "headerStyle", "style", 4, "ngIf"], [3, "field", "title", "width", "editable", "editor", "headerStyle", "style", 4, "ngFor", "ngForOf"], [3, "data", "fileName"], ["excelExport", ""], [3, "field", "title", 4, "ngFor", "ngForOf"], ["kendoButton", "", 3, "click"], [1, "fa-regular", "fa-file-excel"], [3, "width", "headerStyle"], [3, "field", "title", "width", "editable", "editor", "headerStyle"], [4, "ngIf"], ["kendoGridFooterTemplate", ""], [2, "font-size", "smaller", "font-weight", "normal"], [3, "field", "title"]], template: function ListDetailGridComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0)(1, "kendo-grid", 1, 2);
+        i0.ɵɵlistener("pageChange", function ListDetailGridComponent_Template_kendo_grid_pageChange_1_listener($event) { return ctx.pageChange($event); });
+        i0.ɵɵtwoWayListener("selectedKeysChange", function ListDetailGridComponent_Template_kendo_grid_selectedKeysChange_1_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.selectedKeys, $event) || (ctx.selectedKeys = $event); return $event; });
+        i0.ɵɵlistener("cellClick", function ListDetailGridComponent_Template_kendo_grid_cellClick_1_listener($event) { return ctx.cellClickHandler($event); })("cellClose", function ListDetailGridComponent_Template_kendo_grid_cellClose_1_listener($event) { return ctx.cellCloseHandler($event); })("columnReorder", function ListDetailGridComponent_Template_kendo_grid_columnReorder_1_listener($event) { return ctx.columnReorder($event); })("columnResize", function ListDetailGridComponent_Template_kendo_grid_columnResize_1_listener($event) { return ctx.columnResize($event); })("selectionChange", function ListDetailGridComponent_Template_kendo_grid_selectionChange_1_listener($event) { return ctx.selectionChange($event); })("sortChange", function ListDetailGridComponent_Template_kendo_grid_sortChange_1_listener($event) { return ctx.sortChanged($event); });
+        i0.ɵɵtemplate(3, ListDetailGridComponent_ng_template_3_Template, 3, 0, "ng-template", 3)(4, ListDetailGridComponent_kendo_grid_checkbox_column_4_Template, 1, 6, "kendo-grid-checkbox-column", 4)(5, ListDetailGridComponent_kendo_grid_column_5_Template, 2, 10, "kendo-grid-column", 5);
+        i0.ɵɵelementStart(6, "kendo-excelexport", 6, 7);
+        i0.ɵɵtemplate(8, ListDetailGridComponent_kendo_excelexport_column_8_Template, 1, 2, "kendo-excelexport-column", 8);
+        i0.ɵɵelementEnd()()();
+    } if (rf & 2) {
+        i0.ɵɵadvance();
+        i0.ɵɵproperty("resizable", true)("data", ctx.gridView)("skip", ctx.skip)("pageSize", ctx.pageSize)("rowHeight", 36)("loading", ctx.isLoading)("height", ctx.gridHeight)("sortable", true)("sort", ctx.sortSettings)("resizable", true)("reorderable", true)("selectable", true);
+        i0.ɵɵtwoWayProperty("selectedKeys", ctx.selectedKeys);
+        i0.ɵɵadvance(3);
+        i0.ɵɵproperty("ngIf", ctx.compareMode || ctx.mergeMode || ctx.duplicateMode);
+        i0.ɵɵadvance();
+        i0.ɵɵproperty("ngForOf", ctx.visibleColumns);
+        i0.ɵɵadvance();
+        i0.ɵɵproperty("data", ctx.exportData)("fileName", (ctx._viewEntity ? ctx._viewEntity.Get("Name") : ctx._entityInfo == null ? null : ctx._entityInfo.Name) + ".xlsx");
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngForOf", ctx.exportColumns);
+    } }, dependencies: [i3.NgForOf, i3.NgIf, i4.GridComponent, i4.ToolbarTemplateDirective, i4.SelectionDirective, i4.ColumnComponent, i4.FooterTemplateDirective, i4.CheckboxColumnComponent, i5.ExcelExportComponent, i5.ColumnComponent, i6.ButtonComponent, i7.FillContainer, i3.DecimalPipe], styles: [".list-detail-grid-wrap[_ngcontent-%COMP%] {\n    height: calc(100vh - 20px);\n}\n\n.list-detail-grid-column-header[_ngcontent-%COMP%] {\n    background-color: #fff;\n    font-size: 20pt;\n    font-weight: bold;\n}\n\n.title-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--med-gray);\n}\n .title-wrapper[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 24px;\n    line-height: 28px;\n }\n .main-fav-wrapper[_ngcontent-%COMP%] {\n    background: #fff;\n    padding: 20px;\n }\n .filter-wrapper[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-start;\n    gap: 14px;\n    align-items: center;\n}\n .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    width: 100%;\n    height: 100%;\n    font-size: 16px;\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    padding-left: 40px;\n\n }\n    .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]  {\n    background: var(--light-shade);\n    width: 360px;\n    height: 44px;\n    position: relative;\n    border-radius: 10px;\n }\n .title-wrapper[_ngcontent-%COMP%]   .search[_ngcontent-%COMP%]   svg[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    left: 12px;\n}\n.k-table-td[_ngcontent-%COMP%] {\n    border-right: none !important;\n}.btn-cmn[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 44px;\n    min-width: 44px;\n    background: transparent;\n    border-radius: 8px;\n    border: 1px solid var(--gray-color);\n}\n.btn-cmn.active[_ngcontent-%COMP%] {\n    border: 1px solid var(--border-blue);\n}\n  .title-wrapper .filter-wrapper .k-dropdown-button .k-button {\n    border: 1px solid var(--gray-color);\n    border-radius: 8px;   padding: 10px 25px;\n    background: var(--white-color);\n    color: var(--sideNav);\n}\n  .list-detail-grid-wrap .k-grid-aria-root .k-grid-header .k-grid-header-table thead tr th {\n    border-right: none;\n    border-inline-start-width: 0;\n    color: var(--thead-color);\n}\n  .list-detail-grid-wrap .k-grid-aria-root kendo-grid-list .k-grid-table tbody tr td { \n    border-inline-start-width: 0;\n    color: var(--tdata-color);\n    font-weight: 500;\n    border-bottom-width: 1px;\n}"] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ListDetailGridComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-list-detail-grid', template: "<div class=\"list-detail-grid-wrap\" mjFillContainer>\n    <kendo-grid #kendoGrid\n        mjFillContainer\n        [resizable]=\"true\"\n        [data]=\"gridView\" \n        [skip]=\"skip\"\n        [pageSize]=\"pageSize\"\n        scrollable=\"virtual\"\n        [rowHeight]=\"36\"\n        (pageChange)=\"pageChange($event)\"\n        [loading]=\"isLoading\"\n        [height]=\"gridHeight\"\n        [sortable]=\"true\"\n        [sort]=\"sortSettings\" \n        [resizable]=\"true\"\n        [reorderable]=\"true\"\n        [selectable]=\"true\"\n        kendoGridSelectBy\n        [(selectedKeys)]=\"selectedKeys\"\n        (cellClick)=\"cellClickHandler($event)\"\n        (cellClose)=\"cellCloseHandler($event)\"\n        (columnReorder)=\"columnReorder($event)\"\n        (columnResize)=\"columnResize($event)\"\n        (selectionChange)=\"selectionChange($event)\"\n        (sortChange)=\"sortChanged($event)\"\n    >\n        <ng-template kendoGridToolbarTemplate>\n            <button kendoButton (click)=\"doExcelExport()\" >\n                <span class=\"fa-regular fa-file-excel\"></span>\n                Export to Excel\n            </button>\n        </ng-template>\n        <kendo-grid-checkbox-column \n            *ngIf=\"compareMode || mergeMode || duplicateMode\" \n            [width]=\"50\" \n            [headerStyle]=\"{ 'font-weight' : 'bold', 'background-color': 'white' }\" \n            [style]=\"{'text-align': 'center', 'vertical-align': 'center'}\">\n        </kendo-grid-checkbox-column>\n        <kendo-grid-column \n            *ngFor=\"let item of visibleColumns\" \n            [field]=\"item.Name\" \n            [title]=\"GetColumnTitle(item)\"\n            [width]=\"item.width ? item.width : 100\"\n            [editable]=\"item.EntityField.AllowUpdateAPI\"\n            [editor]=\"getEditor(item.EntityField)\"\n            [headerStyle]=\"{ 'font-weight' : 'bold', 'background-color': 'white' }\"\n            [style]=\"this.GetColumnCellStyle(item)\"\n        >\n            <ng-template *ngIf=\"item===visibleColumns[0]\" kendoGridFooterTemplate >\n                {{this.viewData.length | number}}{{this.totalRowCount > this.viewData.length ? ' of ' + (this.totalRowCount | number) : ' rows'}}<br/><span style=\"font-size: smaller; font-weight: normal;\">{{viewExecutionTime | number:'1.2-2'}} seconds</span>\n            </ng-template>\n        </kendo-grid-column>\n        <kendo-excelexport #excelExport [data]=\"exportData\" [fileName]=\"(_viewEntity ? _viewEntity.Get('Name') : _entityInfo?.Name) + '.xlsx'\">\n            <kendo-excelexport-column *ngFor=\"let exportCol of exportColumns\" [field]=\"exportCol.Name\" [title]=\"exportCol.Name\">\n            </kendo-excelexport-column>\n        </kendo-excelexport>\n    </kendo-grid>\n</div>  ", styles: [".list-detail-grid-wrap {\n    height: calc(100vh - 20px);\n}\n\n.list-detail-grid-column-header {\n    background-color: #fff;\n    font-size: 20pt;\n    font-weight: bold;\n}\n\n.title-wrapper {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--med-gray);\n}\n .title-wrapper h4 {\n    margin: 0;\n    font-size: 24px;\n    line-height: 28px;\n }\n .main-fav-wrapper {\n    background: #fff;\n    padding: 20px;\n }\n .filter-wrapper {\n    display: flex;\n    justify-content: flex-start;\n    gap: 14px;\n    align-items: center;\n}\n .title-wrapper .search  input {\n    width: 100%;\n    height: 100%;\n    font-size: 16px;\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    padding-left: 40px;\n\n }\n    .title-wrapper .search  {\n    background: var(--light-shade);\n    width: 360px;\n    height: 44px;\n    position: relative;\n    border-radius: 10px;\n }\n .title-wrapper .search svg {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    left: 12px;\n}\n.k-table-td {\n    border-right: none !important;\n}.btn-cmn {\n    width: 44px;\n    height: 44px;\n    min-width: 44px;\n    background: transparent;\n    border-radius: 8px;\n    border: 1px solid var(--gray-color);\n}\n.btn-cmn.active {\n    border: 1px solid var(--border-blue);\n}\n::ng-deep .title-wrapper .filter-wrapper .k-dropdown-button .k-button {\n    border: 1px solid var(--gray-color);\n    border-radius: 8px;   padding: 10px 25px;\n    background: var(--white-color);\n    color: var(--sideNav);\n}\n::ng-deep .list-detail-grid-wrap .k-grid-aria-root .k-grid-header .k-grid-header-table thead tr th {\n    border-right: none;\n    border-inline-start-width: 0;\n    color: var(--thead-color);\n}\n::ng-deep .list-detail-grid-wrap .k-grid-aria-root kendo-grid-list .k-grid-table tbody tr td { \n    border-inline-start-width: 0;\n    color: var(--tdata-color);\n    font-weight: 500;\n    border-bottom-width: 1px;\n}   "] }]
+    }], () => [{ type: i1.FormBuilder }, { type: i2.Router }, { type: i0.Renderer2 }], { Params: [{
+            type: Input
+        }], BottomMargin: [{
+            type: Input
+        }], InEditMode: [{
+            type: Input
+        }], EditMode: [{
+            type: Input
+        }], AutoNavigate: [{
+            type: Input
+        }], rowClicked: [{
+            type: Output
+        }], rowEdited: [{
+            type: Output
+        }], kendoGridElement: [{
+            type: ViewChild,
+            args: ['kendoGrid', { read: GridComponent }]
+        }], kendoGridElementRef: [{
+            type: ViewChild,
+            args: ['kendoGrid', { read: ElementRef }]
+        }], kendoExcelExport: [{
+            type: ViewChild,
+            args: ['excelExport', { read: ExcelExportComponent }]
+        }], recordCompareComponent: [{
+            type: ViewChild,
+            args: ['recordCompareRef', { static: false }]
+        }], analysisQuestion: [{
+            type: ViewChild,
+            args: ['analysisQuestion', { read: TextAreaComponent }]
+        }], analysisResults: [{
+            type: ViewChild,
+            args: ['analysisResults', { read: ElementRef }]
+        }], compareDialogContainer: [{
+            type: ViewChild,
+            args: ['compareDialogContainer']
+        }], AllowLoad: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ListDetailGridComponent, { className: "ListDetailGridComponent", filePath: "src/lib/ng-list-detail-grid.component.ts", lineNumber: 43 }); })();

package/dist/module.d.ts

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./lib/ng-list-detail-grid.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@angular/router";
+import * as i5 from "@progress/kendo-angular-grid";
+import * as i6 from "@progress/kendo-angular-dialog";
+import * as i7 from "@progress/kendo-angular-excel-export";
+import * as i8 from "@progress/kendo-angular-buttons";
+import * as i9 from "@memberjunction/ng-compare-records";
+import * as i10 from "@memberjunction/ng-container-directives";
+import * as i11 from "@progress/kendo-angular-layout";
+import * as i12 from "@progress/kendo-angular-inputs";
+export declare class ListDetailGridModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ListDetailGridModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ListDetailGridModule, [typeof i1.ListDetailGridComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i3.ReactiveFormsModule, typeof i4.RouterModule, typeof i5.GridModule, typeof i6.DialogsModule, typeof i7.ExcelExportModule, typeof i8.ButtonsModule, typeof i9.CompareRecordsModule, typeof i10.ContainerDirectivesModule, typeof i11.LayoutModule, typeof i12.InputsModule], [typeof i1.ListDetailGridComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ListDetailGridModule>;
+}
+//# sourceMappingURL=module.d.ts.map

package/dist/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAkBA,qBAsBa,oBAAoB;yCAApB,oBAAoB;0CAApB,oBAAoB;0CAApB,oBAAoB;CAAI"}

package/dist/module.js

@@ -0,0 +1,68 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
+// Kendo UI Angular imports
+import { GridModule } from '@progress/kendo-angular-grid';
+import { ExcelExportModule } from '@progress/kendo-angular-excel-export';
+import { DialogsModule } from "@progress/kendo-angular-dialog";
+import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import { LayoutModule } from '@progress/kendo-angular-layout';
+import { InputsModule } from '@progress/kendo-angular-inputs';
+import { CompareRecordsModule } from '@memberjunction/ng-compare-records';
+import { ContainerDirectivesModule } from '@memberjunction/ng-container-directives';
+import { ListDetailGridComponent } from './lib/ng-list-detail-grid.component';
+import * as i0 from "@angular/core";
+export class ListDetailGridModule {
+}
+ListDetailGridModule.ɵfac = function ListDetailGridModule_Factory(t) { return new (t || ListDetailGridModule)(); };
+ListDetailGridModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: ListDetailGridModule });
+ListDetailGridModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        RouterModule,
+        GridModule,
+        DialogsModule,
+        ExcelExportModule,
+        ButtonsModule,
+        CompareRecordsModule,
+        ContainerDirectivesModule,
+        LayoutModule,
+        InputsModule] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ListDetailGridModule, [{
+        type: NgModule,
+        args: [{
+                declarations: [
+                    ListDetailGridComponent
+                ],
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    ReactiveFormsModule,
+                    RouterModule,
+                    GridModule,
+                    DialogsModule,
+                    ExcelExportModule,
+                    ButtonsModule,
+                    CompareRecordsModule,
+                    ContainerDirectivesModule,
+                    LayoutModule,
+                    InputsModule,
+                ],
+                exports: [
+                    ListDetailGridComponent
+                ]
+            }]
+    }], null, null); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(ListDetailGridModule, { declarations: [ListDetailGridComponent], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        RouterModule,
+        GridModule,
+        DialogsModule,
+        ExcelExportModule,
+        ButtonsModule,
+        CompareRecordsModule,
+        ContainerDirectivesModule,
+        LayoutModule,
+        InputsModule], exports: [ListDetailGridComponent] }); })();

package/dist/public-api.d.ts

@@ -0,0 +1,3 @@
+export * from './module';
+export * from './lib/ng-list-detail-grid.component';
+//# sourceMappingURL=public-api.d.ts.map

package/dist/public-api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../src/public-api.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,qCAAqC,CAAC"}

package/dist/public-api.js

@@ -0,0 +1,5 @@
+/*
+ * Public API Surface of ng-user-view-grid
+ */
+export * from './module';
+export * from './lib/ng-list-detail-grid.component';

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@memberjunction/ng-list-detail-grid",
+  "version": "1.4.1",
+  "description": "MemberJunction: Angular Grid to display dynamic and saved List Details for any entity in MemberJunction.",
+  "main": "./dist/public-api.js",
+  "typings": "./dist/public-api.d.ts",
+  "files": [
+    "/dist"
+  ],
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "ngc"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@angular/compiler": "~17.2.2",
+    "@angular/compiler-cli": "~17.2.2"
+  },
+  "peerDependencies": {
+    "@angular/common": "~17.2.2",
+    "@angular/core": "~17.2.2",
+    "@angular/forms": "~17.2.2",
+    "@angular/router": "~17.2.2"
+  },
+  "dependencies": {
+    "@memberjunction/core-entities": "~1.4.1",
+    "@memberjunction/global": "~1.4.1",
+    "@memberjunction/core": "~1.4.1",
+    "@memberjunction/ng-shared": "~1.4.1",
+    "@memberjunction/ng-compare-records": "~1.4.1",
+    "@memberjunction/ng-container-directives": "~1.4.1",
+    "@progress/kendo-angular-grid": "~15.1.0",
+    "@progress/kendo-angular-layout": "~15.1.0",
+    "@progress/kendo-angular-inputs": "~15.1.0",
+    "@progress/kendo-angular-buttons": "~15.1.0",
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false
+}