@memberjunction/ng-data-context 2.44.0 → 2.46.0

package/dist/lib/module.d.ts

@@ -2,13 +2,16 @@ import * as i0 from "@angular/core";
 import * as i1 from "./ng-data-context.component";
 import * as i2 from "./ng-data-context-dialog.component";
 import * as i3 from "@angular/common";
-import * as i4 from "@progress/kendo-angular-grid";
-import * as i5 from "@progress/kendo-angular-dialog";
-import * as i6 from "@progress/kendo-angular-buttons";
-import * as i7 from "@progress/kendo-angular-indicators";
+import * as i4 from "@angular/forms";
+import * as i5 from "@progress/kendo-angular-grid";
+import * as i6 from "@progress/kendo-angular-dialog";
+import * as i7 from "@progress/kendo-angular-buttons";
+import * as i8 from "@progress/kendo-angular-indicators";
+import * as i9 from "@progress/kendo-angular-inputs";
+import * as i10 from "@memberjunction/ng-container-directives";
 export declare class DataContextModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DataContextModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DataContextModule, [typeof i1.DataContextComponent, typeof i2.DataContextDialogComponent], [typeof i3.CommonModule, typeof i4.GridModule, typeof i5.DialogsModule, typeof i6.ButtonsModule, typeof i7.IndicatorsModule], [typeof i1.DataContextComponent, typeof i2.DataContextDialogComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DataContextModule, [typeof i1.DataContextComponent, typeof i2.DataContextDialogComponent], [typeof i3.CommonModule, typeof i4.FormsModule, typeof i5.GridModule, typeof i6.DialogsModule, typeof i7.ButtonsModule, typeof i8.IndicatorsModule, typeof i9.InputsModule, typeof i10.ContainerDirectivesModule], [typeof i1.DataContextComponent, typeof i2.DataContextDialogComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DataContextModule>;
 }
 //# sourceMappingURL=module.d.ts.map

package/dist/lib/module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../src/lib/module.ts"],"names":[],"mappings":";;;;;;;;AAYA,qBAiBa,iBAAiB;yCAAjB,iBAAiB;0CAAjB,iBAAiB;0CAAjB,iBAAiB;CAAI"}
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../src/lib/module.ts"],"names":[],"mappings":";;;;;;;;;;;AAeA,qBAoBa,iBAAiB;yCAAjB,iBAAiB;0CAAjB,iBAAiB;0CAAjB,iBAAiB;CAAI"}

package/dist/lib/module.js

@@ -1,22 +1,28 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 // Kendo UI Angular imports
 import { GridModule } from '@progress/kendo-angular-grid';
 import { DialogsModule } from "@progress/kendo-angular-dialog";
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
 import { IndicatorsModule } from '@progress/kendo-angular-indicators';
+import { InputsModule } from '@progress/kendo-angular-inputs';
 import { DataContextComponent } from './ng-data-context.component';
 import { DataContextDialogComponent } from './ng-data-context-dialog.component';
+import { ContainerDirectivesModule } from '@memberjunction/ng-container-directives';
 import * as i0 from "@angular/core";
 export class DataContextModule {
 }
 DataContextModule.ɵfac = function DataContextModule_Factory(t) { return new (t || DataContextModule)(); };
 DataContextModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: DataContextModule });
 DataContextModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+        FormsModule,
         GridModule,
         DialogsModule,
         ButtonsModule,
-        IndicatorsModule] });
+        IndicatorsModule,
+        InputsModule,
+        ContainerDirectivesModule] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DataContextModule, [{
         type: NgModule,
         args: [{
@@ -26,10 +32,13 @@ DataContextModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Common
                 ],
                 imports: [
                     CommonModule,
+                    FormsModule,
                     GridModule,
                     DialogsModule,
                     ButtonsModule,
-                    IndicatorsModule
+                    IndicatorsModule,
+                    InputsModule,
+                    ContainerDirectivesModule
                 ],
                 exports: [
                     DataContextComponent,
@@ -39,9 +48,12 @@ DataContextModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Common
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DataContextModule, { declarations: [DataContextComponent,
         DataContextDialogComponent], imports: [CommonModule,
+        FormsModule,
         GridModule,
         DialogsModule,
         ButtonsModule,
-        IndicatorsModule], exports: [DataContextComponent,
+        IndicatorsModule,
+        InputsModule,
+        ContainerDirectivesModule], exports: [DataContextComponent,
         DataContextDialogComponent] }); })();
 //# sourceMappingURL=module.js.map

package/dist/lib/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sourceRoot":"","sources":["../../src/lib/module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,2BAA2B;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAEtE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;;AAmBhF,MAAM,OAAO,iBAAiB;;kFAAjB,iBAAiB;mEAAjB,iBAAiB;uEAX1B,YAAY;QACZ,UAAU;QACV,aAAa;QACb,aAAa;QACb,gBAAgB;iFAOP,iBAAiB;cAjB7B,QAAQ;eAAC;gBACR,YAAY,EAAE;oBACZ,oBAAoB;oBACpB,0BAA0B;iBAC3B;gBACD,OAAO,EAAE;oBACP,YAAY;oBACZ,UAAU;oBACV,aAAa;oBACb,aAAa;oBACb,gBAAgB;iBACjB;gBACD,OAAO,EAAE;oBACP,oBAAoB;oBACpB,0BAA0B;iBAC3B;aACF;;wFACY,iBAAiB,mBAf1B,oBAAoB;QACpB,0BAA0B,aAG1B,YAAY;QACZ,UAAU;QACV,aAAa;QACb,aAAa;QACb,gBAAgB,aAGhB,oBAAoB;QACpB,0BAA0B"}
+{"version":3,"file":"module.js","sourceRoot":"","sources":["../../src/lib/module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,2BAA2B;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;AAChF,OAAO,EAAE,yBAAyB,EAAE,MAAM,yCAAyC,CAAC;;AAsBpF,MAAM,OAAO,iBAAiB;;kFAAjB,iBAAiB;mEAAjB,iBAAiB;uEAd1B,YAAY;QACZ,WAAW;QACX,UAAU;QACV,aAAa;QACb,aAAa;QACb,gBAAgB;QAChB,YAAY;QACZ,yBAAyB;iFAOhB,iBAAiB;cApB7B,QAAQ;eAAC;gBACR,YAAY,EAAE;oBACZ,oBAAoB;oBACpB,0BAA0B;iBAC3B;gBACD,OAAO,EAAE;oBACP,YAAY;oBACZ,WAAW;oBACX,UAAU;oBACV,aAAa;oBACb,aAAa;oBACb,gBAAgB;oBAChB,YAAY;oBACZ,yBAAyB;iBAC1B;gBACD,OAAO,EAAE;oBACP,oBAAoB;oBACpB,0BAA0B;iBAC3B;aACF;;wFACY,iBAAiB,mBAlB1B,oBAAoB;QACpB,0BAA0B,aAG1B,YAAY;QACZ,WAAW;QACX,UAAU;QACV,aAAa;QACb,aAAa;QACb,gBAAgB;QAChB,YAAY;QACZ,yBAAyB,aAGzB,oBAAoB;QACpB,0BAA0B"}

package/dist/lib/ng-data-context-dialog.component.d.ts

@@ -2,14 +2,19 @@ import { EventEmitter } from '@angular/core';
 import { IMetadataProvider } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 /**
- * Simple dialog wrapper component for the data context component
+ * Enhanced dialog wrapper component for the data context viewer
  */
 export declare class DataContextDialogComponent {
     dialogClosed: EventEmitter<any>;
     dataContextId: string;
+    dataContextName?: string;
     Provider: IMetadataProvider | null;
-    closePropertiesDialog(): void;
+    isMaximized: boolean;
+    get dialogWidth(): number;
+    get dialogHeight(): number;
+    closeDialog(): void;
+    toggleMaximize(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DataContextDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DataContextDialogComponent, "mj-data-context-dialog", never, { "dataContextId": { "alias": "dataContextId"; "required": false; }; "Provider": { "alias": "Provider"; "required": false; }; }, { "dialogClosed": "dialogClosed"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DataContextDialogComponent, "mj-data-context-dialog", never, { "dataContextId": { "alias": "dataContextId"; "required": false; }; "dataContextName": { "alias": "dataContextName"; "required": false; }; "Provider": { "alias": "Provider"; "required": false; }; }, { "dialogClosed": "dialogClosed"; }, never, never, false, never>;
 }
 //# sourceMappingURL=ng-data-context-dialog.component.d.ts.map

package/dist/lib/ng-data-context-dialog.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ng-data-context-dialog.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-data-context-dialog.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,YAAY,EAAiB,MAAM,eAAe,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;;AAEzD;;GAEG;AACH,qBAKa,0BAA0B;IAC3B,YAAY,oBAAsB;IACnC,aAAa,EAAG,MAAM,CAAC;IACvB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAEnD,qBAAqB;yCALV,0BAA0B;2CAA1B,0BAA0B;CAQtC"}
+{"version":3,"file":"ng-data-context-dialog.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-data-context-dialog.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,YAAY,EAAiB,MAAM,eAAe,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;;AAEzD;;GAEG;AACH,qBAKa,0BAA0B;IAC3B,YAAY,oBAAsB;IACnC,aAAa,EAAG,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAE5C,WAAW,EAAE,OAAO,CAAS;IAEpC,IAAW,WAAW,IAAI,MAAM,CAE/B;IAED,IAAW,YAAY,IAAI,MAAM,CAEhC;IAED,WAAW,IAAI,IAAI;IAInB,cAAc,IAAI,IAAI;yCApBX,0BAA0B;2CAA1B,0BAA0B;CAuBtC"}

package/dist/lib/ng-data-context-dialog.component.js

@@ -3,38 +3,71 @@ import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-dialog";
 import * as i2 from "./ng-data-context.component";
 /**
- * Simple dialog wrapper component for the data context component
+ * Enhanced dialog wrapper component for the data context viewer
  */
 export class DataContextDialogComponent {
     constructor() {
         this.dialogClosed = new EventEmitter();
         this.Provider = null;
+        this.isMaximized = false;
     }
-    closePropertiesDialog() {
+    get dialogWidth() {
+        return this.isMaximized ? window.innerWidth * 0.95 : 900;
+    }
+    get dialogHeight() {
+        return this.isMaximized ? window.innerHeight * 0.95 : 700;
+    }
+    closeDialog() {
         this.dialogClosed.emit();
     }
+    toggleMaximize() {
+        this.isMaximized = !this.isMaximized;
+    }
 }
 DataContextDialogComponent.ɵfac = function DataContextDialogComponent_Factory(t) { return new (t || DataContextDialogComponent)(); };
-DataContextDialogComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataContextDialogComponent, selectors: [["mj-data-context-dialog"]], inputs: { dataContextId: "dataContextId", Provider: "Provider" }, outputs: { dialogClosed: "dialogClosed" }, decls: 4, vars: 7, consts: [[1, "k-overlay"], ["title", "Data Context", 1, "kendo-window-custom", 3, "close", "width", "height", "minHeight", "minWidth", "resizable"], [3, "dataContextId", "Provider"]], template: function DataContextDialogComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "div");
-        i0.ɵɵelement(1, "div", 0);
-        i0.ɵɵelementStart(2, "kendo-window", 1);
-        i0.ɵɵlistener("close", function DataContextDialogComponent_Template_kendo_window_close_2_listener() { return ctx.closePropertiesDialog(); });
-        i0.ɵɵelement(3, "mj-data-context", 2);
+DataContextDialogComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataContextDialogComponent, selectors: [["mj-data-context-dialog"]], inputs: { dataContextId: "dataContextId", dataContextName: "dataContextName", Provider: "Provider" }, outputs: { dialogClosed: "dialogClosed" }, decls: 15, vars: 16, consts: [[1, "data-context-dialog-wrapper"], [1, "k-overlay"], [1, "data-context-window", 3, "close", "width", "height", "minHeight", "minWidth", "resizable", "draggable"], [1, "window-title"], [1, "fa-solid", "fa-layer-group", "title-icon"], [1, "window-actions"], [1, "window-action-btn", 3, "click", "title"], [1, "fa-solid"], ["title", "Close", 1, "window-action-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "dialog-content"], [3, "dataContextId", "Provider"]], template: function DataContextDialogComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵelement(1, "div", 1);
+        i0.ɵɵelementStart(2, "kendo-window", 2);
+        i0.ɵɵlistener("close", function DataContextDialogComponent_Template_kendo_window_close_2_listener() { return ctx.closeDialog(); });
+        i0.ɵɵelementStart(3, "kendo-window-titlebar")(4, "div", 3);
+        i0.ɵɵelement(5, "i", 4);
+        i0.ɵɵelementStart(6, "span");
+        i0.ɵɵtext(7);
         i0.ɵɵelementEnd()();
+        i0.ɵɵelementStart(8, "div", 5)(9, "button", 6);
+        i0.ɵɵlistener("click", function DataContextDialogComponent_Template_button_click_9_listener() { return ctx.toggleMaximize(); });
+        i0.ɵɵelement(10, "i", 7);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(11, "button", 8);
+        i0.ɵɵlistener("click", function DataContextDialogComponent_Template_button_click_11_listener() { return ctx.closeDialog(); });
+        i0.ɵɵelement(12, "i", 9);
+        i0.ɵɵelementEnd()()();
+        i0.ɵɵelementStart(13, "div", 10);
+        i0.ɵɵelement(14, "mj-data-context", 11);
+        i0.ɵɵelementEnd()()();
     } if (rf & 2) {
         i0.ɵɵadvance(2);
-        i0.ɵɵproperty("width", 700)("height", 525)("minHeight", 300)("minWidth", 400)("resizable", true);
+        i0.ɵɵclassProp("maximized", ctx.isMaximized);
+        i0.ɵɵproperty("width", ctx.dialogWidth)("height", ctx.dialogHeight)("minHeight", 400)("minWidth", 600)("resizable", !ctx.isMaximized)("draggable", !ctx.isMaximized);
+        i0.ɵɵadvance(5);
+        i0.ɵɵtextInterpolate1("Data Context", ctx.dataContextName ? ": " + ctx.dataContextName : "", "");
+        i0.ɵɵadvance(2);
+        i0.ɵɵpropertyInterpolate("title", ctx.isMaximized ? "Restore" : "Maximize");
         i0.ɵɵadvance();
+        i0.ɵɵclassProp("fa-maximize", !ctx.isMaximized)("fa-compress", ctx.isMaximized);
+        i0.ɵɵadvance(4);
         i0.ɵɵproperty("dataContextId", ctx.dataContextId)("Provider", ctx.Provider);
-    } }, dependencies: [i1.WindowComponent, i2.DataContextComponent] });
+    } }, dependencies: [i1.WindowComponent, i1.WindowTitleBarComponent, i2.DataContextComponent], styles: [".data-context-dialog-wrapper[_ngcontent-%COMP%] {\n    position: relative;\n}\n\n.data-context-window[_ngcontent-%COMP%] {\n    border-radius: 8px;\n    overflow: hidden;\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);\n}\n\n\n\n[_nghost-%COMP%]     .k-window {\n    margin: 0 auto;\n    top: 10% !important;\n    position: fixed !important;\n}\n\n\n.data-context-window.maximized[_ngcontent-%COMP%] {\n    position: fixed !important;\n    top: 2.5% !important;\n    left: 2.5% !important;\n}\n\n\n\n.window-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 16px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.title-icon[_ngcontent-%COMP%] {\n    color: #2196f3;\n    font-size: 18px;\n}\n\n.window-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n    margin-left: auto;\n}\n\n.window-action-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 8px 10px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    border-radius: 4px;\n    font-size: 14px;\n}\n\n.window-action-btn[_ngcontent-%COMP%]:hover {\n    background-color: #e3f2fd;\n    color: #2196f3;\n}\n\n.window-action-btn[_ngcontent-%COMP%]:last-child:hover {\n    background-color: #ffebee;\n    color: #f44336;\n}\n\n\n\n.dialog-content[_ngcontent-%COMP%] {\n    height: 100%;\n    overflow: auto;\n    display: flex;\n    flex-direction: column;\n}\n\n\n\n[_nghost-%COMP%]     .k-window-titlebar {\n    background-color: #ffffff;\n    border-bottom: 1px solid #e2e8f0;\n    padding: 12px 16px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n}\n\n[_nghost-%COMP%]     .k-window-title {\n    display: contents;\n}\n\n[_nghost-%COMP%]     .k-window-actions {\n    display: none; \n\n}\n\n[_nghost-%COMP%]     .k-window-content {\n    padding: 0;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n}\n\n[_nghost-%COMP%]     .k-window {\n    border: none;\n}\n\n\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n    from {\n        opacity: 0;\n        transform: scale(0.95);\n    }\n    to {\n        opacity: 1;\n        transform: scale(1);\n    }\n}\n\n.data-context-window[_ngcontent-%COMP%] {\n    animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DataContextDialogComponent, [{
         type: Component,
-        args: [{ selector: 'mj-data-context-dialog', template: "<div>\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=\"Data Context\"\n        (close)=\"closePropertiesDialog()\"\n    >\n        <mj-data-context \n                [dataContextId]=\"dataContextId\" \n                [Provider]=\"Provider\"\n        ></mj-data-context>\n    </kendo-window>\n</div>" }]
+        args: [{ selector: 'mj-data-context-dialog', template: "<div class=\"data-context-dialog-wrapper\">\n    <div class=\"k-overlay\"></div>\n    <kendo-window \n        class=\"data-context-window\"\n        [class.maximized]=\"isMaximized\"\n        [width]=\"dialogWidth\"\n        [height]=\"dialogHeight\"\n        [minHeight]=\"400\"\n        [minWidth]=\"600\"\n        [resizable]=\"!isMaximized\"\n        [draggable]=\"!isMaximized\"\n        (close)=\"closeDialog()\">\n        \n        <kendo-window-titlebar>\n            <div class=\"window-title\">\n                <i class=\"fa-solid fa-layer-group title-icon\"></i>\n                <span>Data Context{{ dataContextName ? ': ' + dataContextName : '' }}</span>\n            </div>\n            <div class=\"window-actions\">\n                <button \n                    (click)=\"toggleMaximize()\"\n                    title=\"{{ isMaximized ? 'Restore' : 'Maximize' }}\"\n                    class=\"window-action-btn\">\n                    <i class=\"fa-solid\" [class.fa-maximize]=\"!isMaximized\" [class.fa-compress]=\"isMaximized\"></i>\n                </button>\n                <button \n                    (click)=\"closeDialog()\"\n                    title=\"Close\"\n                    class=\"window-action-btn\">\n                    <i class=\"fa-solid fa-xmark\"></i>\n                </button>\n            </div>\n        </kendo-window-titlebar>\n        \n        <div class=\"dialog-content\">\n            <mj-data-context \n                [dataContextId]=\"dataContextId\" \n                [Provider]=\"Provider\">\n            </mj-data-context>\n        </div>\n    </kendo-window>\n</div>", styles: [".data-context-dialog-wrapper {\n    position: relative;\n}\n\n.data-context-window {\n    border-radius: 8px;\n    overflow: hidden;\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);\n}\n\n/* Position the window properly */\n:host ::ng-deep .k-window {\n    margin: 0 auto;\n    top: 10% !important;\n    position: fixed !important;\n}\n\n\n.data-context-window.maximized {\n    position: fixed !important;\n    top: 2.5% !important;\n    left: 2.5% !important;\n}\n\n/* Custom Title Bar */\n.window-title {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 16px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.title-icon {\n    color: #2196f3;\n    font-size: 18px;\n}\n\n.window-actions {\n    display: flex;\n    gap: 4px;\n    margin-left: auto;\n}\n\n.window-action-btn {\n    background: none;\n    border: none;\n    padding: 8px 10px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    border-radius: 4px;\n    font-size: 14px;\n}\n\n.window-action-btn:hover {\n    background-color: #e3f2fd;\n    color: #2196f3;\n}\n\n.window-action-btn:last-child:hover {\n    background-color: #ffebee;\n    color: #f44336;\n}\n\n/* Dialog Content */\n.dialog-content {\n    height: 100%;\n    overflow: auto;\n    display: flex;\n    flex-direction: column;\n}\n\n/* Override Kendo Window Styles */\n:host ::ng-deep .k-window-titlebar {\n    background-color: #ffffff;\n    border-bottom: 1px solid #e2e8f0;\n    padding: 12px 16px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n}\n\n:host ::ng-deep .k-window-title {\n    display: contents;\n}\n\n:host ::ng-deep .k-window-actions {\n    display: none; /* Hide default Kendo window actions since we have custom ones */\n}\n\n:host ::ng-deep .k-window-content {\n    padding: 0;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n}\n\n:host ::ng-deep .k-window {\n    border: none;\n}\n\n/* Animations */\n@keyframes fadeIn {\n    from {\n        opacity: 0;\n        transform: scale(0.95);\n    }\n    to {\n        opacity: 1;\n        transform: scale(1);\n    }\n}\n\n.data-context-window {\n    animation: fadeIn 0.2s ease-out;\n}"] }]
     }], null, { dialogClosed: [{
             type: Output
         }], dataContextId: [{
             type: Input
+        }], dataContextName: [{
+            type: Input
         }], Provider: [{
             type: Input
         }] }); })();

package/dist/lib/ng-data-context-dialog.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"ng-data-context-dialog.component.js","sourceRoot":"","sources":["../../src/lib/ng-data-context-dialog.component.ts","../../src/lib/ng-data-context-dialog.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;;;;AAGvE;;GAEG;AAMH,MAAM,OAAO,0BAA0B;IALvC;QAMY,iBAAY,GAAG,IAAI,YAAY,EAAE,CAAC;QAEnC,aAAQ,GAA6B,IAAI,CAAC;KAKpD;IAHC,qBAAqB;QACnB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;;oGAPU,0BAA0B;6EAA1B,0BAA0B;QCXvC,2BAAK;QACD,yBAA6B;QAC7B,uCASC;QADG,6GAAS,2BAAuB,IAAC;QAEjC,qCAGmB;QAE3B,AADI,iBAAe,EACb;;QAbE,eAAa;QAIb,AADA,AADA,AADA,AADA,2BAAa,eACC,kBACG,iBACD,mBACE;QAKV,cAA+B;QAC/B,AADA,iDAA+B,0BACV;;iFDHxB,0BAA0B;cALtC,SAAS;2BACE,wBAAwB;gBAKxB,YAAY;kBAArB,MAAM;YACE,aAAa;kBAArB,KAAK;YACG,QAAQ;kBAAhB,KAAK;;kFAHK,0BAA0B"}
+{"version":3,"file":"ng-data-context-dialog.component.js","sourceRoot":"","sources":["../../src/lib/ng-data-context-dialog.component.ts","../../src/lib/ng-data-context-dialog.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;;;;AAGvE;;GAEG;AAMH,MAAM,OAAO,0BAA0B;IALvC;QAMY,iBAAY,GAAG,IAAI,YAAY,EAAE,CAAC;QAGnC,aAAQ,GAA6B,IAAI,CAAC;QAE5C,gBAAW,GAAY,KAAK,CAAC;KAiBrC;IAfC,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAC3D,CAAC;IAED,IAAW,YAAY;QACrB,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAC5D,CAAC;IAED,WAAW;QACT,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC;IACvC,CAAC;;oGAtBU,0BAA0B;6EAA1B,0BAA0B;QCXvC,8BAAyC;QACrC,yBAA6B;QAC7B,uCAS4B;QAAxB,6GAAS,iBAAa,IAAC;QAGnB,AADJ,6CAAuB,aACO;QACtB,uBAAkD;QAClD,4BAAM;QAAA,YAA+D;QACzE,AADyE,iBAAO,EAC1E;QAEF,AADJ,8BAA4B,gBAIM;QAF1B,uGAAS,oBAAgB,IAAC;QAG1B,wBAA6F;QACjG,iBAAS;QACT,kCAG8B;QAF1B,wGAAS,iBAAa,IAAC;QAGvB,wBAAiC;QAG7C,AADI,AADI,iBAAS,EACP,EACc;QAExB,gCAA4B;QACxB,uCAGkB;QAG9B,AADI,AADI,iBAAM,EACK,EACb;;QArCE,eAA+B;QAA/B,4CAA+B;QAM/B,AADA,AADA,AADA,AADA,AADA,uCAAqB,4BACE,kBACN,iBACD,+BACU,+BACA;QAMZ,eAA+D;QAA/D,gGAA+D;QAKjE,eAAkD;QAAlD,2EAAkD;QAE9B,cAAkC;QAAC,AAAnC,+CAAkC,gCAAkC;QAa5F,eAA+B;QAC/B,AADA,iDAA+B,0BACV;;iFD1BxB,0BAA0B;cALtC,SAAS;2BACE,wBAAwB;gBAKxB,YAAY;kBAArB,MAAM;YACE,aAAa;kBAArB,KAAK;YACG,eAAe;kBAAvB,KAAK;YACG,QAAQ;kBAAhB,KAAK;;kFAJK,0BAA0B"}

package/dist/lib/ng-data-context.component.d.ts

@@ -1,16 +1,41 @@
 import { OnInit } from '@angular/core';
 import { IMetadataProvider } from '@memberjunction/core';
-import { DataContextEntity } from '@memberjunction/core-entities';
+import { DataContextEntity, DataContextItemEntity } from '@memberjunction/core-entities';
 import * as i0 from "@angular/core";
 export declare class DataContextComponent implements OnInit {
     dataContextId: string;
     Provider: IMetadataProvider | null;
     dataContextRecord?: DataContextEntity;
-    dataContextItems: any;
+    dataContextItems: DataContextItemEntity[];
     showLoader: boolean;
+    errorMessage: string;
+    searchTerm: string;
+    showSQLPreview: boolean;
+    previewSQL: string;
+    copiedField: string;
+    expandedItems: {
+        [key: string]: boolean;
+    };
     get ProviderToUse(): IMetadataProvider;
+    get filteredItems(): DataContextItemEntity[];
+    get itemCount(): number;
     ngOnInit(): void;
     LoadDataContext(dataContextId: string): Promise<void>;
+    getTypeIcon(type: string): string;
+    getTypeColor(type: string): string;
+    getEntityName(entityId: string | null): string | undefined;
+    getViewName(viewId: string): Promise<string | undefined>;
+    getQueryName(queryId: string): Promise<string | undefined>;
+    onSearchChange(): void;
+    toggleItemExpansion(itemId: string): void;
+    copyToClipboard(text: string, fieldName: string): Promise<void>;
+    previewSQLCode(sql: string): void;
+    closeSQLPreview(): void;
+    navigateToEntity(entityId: string): void;
+    navigateToView(viewId: string): void;
+    navigateToQuery(queryId: string): void;
+    refresh(): Promise<void>;
+    exportToCSV(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DataContextComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DataContextComponent, "mj-data-context", never, { "dataContextId": { "alias": "dataContextId"; "required": false; }; "Provider": { "alias": "Provider"; "required": false; }; }, {}, never, never, false, never>;
 }

package/dist/lib/ng-data-context.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ng-data-context.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-data-context.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,MAAM,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAiD,MAAM,sBAAsB,CAAC;AACxG,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;;AAElE,qBAKa,oBAAqB,YAAW,MAAM;IACxC,aAAa,EAAG,MAAM,CAAC;IACvB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAE5C,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,gBAAgB,EAAE,GAAG,CAAM;IAC3B,UAAU,EAAE,OAAO,CAAS;IAEnC,IAAW,aAAa,IAAI,iBAAiB,CAE5C;IAED,QAAQ,IAAI,IAAI;IAOV,eAAe,CAAC,aAAa,EAAE,MAAM;yCAnBhC,oBAAoB;2CAApB,oBAAoB;CA0ChC"}
+{"version":3,"file":"ng-data-context.component.d.ts","sourceRoot":"","sources":["../../src/lib/ng-data-context.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,MAAM,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAiD,MAAM,sBAAsB,CAAC;AACxG,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;;AAEzF,qBAKa,oBAAqB,YAAW,MAAM;IACxC,aAAa,EAAG,MAAM,CAAC;IACvB,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAE5C,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,gBAAgB,EAAE,qBAAqB,EAAE,CAAM;IAC/C,UAAU,EAAE,OAAO,CAAS;IAC5B,YAAY,EAAE,MAAM,CAAM;IAC1B,UAAU,EAAE,MAAM,CAAM;IAGxB,cAAc,EAAE,OAAO,CAAS;IAChC,UAAU,EAAE,MAAM,CAAM;IACxB,WAAW,EAAE,MAAM,CAAM;IACzB,aAAa,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAM;IAEtD,IAAW,aAAa,IAAI,iBAAiB,CAE5C;IAED,IAAW,aAAa,IAAI,qBAAqB,EAAE,CAYlD;IAED,IAAW,SAAS,IAAI,MAAM,CAE7B;IAED,QAAQ,IAAI,IAAI;IAOV,eAAe,CAAC,aAAa,EAAE,MAAM;IAgCpC,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IAYjC,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IAYlC,aAAa,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS;IAMpD,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC;IAWxD,YAAY,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC;IAWhE,cAAc,IAAI,IAAI;IAKtB,mBAAmB,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IAInC,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAYrE,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKjC,eAAe,IAAI,IAAI;IAKvB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAKxC,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;IAKpC,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAKhC,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC;IAK9B,WAAW,IAAI,IAAI;yCApLf,oBAAoB;2CAApB,oBAAoB;CA0MhC"}

package/dist/lib/ng-data-context.component.js

@@ -10,56 +10,353 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { Component, Input } from '@angular/core';
 import { LogError, Metadata, RunView } from '@memberjunction/core';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@progress/kendo-angular-grid";
+import * as i1 from "@angular/forms";
+import * as i2 from "@progress/kendo-angular-buttons";
 import * as i3 from "@progress/kendo-angular-indicators";
-function DataContextComponent_Conditional_1_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div")(1, "div");
+import * as i4 from "@progress/kendo-angular-inputs";
+import * as i5 from "@angular/common";
+const _forTrack0 = ($index, $item) => $item.ID;
+function DataContextComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 1);
+    i0.ɵɵelement(1, "kendo-loader", 3);
+    i0.ɵɵelementStart(2, "p", 4);
+    i0.ɵɵtext(3, "Loading data context...");
+    i0.ɵɵelementEnd()();
+} }
+function DataContextComponent_Conditional_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 9);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.dataContextRecord.Description);
+} }
+function DataContextComponent_Conditional_2_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21);
+    i0.ɵɵelement(1, "i", 28);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div");
-    i0.ɵɵtext(4);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.errorMessage, " ");
+} }
+function DataContextComponent_Conditional_2_ng_template_26_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 29);
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 34);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(item_r4.Description);
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 37)(1, "div", 44)(2, "h4");
+    i0.ɵɵelement(3, "i", 45);
+    i0.ɵɵtext(4, " SQL Query");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 46)(6, "button", 47);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_11_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r5); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.copyToClipboard(item_r4.SQL, "sql-" + item_r4.ID)); });
+    i0.ɵɵelement(7, "i", 14);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "button", 48);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_11_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r5); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.previewSQLCode(item_r4.SQL)); });
+    i0.ɵɵelement(10, "i", 49);
+    i0.ɵɵtext(11, " Expand ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(12, "pre", 50)(13, "code");
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(7);
+    i0.ɵɵclassProp("fa-copy", ctx_r1.copiedField !== "sql-" + item_r4.ID)("fa-check", ctx_r1.copiedField === "sql-" + item_r4.ID);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.copiedField === "sql-" + item_r4.ID ? "Copied!" : "Copy", " ");
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(item_r4.SQL);
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40)(1, "span", 51);
+    i0.ɵɵtext(2, "Entity");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 52)(4, "span");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 53);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_14_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r6); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.navigateToEntity(item_r4.EntityID)); });
+    i0.ɵɵelement(7, "i", 54);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.getEntityName(item_r4.EntityID) || "Unknown");
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40)(1, "span", 51);
+    i0.ɵɵtext(2, "View");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 52)(4, "span", 55);
+    i0.ɵɵtext(5);
+    i0.ɵɵpipe(6, "slice");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 56);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_15_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r7); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.navigateToView(item_r4.ViewID)); });
+    i0.ɵɵelement(8, "i", 54);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵpropertyInterpolate("title", item_r4.ViewID);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind3(6, 3, item_r4.ViewID, 0, 20), "", item_r4.ViewID.length > 20 ? "..." : "", "");
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40)(1, "span", 51);
+    i0.ɵɵtext(2, "Query");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 52)(4, "span", 55);
+    i0.ɵɵtext(5);
+    i0.ɵɵpipe(6, "slice");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 57);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_16_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r8); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.navigateToQuery(item_r4.QueryID)); });
+    i0.ɵɵelement(8, "i", 54);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵpropertyInterpolate("title", item_r4.QueryID);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind3(6, 3, item_r4.QueryID, 0, 20), "", item_r4.QueryID.length > 20 ? "..." : "", "");
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40)(1, "span", 51);
+    i0.ɵɵtext(2, "Record ID");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 52)(4, "code");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 58);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Conditional_17_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r9); const item_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.copyToClipboard(item_r4.RecordID, "record-" + item_r4.ID)); });
+    i0.ɵɵelement(7, "i", 14);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(item_r4.RecordID);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("fa-copy", ctx_r1.copiedField !== "record-" + item_r4.ID)("fa-check", ctx_r1.copiedField === "record-" + item_r4.ID);
+} }
+function DataContextComponent_Conditional_2_For_29_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 42);
+    i0.ɵɵelement(1, "i", 59);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "date");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div");
+} if (rf & 2) {
+    const item_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" Updated ", i0.ɵɵpipeBind2(3, 1, item_r4.__mj_UpdatedAt, "short"), " ");
+} }
+function DataContextComponent_Conditional_2_For_29_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 30)(1, "div", 31);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_For_29_Template_div_click_1_listener() { const item_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleItemExpansion(item_r4.ID)); });
+    i0.ɵɵelementStart(2, "div", 32)(3, "div", 33);
+    i0.ɵɵelement(4, "i");
+    i0.ɵɵelementStart(5, "span");
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(7, DataContextComponent_Conditional_2_For_29_Conditional_7_Template, 2, 1, "span", 34);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "button", 35);
+    i0.ɵɵelement(9, "i", 14);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(10, "div", 36);
+    i0.ɵɵtemplate(11, DataContextComponent_Conditional_2_For_29_Conditional_11_Template, 15, 6, "div", 37);
+    i0.ɵɵelementStart(12, "div", 38)(13, "div", 39);
+    i0.ɵɵtemplate(14, DataContextComponent_Conditional_2_For_29_Conditional_14_Template, 8, 1, "div", 40)(15, DataContextComponent_Conditional_2_For_29_Conditional_15_Template, 9, 7, "div", 40)(16, DataContextComponent_Conditional_2_For_29_Conditional_16_Template, 9, 7, "div", 40)(17, DataContextComponent_Conditional_2_For_29_Conditional_17_Template, 8, 5, "div", 40);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(18, "div", 41)(19, "span", 42);
+    i0.ɵɵelement(20, "i", 43);
+    i0.ɵɵtext(21);
+    i0.ɵɵpipe(22, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(23, DataContextComponent_Conditional_2_For_29_Conditional_23_Template, 4, 4, "span", 42);
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
+    const item_r4 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("expanded", ctx_r1.expandedItems[item_r4.ID]);
+    i0.ɵɵadvance(3);
+    i0.ɵɵstyleProp("background-color", ctx_r1.getTypeColor(item_r4.Type) + "20")("color", ctx_r1.getTypeColor(item_r4.Type));
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.getTypeIcon(item_r4.Type));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ID: ", ctx_r0.dataContextRecord.ID, " ");
+    i0.ɵɵtextInterpolate(item_r4.Type);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(item_r4.Description ? 7 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" Name: ", ctx_r0.dataContextRecord.Name, " ");
+    i0.ɵɵclassProp("fa-chevron-down", !ctx_r1.expandedItems[item_r4.ID])("fa-chevron-up", ctx_r1.expandedItems[item_r4.ID]);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" Description: ", ctx_r0.dataContextRecord.Description, " ");
+    i0.ɵɵconditional(item_r4.SQL ? 11 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(item_r4.EntityID ? 14 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(item_r4.ViewID ? 15 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(item_r4.QueryID ? 16 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(item_r4.RecordID ? 17 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" Created ", i0.ɵɵpipeBind2(22, 21, item_r4.__mj_CreatedAt, "short"), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(item_r4.__mj_UpdatedAt && item_r4.__mj_UpdatedAt !== item_r4.__mj_CreatedAt ? 23 : -1);
 } }
-function DataContextComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 0);
-    i0.ɵɵtemplate(1, DataContextComponent_Conditional_1_div_1_Template, 7, 3, "div", 2);
-    i0.ɵɵelementStart(2, "div", 3)(3, "b");
-    i0.ɵɵtext(4, "Items");
+function DataContextComponent_Conditional_2_Conditional_30_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 27);
+    i0.ɵɵelement(1, "i", 60);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No items found");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 4);
-    i0.ɵɵelement(6, "kendo-grid", 5);
+} }
+function DataContextComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 6)(2, "div", 7);
+    i0.ɵɵelement(3, "i", 8);
+    i0.ɵɵelementStart(4, "h2");
+    i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(6, DataContextComponent_Conditional_2_Conditional_6_Template, 2, 1, "p", 9);
+    i0.ɵɵelementStart(7, "div", 10)(8, "span", 11);
+    i0.ɵɵelement(9, "i", 12);
+    i0.ɵɵtext(10);
+    i0.ɵɵelementStart(11, "button", 13);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.copyToClipboard((ctx_r1.dataContextRecord == null ? null : ctx_r1.dataContextRecord.ID) || "", "context-id")); });
+    i0.ɵɵelement(12, "i", 14);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(13, "span", 11);
+    i0.ɵɵelement(14, "i", 15);
+    i0.ɵɵtext(15);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(16, "div", 16)(17, "button", 17);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.refresh()); });
+    i0.ɵɵelement(18, "i", 18);
+    i0.ɵɵtext(19, " Refresh ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(20, "button", 19);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_2_Template_button_click_20_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.exportToCSV()); });
+    i0.ɵɵelement(21, "i", 20);
+    i0.ɵɵtext(22, " Export ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵtemplate(23, DataContextComponent_Conditional_2_Conditional_23_Template, 3, 1, "div", 21);
+    i0.ɵɵelementStart(24, "div", 22)(25, "kendo-textbox", 23);
+    i0.ɵɵtwoWayListener("ngModelChange", function DataContextComponent_Conditional_2_Template_kendo_textbox_ngModelChange_25_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.searchTerm, $event) || (ctx_r1.searchTerm = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("ngModelChange", function DataContextComponent_Conditional_2_Template_kendo_textbox_ngModelChange_25_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearchChange()); });
+    i0.ɵɵtemplate(26, DataContextComponent_Conditional_2_ng_template_26_Template, 1, 0, "ng-template", 24);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(27, "div", 25);
+    i0.ɵɵrepeaterCreate(28, DataContextComponent_Conditional_2_For_29_Template, 24, 24, "div", 26, _forTrack0);
+    i0.ɵɵtemplate(30, DataContextComponent_Conditional_2_Conditional_30_Template, 4, 0, "div", 27);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r0.dataContextRecord);
+    const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(5);
-    i0.ɵɵproperty("kendoGridBinding", ctx_r0.dataContextItems)("pageSize", 100)("sortable", true)("loading", ctx_r0.showLoader)("resizable", true)("navigable", true);
+    i0.ɵɵtextInterpolate((ctx_r1.dataContextRecord == null ? null : ctx_r1.dataContextRecord.Name) || "Data Context");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.dataContextRecord && ctx_r1.dataContextRecord.Description ? 6 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ID: ", ctx_r1.dataContextRecord == null ? null : ctx_r1.dataContextRecord.ID, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("fa-copy", ctx_r1.copiedField !== "context-id")("fa-check", ctx_r1.copiedField === "context-id");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate2(" ", ctx_r1.itemCount, " ", ctx_r1.itemCount === 1 ? "item" : "items", " ");
+    i0.ɵɵadvance(8);
+    i0.ɵɵconditional(ctx_r1.errorMessage ? 23 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.searchTerm);
+    i0.ɵɵproperty("clearButton", true);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.filteredItems);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.filteredItems.length === 0 ? 30 : -1);
 } }
-function DataContextComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "kendo-loader", 1);
+function DataContextComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 61);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeSQLPreview()); });
+    i0.ɵɵelementStart(1, "div", 62);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_3_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r10); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(2, "div", 63)(3, "h3");
+    i0.ɵɵtext(4, "SQL Preview");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "button", 64);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeSQLPreview()); });
+    i0.ɵɵelement(6, "i", 65);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "div", 66)(8, "pre")(9, "code");
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(11, "div", 67)(12, "button", 68);
+    i0.ɵɵlistener("click", function DataContextComponent_Conditional_3_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.copyToClipboard(ctx_r1.previewSQL, "preview-sql")); });
+    i0.ɵɵelement(13, "i", 14);
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(10);
+    i0.ɵɵtextInterpolate(ctx_r1.previewSQL);
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassProp("fa-copy", ctx_r1.copiedField !== "preview-sql")("fa-check", ctx_r1.copiedField === "preview-sql");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.copiedField === "preview-sql" ? "Copied!" : "Copy SQL", " ");
 } }
 export class DataContextComponent {
     constructor() {
         this.Provider = null;
         this.dataContextItems = [];
         this.showLoader = false;
+        this.errorMessage = '';
+        this.searchTerm = '';
+        // UI state
+        this.showSQLPreview = false;
+        this.previewSQL = '';
+        this.copiedField = '';
+        this.expandedItems = {};
     }
     get ProviderToUse() {
         return this.Provider || Metadata.Provider;
     }
+    get filteredItems() {
+        if (!this.searchTerm) {
+            return this.dataContextItems;
+        }
+        const term = this.searchTerm.toLowerCase();
+        return this.dataContextItems.filter(item => {
+            var _a, _b, _c, _d;
+            return ((_a = item.Type) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(term)) ||
+                ((_b = item.SQL) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(term)) ||
+                (item.EntityID ? (_c = this.getEntityName(item.EntityID)) === null || _c === void 0 ? void 0 : _c.toLowerCase().includes(term) : false) ||
+                ((_d = item.Description) === null || _d === void 0 ? void 0 : _d.toLowerCase().includes(term));
+        });
+    }
+    get itemCount() {
+        return this.filteredItems.length;
+    }
     ngOnInit() {
         if (this.dataContextId) {
             this.showLoader = true;
@@ -68,40 +365,173 @@ export class DataContextComponent {
     }
     LoadDataContext(dataContextId) {
         return __awaiter(this, void 0, void 0, function* () {
-            if (dataContextId) {
-                const p = this.ProviderToUse;
-                this.dataContextRecord = yield p.GetEntityObject("Data Contexts", p.CurrentUser);
-                yield this.dataContextRecord.Load(dataContextId);
-                const rv = new RunView(p);
-                const response = yield rv.RunView({
-                    EntityName: "Data Context Items",
-                    ExtraFilter: `DataContextID='${dataContextId}'`,
-                    Fields: ["Type", "SQL", "ViewID", "QueryID", "EntityID", "RecordID"]
-                });
-                if (response.Success) {
-                    this.dataContextItems = response.Results;
-                    this.showLoader = false;
-                }
-                else {
-                    LogError(response.ErrorMessage);
-                    this.showLoader = false;
+            try {
+                if (dataContextId) {
+                    const p = this.ProviderToUse;
+                    this.dataContextRecord = yield p.GetEntityObject("Data Contexts", p.CurrentUser);
+                    yield this.dataContextRecord.Load(dataContextId);
+                    const rv = new RunView(p);
+                    const response = yield rv.RunView({
+                        EntityName: "Data Context Items",
+                        ExtraFilter: `DataContextID='${dataContextId}'`,
+                        OrderBy: '__mj_CreatedAt DESC',
+                        ResultType: 'entity_object'
+                    });
+                    if (response.Success) {
+                        this.dataContextItems = response.Results;
+                        this.showLoader = false;
+                    }
+                    else {
+                        this.errorMessage = response.ErrorMessage || 'Failed to load data context items';
+                        LogError(response.ErrorMessage);
+                        this.showLoader = false;
+                    }
                 }
             }
+            catch (error) {
+                this.errorMessage = 'An error occurred while loading the data context';
+                LogError(error);
+                this.showLoader = false;
+            }
         });
     }
+    getTypeIcon(type) {
+        const typeIcons = {
+            'sql': 'fa-solid fa-database',
+            'view': 'fa-solid fa-table',
+            'query': 'fa-solid fa-magnifying-glass',
+            'entity': 'fa-solid fa-cube',
+            'record': 'fa-solid fa-file'
+        };
+        return typeIcons[type === null || type === void 0 ? void 0 : type.toLowerCase()] || 'fa-solid fa-question';
+    }
+    getTypeColor(type) {
+        const typeColors = {
+            'sql': '#2196f3',
+            'view': '#4caf50',
+            'query': '#ff9800',
+            'entity': '#9c27b0',
+            'record': '#f44336'
+        };
+        return typeColors[type === null || type === void 0 ? void 0 : type.toLowerCase()] || '#757575';
+    }
+    getEntityName(entityId) {
+        var _a;
+        if (!entityId)
+            return undefined;
+        const md = new Metadata();
+        return (_a = md.Entities.find(e => e.ID === entityId)) === null || _a === void 0 ? void 0 : _a.Name;
+    }
+    getViewName(viewId) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                const p = this.ProviderToUse;
+                const view = yield p.GetEntityObject("Views", p.CurrentUser);
+                yield view.Load(viewId);
+                return view.Get('Name');
+            }
+            catch (_a) {
+                return undefined;
+            }
+        });
+    }
+    getQueryName(queryId) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                const p = this.ProviderToUse;
+                const query = yield p.GetEntityObject("Queries", p.CurrentUser);
+                yield query.Load(queryId);
+                return query.Get('Name');
+            }
+            catch (_a) {
+                return undefined;
+            }
+        });
+    }
+    onSearchChange() {
+        // Reset expanded items when searching
+        this.expandedItems = {};
+    }
+    toggleItemExpansion(itemId) {
+        this.expandedItems[itemId] = !this.expandedItems[itemId];
+    }
+    copyToClipboard(text, fieldName) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                yield navigator.clipboard.writeText(text);
+                this.copiedField = fieldName;
+                setTimeout(() => {
+                    this.copiedField = '';
+                }, 2000);
+            }
+            catch (err) {
+                LogError(`Failed to copy to clipboard: ${err}`);
+            }
+        });
+    }
+    previewSQLCode(sql) {
+        this.previewSQL = sql;
+        this.showSQLPreview = true;
+    }
+    closeSQLPreview() {
+        this.showSQLPreview = false;
+        this.previewSQL = '';
+    }
+    navigateToEntity(entityId) {
+        // This would be implemented based on your navigation system
+        console.log('Navigate to entity:', entityId);
+    }
+    navigateToView(viewId) {
+        // This would be implemented based on your navigation system
+        console.log('Navigate to view:', viewId);
+    }
+    navigateToQuery(queryId) {
+        // This would be implemented based on your navigation system
+        console.log('Navigate to query:', queryId);
+    }
+    refresh() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.showLoader = true;
+            yield this.LoadDataContext(this.dataContextId);
+        });
+    }
+    exportToCSV() {
+        var _a;
+        // Implement CSV export functionality
+        const headers = ['Type', 'SQL', 'View', 'Query', 'Entity', 'Record ID', 'Description'];
+        const rows = this.filteredItems.map(item => [
+            item.Type,
+            item.SQL,
+            item.ViewID,
+            item.QueryID,
+            this.getEntityName(item.EntityID) || item.EntityID,
+            item.RecordID,
+            item.Description || ''
+        ]);
+        const csv = [headers, ...rows].map(row => row.map(cell => `"${cell}"`).join(',')).join('\n');
+        const blob = new Blob([csv], { type: 'text/csv' });
+        const url = window.URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = `data-context-${((_a = this.dataContextRecord) === null || _a === void 0 ? void 0 : _a.Name) || this.dataContextId}.csv`;
+        a.click();
+        window.URL.revokeObjectURL(url);
+    }
 }
 DataContextComponent.ɵfac = function DataContextComponent_Factory(t) { return new (t || DataContextComponent)(); };
-DataContextComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataContextComponent, selectors: [["mj-data-context"]], inputs: { dataContextId: "dataContextId", Provider: "Provider" }, decls: 3, vars: 1, consts: [[1, "k-d-flex", "k-flex-col", "k-justify-content-between", "k-h-full"], ["type", "converging-spinner"], [4, "ngIf"], [2, "margin-top", "10px"], [1, "kendo-grid-container"], ["scrollable", "virtual", 3, "kendoGridBinding", "pageSize", "sortable", "loading", "resizable", "navigable"]], template: function DataContextComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "div");
-        i0.ɵɵtemplate(1, DataContextComponent_Conditional_1_Template, 7, 7, "div", 0)(2, DataContextComponent_Conditional_2_Template, 1, 0, "kendo-loader", 1);
+DataContextComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataContextComponent, selectors: [["mj-data-context"]], inputs: { dataContextId: "dataContextId", Provider: "Provider" }, decls: 4, vars: 2, consts: [[1, "data-context-viewer"], [1, "loading-container"], [1, "sql-preview-overlay"], ["type", "converging-spinner", "size", "large"], [1, "loading-text"], [1, "data-context-header"], [1, "header-info"], [1, "header-title"], [1, "fa-solid", "fa-layer-group", "header-icon"], [1, "header-description"], [1, "header-meta"], [1, "meta-item"], [1, "fa-solid", "fa-fingerprint"], ["title", "Copy ID", 1, "copy-btn", 3, "click"], [1, "fa-solid"], [1, "fa-solid", "fa-list-ol"], [1, "header-actions"], ["kendoButton", "", "look", "flat", "title", "Refresh", 3, "click"], [1, "fa-solid", "fa-rotate"], ["kendoButton", "", "look", "flat", "title", "Export to CSV", 3, "click"], [1, "fa-solid", "fa-download"], [1, "error-message"], [1, "search-container"], ["placeholder", "Search items by type, SQL, entity name, or description...", 1, "search-input", 3, "ngModelChange", "ngModel", "clearButton"], ["kendoTextBoxPrefixTemplate", ""], [1, "items-container"], [1, "data-context-card", 3, "expanded"], [1, "no-items"], [1, "fa-solid", "fa-circle-exclamation"], [1, "fa-solid", "fa-magnifying-glass", "search-icon"], [1, "data-context-card"], [1, "card-header", 3, "click"], [1, "card-header-left"], [1, "type-badge"], [1, "card-description"], [1, "expand-btn"], [1, "card-content"], [1, "sql-section"], [1, "metadata-section"], [1, "metadata-grid"], [1, "metadata-item"], [1, "card-footer"], [1, "timestamp"], [1, "fa-solid", "fa-clock"], [1, "section-header"], [1, "fa-solid", "fa-code"], [1, "sql-actions"], ["title", "Copy SQL", 1, "action-btn", 3, "click"], ["title", "Expand", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-expand"], [1, "sql-code"], [1, "metadata-label"], [1, "metadata-value"], ["title", "View entity", 1, "link-btn", 3, "click"], [1, "fa-solid", "fa-arrow-up-right-from-square"], [3, "title"], ["title", "View details", 1, "link-btn", 3, "click"], ["title", "View query", 1, "link-btn", 3, "click"], ["title", "Copy", 1, "link-btn", 3, "click"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-inbox"], [1, "sql-preview-overlay", 3, "click"], [1, "sql-preview-dialog", 3, "click"], [1, "sql-preview-header"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "sql-preview-content"], [1, "sql-preview-actions"], ["kendoButton", "", 3, "click"]], template: function DataContextComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵtemplate(1, DataContextComponent_Conditional_1_Template, 4, 0, "div", 1)(2, DataContextComponent_Conditional_2_Template, 31, 13)(3, DataContextComponent_Conditional_3_Template, 15, 6, "div", 2);
         i0.ɵɵelementEnd();
     } if (rf & 2) {
         i0.ɵɵadvance();
-        i0.ɵɵconditional(!ctx.showLoader ? 1 : 2);
-    } }, dependencies: [i1.NgIf, i2.GridComponent, i2.DataBindingDirective, i3.LoaderComponent] });
+        i0.ɵɵconditional(ctx.showLoader ? 1 : 2);
+        i0.ɵɵadvance(2);
+        i0.ɵɵconditional(ctx.showSQLPreview ? 3 : -1);
+    } }, dependencies: [i1.NgControlStatus, i1.NgModel, i2.ButtonComponent, i3.LoaderComponent, i4.TextBoxComponent, i4.TextBoxPrefixTemplateDirective, i5.SlicePipe, i5.DatePipe], styles: [".data-context-viewer[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    background-color: #f8f9fa;\n    border-radius: 8px;\n    overflow: hidden;\n    min-height: 0;\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 100%;\n    min-height: 400px;\n}\n\n.loading-text[_ngcontent-%COMP%] {\n    margin-top: 16px;\n    color: #656565;\n    font-size: 14px;\n}\n\n\n\n.data-context-header[_ngcontent-%COMP%] {\n    background-color: #ffffff;\n    padding: 24px;\n    border-bottom: 1px solid #e2e8f0;\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    gap: 24px;\n    flex-shrink: 0;\n}\n\n.header-info[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.header-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-bottom: 8px;\n}\n\n.header-icon[_ngcontent-%COMP%] {\n    font-size: 24px;\n    color: #2196f3;\n}\n\n.header-title[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 24px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.header-description[_ngcontent-%COMP%] {\n    margin: 8px 0 16px 0;\n    color: #656565;\n    font-size: 14px;\n    line-height: 1.5;\n}\n\n.header-meta[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 24px;\n    flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: #656565;\n}\n\n.meta-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #9e9e9e;\n}\n\n.copy-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 4px;\n    cursor: pointer;\n    color: #656565;\n    transition: color 0.2s;\n    margin-left: 4px;\n}\n\n.copy-btn[_ngcontent-%COMP%]:hover {\n    color: #2196f3;\n}\n\n.copy-btn[_ngcontent-%COMP%]   .fa-check[_ngcontent-%COMP%] {\n    color: #4caf50;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n\n\n.error-message[_ngcontent-%COMP%] {\n    background-color: #fee;\n    color: #c62828;\n    padding: 12px 16px;\n    margin: 16px 24px;\n    border-radius: 4px;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n}\n\n.error-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n}\n\n\n\n.search-container[_ngcontent-%COMP%] {\n    padding: 16px 24px;\n    background-color: #ffffff;\n    border-bottom: 1px solid #e2e8f0;\n    flex-shrink: 0;\n}\n\n.search-input[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.search-icon[_ngcontent-%COMP%] {\n    color: #9e9e9e;\n    margin-right: 8px;\n}\n\n\n\n.items-container[_ngcontent-%COMP%] {\n    height: 100%;\n    padding: 24px;\n    overflow-y: auto;\n    overflow-x: hidden;\n    min-height: 0;\n}\n\n\n\n.data-context-card[_ngcontent-%COMP%] {\n    background-color: #ffffff;\n    border-radius: 8px;\n    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n    margin-bottom: 16px;\n    transition: all 0.3s ease;\n    overflow: hidden;\n}\n\n.data-context-card[_ngcontent-%COMP%]:hover {\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n}\n\n.data-context-card.expanded[_ngcontent-%COMP%] {\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);\n}\n\n\n\n.card-header[_ngcontent-%COMP%] {\n    padding: 20px 24px;\n    cursor: pointer;\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    transition: background-color 0.2s;\n    gap: 16px;\n}\n\n.card-header[_ngcontent-%COMP%]:hover {\n    background-color: #f8f9fa;\n}\n\n.card-header-left[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    flex: 1;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 6px 12px;\n    border-radius: 20px;\n    font-size: 14px;\n    font-weight: 500;\n    text-transform: uppercase;\n    flex-shrink: 0;\n}\n\n.type-badge[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n}\n\n.card-description[_ngcontent-%COMP%] {\n    color: #656565;\n    font-size: 14px;\n    flex: 1;\n    line-height: 1.4;\n    word-wrap: break-word;\n    overflow-wrap: break-word;\n}\n\n.expand-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 8px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    font-size: 16px;\n    flex-shrink: 0;\n    margin-top: -4px; \n\n}\n\n.expand-btn[_ngcontent-%COMP%]:hover {\n    color: #2196f3;\n}\n\n\n\n.card-content[_ngcontent-%COMP%] {\n    max-height: 0;\n    overflow: hidden;\n    transition: max-height 0.3s ease;\n}\n\n.data-context-card.expanded[_ngcontent-%COMP%]   .card-content[_ngcontent-%COMP%] {\n    max-height: 2000px;\n}\n\n\n\n.sql-section[_ngcontent-%COMP%] {\n    padding: 0 24px 20px;\n}\n\n.section-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 500;\n    color: #333333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.section-header[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: #656565;\n}\n\n.sql-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n    background-color: #f5f5f5;\n    border: 1px solid #e0e0e0;\n    padding: 6px 12px;\n    border-radius: 4px;\n    cursor: pointer;\n    font-size: 13px;\n    color: #333333;\n    transition: all 0.2s;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n    background-color: #e3f2fd;\n    border-color: #2196f3;\n    color: #2196f3;\n}\n\n.action-btn[_ngcontent-%COMP%]   .fa-check[_ngcontent-%COMP%] {\n    color: #4caf50;\n}\n\n.sql-code[_ngcontent-%COMP%] {\n    background-color: #f5f5f5;\n    padding: 16px;\n    border-radius: 6px;\n    margin: 0;\n    overflow-x: auto;\n    border: 1px solid #e0e0e0;\n}\n\n.sql-code[_ngcontent-%COMP%]   code[_ngcontent-%COMP%] {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 14px;\n    line-height: 1.6;\n    color: #333333;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n}\n\n\n\n.metadata-section[_ngcontent-%COMP%] {\n    padding: 0 24px 20px;\n}\n\n.metadata-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 16px;\n}\n\n.metadata-item[_ngcontent-%COMP%] {\n    background-color: #f8f9fa;\n    padding: 12px;\n    border-radius: 6px;\n    border: 1px solid #e2e8f0;\n}\n\n.metadata-label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    font-weight: 500;\n    color: #656565;\n    text-transform: uppercase;\n    margin-bottom: 6px;\n}\n\n.metadata-value[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    font-size: 14px;\n    color: #333333;\n}\n\n.metadata-value[_ngcontent-%COMP%]   code[_ngcontent-%COMP%] {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 13px;\n    background-color: #ffffff;\n    padding: 2px 6px;\n    border-radius: 3px;\n    border: 1px solid #e0e0e0;\n}\n\n.link-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 4px 6px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    border-radius: 3px;\n    font-size: 13px;\n}\n\n.link-btn[_ngcontent-%COMP%]:hover {\n    color: #2196f3;\n    background-color: #e3f2fd;\n}\n\n.link-btn[_ngcontent-%COMP%]   .fa-check[_ngcontent-%COMP%] {\n    color: #4caf50;\n}\n\n\n\n.card-footer[_ngcontent-%COMP%] {\n    padding: 16px 24px;\n    background-color: #f8f9fa;\n    border-top: 1px solid #e2e8f0;\n    display: flex;\n    gap: 20px;\n    font-size: 12px;\n    color: #656565;\n}\n\n.timestamp[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.timestamp[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 11px;\n}\n\n\n\n.no-items[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 80px 20px;\n    color: #9e9e9e;\n}\n\n.no-items[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 48px;\n    margin-bottom: 16px;\n}\n\n.no-items[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 16px;\n    margin: 0;\n}\n\n\n\n.sql-preview-overlay[_ngcontent-%COMP%] {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: rgba(0, 0, 0, 0.5);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n}\n\n.sql-preview-dialog[_ngcontent-%COMP%] {\n    background-color: #ffffff;\n    border-radius: 8px;\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);\n    width: 90%;\n    max-width: 1000px;\n    max-height: 80vh;\n    display: flex;\n    flex-direction: column;\n}\n\n.sql-preview-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-bottom: 1px solid #e2e8f0;\n}\n\n.sql-preview-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 18px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 8px;\n    cursor: pointer;\n    color: #656565;\n    transition: color 0.2s;\n    font-size: 18px;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n    color: #333333;\n}\n\n.sql-preview-content[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow: auto;\n    padding: 24px;\n    background-color: #f5f5f5;\n}\n\n.sql-preview-content[_ngcontent-%COMP%]   pre[_ngcontent-%COMP%] {\n    margin: 0;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n}\n\n.sql-preview-content[_ngcontent-%COMP%]   code[_ngcontent-%COMP%] {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 16px;\n    color: #333333;\n    line-height: 1.6;\n}\n\n.sql-preview-actions[_ngcontent-%COMP%] {\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    display: flex;\n    justify-content: flex-end;\n}\n\n\n\n@media (max-width: 768px) {\n    .data-context-header[_ngcontent-%COMP%] {\n        flex-direction: column;\n        gap: 16px;\n    }\n    \n    .header-actions[_ngcontent-%COMP%] {\n        width: 100%;\n        justify-content: flex-start;\n    }\n    \n    .items-container[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n    \n    .card-header[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n    \n    .sql-section[_ngcontent-%COMP%], \n   .metadata-section[_ngcontent-%COMP%] {\n        padding: 0 16px 16px;\n    }\n    \n    .metadata-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n    \n    .sql-preview-dialog[_ngcontent-%COMP%] {\n        width: 95%;\n        margin: 16px;\n    }\n}"] });
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DataContextComponent, [{
         type: Component,
-        args: [{ selector: 'mj-data-context', template: "<div>\n    @if (!showLoader) {\n        <div class=\"k-d-flex k-flex-col k-justify-content-between k-h-full\">\n            <div *ngIf=\"dataContextRecord\">\n                <div>\n                    ID: {{dataContextRecord.ID}}\n                </div>\n                <div>\n                    Name: {{dataContextRecord.Name}}\n                </div>\n                <div>\n                    Description: {{dataContextRecord.Description}}\n                </div>\n            </div>\n            <div style=\"margin-top: 10px;\">\n                <b>Items</b>\n            </div>\n            <div class=\"kendo-grid-container\">\n                <kendo-grid \n                    [kendoGridBinding]=\"dataContextItems\" \n                    scrollable=\"virtual\" \n                    [pageSize]=\"100\" \n                    [sortable]=\"true\"\n                    [loading]=\"showLoader\" \n                    [resizable]=\"true\" \n                    [navigable]=\"true\"\n                >\n                </kendo-grid>\n            </div>\n        </div>    \n    }\n    @else {\n        <kendo-loader type=\"converging-spinner\" ></kendo-loader>\n    }\n</div>" }]
+        args: [{ selector: 'mj-data-context', template: "<div class=\"data-context-viewer\">\n    @if (showLoader) {\n        <div class=\"loading-container\">\n            <kendo-loader type=\"converging-spinner\" size=\"large\"></kendo-loader>\n            <p class=\"loading-text\">Loading data context...</p>\n        </div>\n    } @else {\n        <!-- Header Section -->\n        <div class=\"data-context-header\">\n            <div class=\"header-info\">\n                <div class=\"header-title\">\n                    <i class=\"fa-solid fa-layer-group header-icon\"></i>\n                    <h2>{{ dataContextRecord?.Name || 'Data Context' }}</h2>\n                </div>\n                @if (dataContextRecord && dataContextRecord.Description) {\n                    <p class=\"header-description\">{{ dataContextRecord.Description }}</p>\n                }\n                <div class=\"header-meta\">\n                    <span class=\"meta-item\">\n                        <i class=\"fa-solid fa-fingerprint\"></i>\n                        ID: {{ dataContextRecord?.ID }}\n                        <button class=\"copy-btn\" (click)=\"copyToClipboard(dataContextRecord?.ID || '', 'context-id')\" title=\"Copy ID\">\n                            <i class=\"fa-solid\" [class.fa-copy]=\"copiedField !== 'context-id'\" [class.fa-check]=\"copiedField === 'context-id'\"></i>\n                        </button>\n                    </span>\n                    <span class=\"meta-item\">\n                        <i class=\"fa-solid fa-list-ol\"></i>\n                        {{ itemCount }} {{ itemCount === 1 ? 'item' : 'items' }}\n                    </span>\n                </div>\n            </div>\n            <div class=\"header-actions\">\n                <button kendoButton look=\"flat\" (click)=\"refresh()\" title=\"Refresh\">\n                    <i class=\"fa-solid fa-rotate\"></i>\n                    Refresh\n                </button>\n                <button kendoButton look=\"flat\" (click)=\"exportToCSV()\" title=\"Export to CSV\">\n                    <i class=\"fa-solid fa-download\"></i>\n                    Export\n                </button>\n            </div>\n        </div>\n\n        @if (errorMessage) {\n            <div class=\"error-message\">\n                <i class=\"fa-solid fa-circle-exclamation\"></i>\n                {{ errorMessage }}\n            </div>\n        }\n\n        <!-- Search Bar -->\n        <div class=\"search-container\">\n            <kendo-textbox \n                [(ngModel)]=\"searchTerm\" \n                (ngModelChange)=\"onSearchChange()\"\n                placeholder=\"Search items by type, SQL, entity name, or description...\"\n                [clearButton]=\"true\"\n                class=\"search-input\">\n                <ng-template kendoTextBoxPrefixTemplate>\n                    <i class=\"fa-solid fa-magnifying-glass search-icon\"></i>\n                </ng-template>\n            </kendo-textbox>\n        </div>\n\n        <!-- Data Context Items as Cards -->\n        <div class=\"items-container\">\n            @for (item of filteredItems; track item.ID; let i = $index) {\n                <div class=\"data-context-card\" [class.expanded]=\"expandedItems[item.ID]\">\n                    <!-- Card Header -->\n                    <div class=\"card-header\" (click)=\"toggleItemExpansion(item.ID)\">\n                        <div class=\"card-header-left\">\n                            <div class=\"type-badge\" [style.background-color]=\"getTypeColor(item.Type) + '20'\" [style.color]=\"getTypeColor(item.Type)\">\n                                <i [class]=\"getTypeIcon(item.Type)\"></i>\n                                <span>{{ item.Type }}</span>\n                            </div>\n                            @if (item.Description) {\n                                <span class=\"card-description\">{{ item.Description }}</span>\n                            }\n                        </div>\n                        <button class=\"expand-btn\">\n                            <i class=\"fa-solid\" [class.fa-chevron-down]=\"!expandedItems[item.ID]\" [class.fa-chevron-up]=\"expandedItems[item.ID]\"></i>\n                        </button>\n                    </div>\n\n                    <!-- Card Content -->\n                    <div class=\"card-content\">\n                        <!-- SQL Section -->\n                        @if (item.SQL) {\n                            <div class=\"sql-section\">\n                                <div class=\"section-header\">\n                                    <h4><i class=\"fa-solid fa-code\"></i> SQL Query</h4>\n                                    <div class=\"sql-actions\">\n                                        <button class=\"action-btn\" (click)=\"copyToClipboard(item.SQL, 'sql-' + item.ID)\" title=\"Copy SQL\">\n                                            <i class=\"fa-solid\" [class.fa-copy]=\"copiedField !== 'sql-' + item.ID\" [class.fa-check]=\"copiedField === 'sql-' + item.ID\"></i>\n                                            {{ copiedField === 'sql-' + item.ID ? 'Copied!' : 'Copy' }}\n                                        </button>\n                                        <button class=\"action-btn\" (click)=\"previewSQLCode(item.SQL)\" title=\"Expand\">\n                                            <i class=\"fa-solid fa-expand\"></i>\n                                            Expand\n                                        </button>\n                                    </div>\n                                </div>\n                                <pre class=\"sql-code\"><code>{{ item.SQL }}</code></pre>\n                            </div>\n                        }\n\n                        <!-- Metadata Section -->\n                        <div class=\"metadata-section\">\n                            <div class=\"metadata-grid\">\n                                @if (item.EntityID) {\n                                    <div class=\"metadata-item\">\n                                        <span class=\"metadata-label\">Entity</span>\n                                        <div class=\"metadata-value\">\n                                            <span>{{ getEntityName(item.EntityID) || 'Unknown' }}</span>\n                                            <button class=\"link-btn\" (click)=\"navigateToEntity(item.EntityID)\" title=\"View entity\">\n                                                <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n                                            </button>\n                                        </div>\n                                    </div>\n                                }\n                                @if (item.ViewID) {\n                                    <div class=\"metadata-item\">\n                                        <span class=\"metadata-label\">View</span>\n                                        <div class=\"metadata-value\">\n                                            <span title=\"{{ item.ViewID }}\">{{ item.ViewID | slice:0:20 }}{{ item.ViewID.length > 20 ? '...' : '' }}</span>\n                                            <button class=\"link-btn\" (click)=\"navigateToView(item.ViewID)\" title=\"View details\">\n                                                <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n                                            </button>\n                                        </div>\n                                    </div>\n                                }\n                                @if (item.QueryID) {\n                                    <div class=\"metadata-item\">\n                                        <span class=\"metadata-label\">Query</span>\n                                        <div class=\"metadata-value\">\n                                            <span title=\"{{ item.QueryID }}\">{{ item.QueryID | slice:0:20 }}{{ item.QueryID.length > 20 ? '...' : '' }}</span>\n                                            <button class=\"link-btn\" (click)=\"navigateToQuery(item.QueryID)\" title=\"View query\">\n                                                <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n                                            </button>\n                                        </div>\n                                    </div>\n                                }\n                                @if (item.RecordID) {\n                                    <div class=\"metadata-item\">\n                                        <span class=\"metadata-label\">Record ID</span>\n                                        <div class=\"metadata-value\">\n                                            <code>{{ item.RecordID }}</code>\n                                            <button class=\"link-btn\" (click)=\"copyToClipboard(item.RecordID, 'record-' + item.ID)\" title=\"Copy\">\n                                                <i class=\"fa-solid\" [class.fa-copy]=\"copiedField !== 'record-' + item.ID\" [class.fa-check]=\"copiedField === 'record-' + item.ID\"></i>\n                                            </button>\n                                        </div>\n                                    </div>\n                                }\n                            </div>\n                        </div>\n\n                        <!-- Footer -->\n                        <div class=\"card-footer\">\n                            <span class=\"timestamp\">\n                                <i class=\"fa-solid fa-clock\"></i>\n                                Created {{ item.__mj_CreatedAt | date:'short' }}\n                            </span>\n                            @if (item.__mj_UpdatedAt && item.__mj_UpdatedAt !== item.__mj_CreatedAt) {\n                                <span class=\"timestamp\">\n                                    <i class=\"fa-solid fa-pen\"></i>\n                                    Updated {{ item.__mj_UpdatedAt | date:'short' }}\n                                </span>\n                            }\n                        </div>\n                    </div>\n                </div>\n            }\n\n            @if (filteredItems.length === 0) {\n                <div class=\"no-items\">\n                    <i class=\"fa-solid fa-inbox\"></i>\n                    <p>No items found</p>\n                </div>\n            }\n        </div>\n    }\n\n    <!-- SQL Preview Dialog -->\n    @if (showSQLPreview) {\n        <div class=\"sql-preview-overlay\" (click)=\"closeSQLPreview()\">\n            <div class=\"sql-preview-dialog\" (click)=\"$event.stopPropagation()\">\n                <div class=\"sql-preview-header\">\n                    <h3>SQL Preview</h3>\n                    <button class=\"close-btn\" (click)=\"closeSQLPreview()\">\n                        <i class=\"fa-solid fa-xmark\"></i>\n                    </button>\n                </div>\n                <div class=\"sql-preview-content\">\n                    <pre><code>{{ previewSQL }}</code></pre>\n                </div>\n                <div class=\"sql-preview-actions\">\n                    <button kendoButton (click)=\"copyToClipboard(previewSQL, 'preview-sql')\">\n                        <i class=\"fa-solid\" [class.fa-copy]=\"copiedField !== 'preview-sql'\" [class.fa-check]=\"copiedField === 'preview-sql'\"></i>\n                        {{ copiedField === 'preview-sql' ? 'Copied!' : 'Copy SQL' }}\n                    </button>\n                </div>\n            </div>\n        </div>\n    }\n</div>", styles: [".data-context-viewer {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    background-color: #f8f9fa;\n    border-radius: 8px;\n    overflow: hidden;\n    min-height: 0;\n}\n\n/* Loading State */\n.loading-container {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 100%;\n    min-height: 400px;\n}\n\n.loading-text {\n    margin-top: 16px;\n    color: #656565;\n    font-size: 14px;\n}\n\n/* Header Section */\n.data-context-header {\n    background-color: #ffffff;\n    padding: 24px;\n    border-bottom: 1px solid #e2e8f0;\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    gap: 24px;\n    flex-shrink: 0;\n}\n\n.header-info {\n    flex: 1;\n}\n\n.header-title {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-bottom: 8px;\n}\n\n.header-icon {\n    font-size: 24px;\n    color: #2196f3;\n}\n\n.header-title h2 {\n    margin: 0;\n    font-size: 24px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.header-description {\n    margin: 8px 0 16px 0;\n    color: #656565;\n    font-size: 14px;\n    line-height: 1.5;\n}\n\n.header-meta {\n    display: flex;\n    gap: 24px;\n    flex-wrap: wrap;\n}\n\n.meta-item {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: #656565;\n}\n\n.meta-item i {\n    font-size: 12px;\n    color: #9e9e9e;\n}\n\n.copy-btn {\n    background: none;\n    border: none;\n    padding: 4px;\n    cursor: pointer;\n    color: #656565;\n    transition: color 0.2s;\n    margin-left: 4px;\n}\n\n.copy-btn:hover {\n    color: #2196f3;\n}\n\n.copy-btn .fa-check {\n    color: #4caf50;\n}\n\n.header-actions {\n    display: flex;\n    gap: 8px;\n}\n\n/* Error Message */\n.error-message {\n    background-color: #fee;\n    color: #c62828;\n    padding: 12px 16px;\n    margin: 16px 24px;\n    border-radius: 4px;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n}\n\n.error-message i {\n    font-size: 16px;\n}\n\n/* Search Container */\n.search-container {\n    padding: 16px 24px;\n    background-color: #ffffff;\n    border-bottom: 1px solid #e2e8f0;\n    flex-shrink: 0;\n}\n\n.search-input {\n    width: 100%;\n}\n\n.search-icon {\n    color: #9e9e9e;\n    margin-right: 8px;\n}\n\n/* Items Container */\n.items-container {\n    height: 100%;\n    padding: 24px;\n    overflow-y: auto;\n    overflow-x: hidden;\n    min-height: 0;\n}\n\n/* Data Context Card */\n.data-context-card {\n    background-color: #ffffff;\n    border-radius: 8px;\n    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n    margin-bottom: 16px;\n    transition: all 0.3s ease;\n    overflow: hidden;\n}\n\n.data-context-card:hover {\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n}\n\n.data-context-card.expanded {\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);\n}\n\n/* Card Header */\n.card-header {\n    padding: 20px 24px;\n    cursor: pointer;\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    transition: background-color 0.2s;\n    gap: 16px;\n}\n\n.card-header:hover {\n    background-color: #f8f9fa;\n}\n\n.card-header-left {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    flex: 1;\n}\n\n.type-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 6px 12px;\n    border-radius: 20px;\n    font-size: 14px;\n    font-weight: 500;\n    text-transform: uppercase;\n    flex-shrink: 0;\n}\n\n.type-badge i {\n    font-size: 14px;\n}\n\n.card-description {\n    color: #656565;\n    font-size: 14px;\n    flex: 1;\n    line-height: 1.4;\n    word-wrap: break-word;\n    overflow-wrap: break-word;\n}\n\n.expand-btn {\n    background: none;\n    border: none;\n    padding: 8px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    font-size: 16px;\n    flex-shrink: 0;\n    margin-top: -4px; /* Align with top of content */\n}\n\n.expand-btn:hover {\n    color: #2196f3;\n}\n\n/* Card Content */\n.card-content {\n    max-height: 0;\n    overflow: hidden;\n    transition: max-height 0.3s ease;\n}\n\n.data-context-card.expanded .card-content {\n    max-height: 2000px;\n}\n\n/* SQL Section */\n.sql-section {\n    padding: 0 24px 20px;\n}\n\n.section-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.section-header h4 {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 500;\n    color: #333333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.section-header h4 i {\n    font-size: 14px;\n    color: #656565;\n}\n\n.sql-actions {\n    display: flex;\n    gap: 8px;\n}\n\n.action-btn {\n    background-color: #f5f5f5;\n    border: 1px solid #e0e0e0;\n    padding: 6px 12px;\n    border-radius: 4px;\n    cursor: pointer;\n    font-size: 13px;\n    color: #333333;\n    transition: all 0.2s;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.action-btn:hover {\n    background-color: #e3f2fd;\n    border-color: #2196f3;\n    color: #2196f3;\n}\n\n.action-btn .fa-check {\n    color: #4caf50;\n}\n\n.sql-code {\n    background-color: #f5f5f5;\n    padding: 16px;\n    border-radius: 6px;\n    margin: 0;\n    overflow-x: auto;\n    border: 1px solid #e0e0e0;\n}\n\n.sql-code code {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 14px;\n    line-height: 1.6;\n    color: #333333;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n}\n\n/* Metadata Section */\n.metadata-section {\n    padding: 0 24px 20px;\n}\n\n.metadata-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 16px;\n}\n\n.metadata-item {\n    background-color: #f8f9fa;\n    padding: 12px;\n    border-radius: 6px;\n    border: 1px solid #e2e8f0;\n}\n\n.metadata-label {\n    display: block;\n    font-size: 12px;\n    font-weight: 500;\n    color: #656565;\n    text-transform: uppercase;\n    margin-bottom: 6px;\n}\n\n.metadata-value {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    font-size: 14px;\n    color: #333333;\n}\n\n.metadata-value code {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 13px;\n    background-color: #ffffff;\n    padding: 2px 6px;\n    border-radius: 3px;\n    border: 1px solid #e0e0e0;\n}\n\n.link-btn {\n    background: none;\n    border: none;\n    padding: 4px 6px;\n    cursor: pointer;\n    color: #656565;\n    transition: all 0.2s;\n    border-radius: 3px;\n    font-size: 13px;\n}\n\n.link-btn:hover {\n    color: #2196f3;\n    background-color: #e3f2fd;\n}\n\n.link-btn .fa-check {\n    color: #4caf50;\n}\n\n/* Card Footer */\n.card-footer {\n    padding: 16px 24px;\n    background-color: #f8f9fa;\n    border-top: 1px solid #e2e8f0;\n    display: flex;\n    gap: 20px;\n    font-size: 12px;\n    color: #656565;\n}\n\n.timestamp {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.timestamp i {\n    font-size: 11px;\n}\n\n/* No Items */\n.no-items {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 80px 20px;\n    color: #9e9e9e;\n}\n\n.no-items i {\n    font-size: 48px;\n    margin-bottom: 16px;\n}\n\n.no-items p {\n    font-size: 16px;\n    margin: 0;\n}\n\n/* SQL Preview Modal */\n.sql-preview-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: rgba(0, 0, 0, 0.5);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n}\n\n.sql-preview-dialog {\n    background-color: #ffffff;\n    border-radius: 8px;\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);\n    width: 90%;\n    max-width: 1000px;\n    max-height: 80vh;\n    display: flex;\n    flex-direction: column;\n}\n\n.sql-preview-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-bottom: 1px solid #e2e8f0;\n}\n\n.sql-preview-header h3 {\n    margin: 0;\n    font-size: 18px;\n    font-weight: 500;\n    color: #333333;\n}\n\n.close-btn {\n    background: none;\n    border: none;\n    padding: 8px;\n    cursor: pointer;\n    color: #656565;\n    transition: color 0.2s;\n    font-size: 18px;\n}\n\n.close-btn:hover {\n    color: #333333;\n}\n\n.sql-preview-content {\n    flex: 1;\n    overflow: auto;\n    padding: 24px;\n    background-color: #f5f5f5;\n}\n\n.sql-preview-content pre {\n    margin: 0;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n}\n\n.sql-preview-content code {\n    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n    font-size: 16px;\n    color: #333333;\n    line-height: 1.6;\n}\n\n.sql-preview-actions {\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    display: flex;\n    justify-content: flex-end;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n    .data-context-header {\n        flex-direction: column;\n        gap: 16px;\n    }\n    \n    .header-actions {\n        width: 100%;\n        justify-content: flex-start;\n    }\n    \n    .items-container {\n        padding: 16px;\n    }\n    \n    .card-header {\n        padding: 16px;\n    }\n    \n    .sql-section,\n    .metadata-section {\n        padding: 0 16px 16px;\n    }\n    \n    .metadata-grid {\n        grid-template-columns: 1fr;\n    }\n    \n    .sql-preview-dialog {\n        width: 95%;\n        margin: 16px;\n    }\n}"] }]
     }], null, { dataContextId: [{
             type: Input
         }], Provider: [{

package/dist/lib/ng-data-context.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"ng-data-context.component.js","sourceRoot":"","sources":["../../src/lib/ng-data-context.component.ts","../../src/lib/ng-data-context.component.html"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AACzD,OAAO,EAAuC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;;;;;;ICGxF,AADJ,2BAA+B,UACtB;IACD,YACJ;IAAA,iBAAM;IACN,2BAAK;IACD,YACJ;IAAA,iBAAM;IACN,2BAAK;IACD,YACJ;IACJ,AADI,iBAAM,EACJ;;;IARE,eACJ;IADI,gEACJ;IAEI,eACJ;IADI,oEACJ;IAEI,eACJ;IADI,kFACJ;;;IAVR,8BAAoE;IAChE,mFAA+B;IAY3B,AADJ,8BAA+B,QACxB;IAAA,qBAAK;IACZ,AADY,iBAAI,EACV;IACN,8BAAkC;IAC9B,gCASa;IAErB,AADI,iBAAM,EACJ;;;IA1BI,cAAuB;IAAvB,+CAAuB;IAgBrB,eAAqC;IAMrC,AADA,AADA,AADA,AADA,AAFA,0DAAqC,iBAErB,kBACC,8BACK,mBACJ,mBACA;;;IAO9B,kCAAwD;;ADvBhE,MAAM,OAAO,oBAAoB;IALjC;QAOW,aAAQ,GAA6B,IAAI,CAAC;QAG5C,qBAAgB,GAAQ,EAAE,CAAC;QAC3B,eAAU,GAAY,KAAK,CAAC;KAoCpC;IAlCC,IAAW,aAAa;QACtB,OAAO,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC;IAC5C,CAAC;IAED,QAAQ;QACN,IAAG,IAAI,CAAC,aAAa,EAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC;IAEK,eAAe,CAAC,aAAqB;;YACzC,IAAI,aAAa,EAAE,CAAC;gBAClB,MAAM,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC;gBAC7B,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC,CAAC,eAAe,CAAoB,eAAe,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC;gBACpG,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;gBAEjD,MAAM,EAAE,GAAG,IAAI,OAAO,CAAwB,CAAC,CAAC,CAAC;gBACjD,MAAM,QAAQ,GAAG,MAAM,EAAE,CAAC,OAAO,CAC/B;oBACE,UAAU,EAAE,oBAAoB;oBAChC,WAAW,EAAE,kBAAkB,aAAa,GAAG;oBAC/C,MAAM,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,CAAC;iBACrE,CAAC,CAAC;gBACL,IAAG,QAAQ,CAAC,OAAO,EAAC,CAAC;oBACnB,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAC,OAAO,CAAC;oBACzC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;gBAC1B,CAAC;qBAAM,CAAC;oBACN,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;oBAChC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;gBAC1B,CAAC;YACH,CAAC;QACH,CAAC;KAAA;;wFAxCU,oBAAoB;uEAApB,oBAAoB;QCTjC,2BAAK;QA+BD,AA9BA,6EAAmB,yEA8BZ;QAGX,iBAAM;;QAjCF,cAgCC;QAhCD,yCAgCC;;iFDxBQ,oBAAoB;cALhC,SAAS;2BACE,iBAAiB;gBAKlB,aAAa;kBAArB,KAAK;YACG,QAAQ;kBAAhB,KAAK;;kFAFK,oBAAoB"}
+{"version":3,"file":"ng-data-context.component.js","sourceRoot":"","sources":["../../src/lib/ng-data-context.component.ts","../../src/lib/ng-data-context.component.html"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AACzD,OAAO,EAAuC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;;;;;;;;;ICChG,8BAA+B;IAC3B,kCAAoE;IACpE,4BAAwB;IAAA,uCAAuB;IACnD,AADmD,iBAAI,EACjD;;;IAUM,4BAA8B;IAAA,YAAmC;IAAA,iBAAI;;;IAAvC,cAAmC;IAAnC,0DAAmC;;;IA6BzE,+BAA2B;IACvB,wBAA8C;IAC9C,YACJ;IAAA,iBAAM;;;IADF,eACJ;IADI,oDACJ;;;IAYQ,wBAAwD;;;IAiB5C,gCAA+B;IAAA,YAAsB;IAAA,iBAAO;;;IAA7B,cAAsB;IAAtB,yCAAsB;;;;IAcjD,AADJ,AADJ,+BAAyB,cACO,SACpB;IAAA,wBAAgC;IAAC,0BAAS;IAAA,iBAAK;IAE/C,AADJ,+BAAyB,iBAC6E;IAAvE,6PAAS,oCAA0B,MAAM,cAAW,KAAC;IAC5E,wBAA+H;IAC/H,YACJ;IAAA,iBAAS;IACT,kCAA6E;IAAlD,6PAAS,kCAAwB,KAAC;IACzD,yBAAkC;IAClC,yBACJ;IAER,AADI,AADI,iBAAS,EACP,EACJ;IACgB,AAAtB,gCAAsB,YAAM;IAAA,aAAc;IAC9C,AADqD,AAAP,iBAAO,EAAM,EACrD;;;;IAV8B,eAAkD;IAAC,AAAnD,qEAAkD,wDAAoD;IAC1H,cACJ;IADI,gGACJ;IAOoB,eAAc;IAAd,iCAAc;;;;IASlC,AADJ,+BAA2B,eACM;IAAA,sBAAM;IAAA,iBAAO;IAEtC,AADJ,+BAA4B,WAClB;IAAA,YAA+C;IAAA,iBAAO;IAC5D,kCAAuF;IAA9D,6PAAS,yCAA+B,KAAC;IAC9D,wBAAsD;IAGlE,AADI,AADI,iBAAS,EACP,EACJ;;;;IALQ,eAA+C;IAA/C,yEAA+C;;;;IASzD,AADJ,+BAA2B,eACM;IAAA,oBAAI;IAAA,iBAAO;IAEpC,AADJ,+BAA4B,eACQ;IAAA,YAAwE;;IAAA,iBAAO;IAC/G,kCAAoF;IAA3D,6PAAS,qCAA2B,KAAC;IAC1D,wBAAsD;IAGlE,AADI,AADI,iBAAS,EACP,EACJ;;;IALQ,eAAyB;IAAzB,iDAAyB;IAAC,cAAwE;IAAxE,uHAAwE;;;;IAS5G,AADJ,+BAA2B,eACM;IAAA,qBAAK;IAAA,iBAAO;IAErC,AADJ,+BAA4B,eACS;IAAA,YAA0E;;IAAA,iBAAO;IAClH,kCAAoF;IAA3D,6PAAS,uCAA6B,KAAC;IAC5D,wBAAsD;IAGlE,AADI,AADI,iBAAS,EACP,EACJ;;;IALQ,eAA0B;IAA1B,kDAA0B;IAAC,cAA0E;IAA1E,yHAA0E;;;;IAS/G,AADJ,+BAA2B,eACM;IAAA,yBAAS;IAAA,iBAAO;IAEzC,AADJ,+BAA4B,WAClB;IAAA,YAAmB;IAAA,iBAAO;IAChC,kCAAoG;IAA3E,6PAAS,yCAA+B,SAAS,cAAW,KAAC;IAClF,wBAAqI;IAGjJ,AADI,AADI,iBAAS,EACP,EACJ;;;;IALQ,eAAmB;IAAnB,sCAAmB;IAED,eAAqD;IAAC,AAAtD,wEAAqD,2DAAuD;;;IAehJ,gCAAwB;IACpB,wBAA+B;IAC/B,YACJ;;IAAA,iBAAO;;;IADH,eACJ;IADI,8FACJ;;;;IAjGZ,AAFJ,+BAAyE,cAEL;IAAvC,uNAAS,sCAA4B,KAAC;IAEvD,AADJ,+BAA8B,cACgG;IACtH,oBAAwC;IACxC,4BAAM;IAAA,YAAe;IACzB,AADyB,iBAAO,EAC1B;IACN,oGAAwB;IAG5B,iBAAM;IACN,kCAA2B;IACvB,wBAAyH;IAEjI,AADI,iBAAS,EACP;IAGN,gCAA0B;IAEtB,sGAAgB;IAqBZ,AADJ,gCAA8B,eACC;IAkCvB,AAXA,AAXA,AAXA,qGAAqB,wFAWF,wFAWC,wFAWC;IAY7B,AADI,iBAAM,EACJ;IAIF,AADJ,gCAAyB,gBACG;IACpB,yBAAiC;IACjC,aACJ;;IAAA,iBAAO;IACP,sGAA0E;IAQtF,AADI,AADI,iBAAM,EACJ,EACJ;;;;IAvGyB,4DAAyC;IAIpC,eAAyD;IAAC,AAA1D,4EAAyD,4CAAwC;IAClH,cAAgC;IAAhC,+CAAgC;IAC7B,eAAe;IAAf,kCAAe;IAEzB,cAEC;IAFD,8CAEC;IAGmB,eAAiD;IAAC,AAAlD,oEAAiD,mDAA+C;IAOxH,eAiBC;IAjBD,uCAiBC;IAKO,eAUC;IAVD,4CAUC;IACD,cAUC;IAVD,0CAUC;IACD,cAUC;IAVD,2CAUC;IACD,cAUC;IAVD,4CAUC;IAQD,eACJ;IADI,gGACJ;IACA,eAKC;IALD,uGAKC;;;IAOb,+BAAsB;IAClB,wBAAiC;IACjC,yBAAG;IAAA,8BAAc;IACrB,AADqB,iBAAI,EACnB;;;;IAvKN,AADJ,AADJ,8BAAiC,aACJ,aACK;IACtB,uBAAmD;IACnD,0BAAI;IAAA,YAA+C;IACvD,AADuD,iBAAK,EACtD;IACN,yFAA0D;IAItD,AADJ,+BAAyB,eACG;IACpB,wBAAuC;IACvC,aACA;IAAA,mCAA8G;IAArF,yLAAS,kGAAyC,EAAE,EAAE,YAAY,CAAC,KAAC;IACzF,yBAAuH;IAE/H,AADI,iBAAS,EACN;IACP,iCAAwB;IACpB,yBAAmC;IACnC,aACJ;IAER,AADI,AADI,iBAAO,EACL,EACJ;IAEF,AADJ,gCAA4B,kBAC4C;IAApC,yLAAS,gBAAS,KAAC;IAC/C,yBAAkC;IAClC,0BACJ;IAAA,iBAAS;IACT,mCAA8E;IAA9C,yLAAS,oBAAa,KAAC;IACnD,yBAAoC;IACpC,yBACJ;IAER,AADI,AADI,iBAAS,EACP,EACJ;IAEN,8FAAoB;IAShB,AADJ,gCAA8B,yBAMD;IAJrB,yTAAwB;IACxB,gNAAiB,uBAAgB,KAAC;IAIlC,sGAAwC;IAIhD,AADI,iBAAgB,EACd;IAGN,gCAA6B;IACzB,0GAyGC;IAED,8FAAkC;IAMtC,iBAAM;;;IAvKU,eAA+C;IAA/C,iHAA+C;IAEvD,cAEC;IAFD,2FAEC;IAIO,eACA;IADA,0GACA;IACwB,eAA8C;IAAC,AAA/C,8DAA8C,iDAAgD;IAKtH,eACJ;IADI,iGACJ;IAeZ,eAKC;IALD,+CAKC;IAKO,eAAwB;IAAxB,iDAAwB;IAGxB,kCAAoB;IAUxB,eAyGC;IAzGD,mCAyGC;IAED,eAKC;IALD,6DAKC;;;;IAML,+BAA6D;IAA5B,sLAAS,wBAAiB,KAAC;IACxD,+BAAmE;IAAnC,yJAAS,wBAAwB,KAAC;IAE1D,AADJ,+BAAgC,SACxB;IAAA,2BAAW;IAAA,iBAAK;IACpB,kCAAsD;IAA5B,yLAAS,wBAAiB,KAAC;IACjD,wBAAiC;IAEzC,AADI,iBAAS,EACP;IAEG,AAAL,AADJ,+BAAiC,UACxB,WAAM;IAAA,aAAgB;IAC/B,AADsC,AAAP,iBAAO,EAAM,EACtC;IAEF,AADJ,gCAAiC,kBAC4C;IAArD,0LAAS,0CAA4B,aAAa,CAAC,KAAC;IACpE,yBAAyH;IACzH,aACJ;IAGZ,AADI,AADI,AADI,iBAAS,EACP,EACJ,EACJ;;;IATiB,gBAAgB;IAAhB,uCAAgB;IAIH,eAA+C;IAAC,AAAhD,+DAA+C,kDAAiD;IACpH,cACJ;IADI,8FACJ;;AD9LpB,MAAM,OAAO,oBAAoB;IALjC;QAOW,aAAQ,GAA6B,IAAI,CAAC;QAG5C,qBAAgB,GAA4B,EAAE,CAAC;QAC/C,eAAU,GAAY,KAAK,CAAC;QAC5B,iBAAY,GAAW,EAAE,CAAC;QAC1B,eAAU,GAAW,EAAE,CAAC;QAE/B,WAAW;QACJ,mBAAc,GAAY,KAAK,CAAC;QAChC,eAAU,GAAW,EAAE,CAAC;QACxB,gBAAW,GAAW,EAAE,CAAC;QACzB,kBAAa,GAA+B,EAAE,CAAC;KA4LvD;IA1LC,IAAW,aAAa;QACtB,OAAO,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC;IAC5C,CAAC;IAED,IAAW,aAAa;QACtB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YACrB,OAAO,IAAI,CAAC,gBAAgB,CAAC;QAC/B,CAAC;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;QAC3C,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;;YACzC,OAAA,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC;iBACvC,MAAA,IAAI,CAAC,GAAG,0CAAE,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;gBACtC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,0CAAE,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;iBACzF,MAAA,IAAI,CAAC,WAAW,0CAAE,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA,CAAA;SAAA,CAC/C,CAAC;IACJ,CAAC;IAED,IAAW,SAAS;QAClB,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC;IACnC,CAAC;IAED,QAAQ;QACN,IAAG,IAAI,CAAC,aAAa,EAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC3C,CAAC;IACH,CAAC;IAEK,eAAe,CAAC,aAAqB;;YACzC,IAAI,CAAC;gBACH,IAAI,aAAa,EAAE,CAAC;oBAClB,MAAM,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC;oBAC7B,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC,CAAC,eAAe,CAAoB,eAAe,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC;oBACpG,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;oBAEjD,MAAM,EAAE,GAAG,IAAI,OAAO,CAAwB,CAAC,CAAC,CAAC;oBACjD,MAAM,QAAQ,GAAG,MAAM,EAAE,CAAC,OAAO,CAC/B;wBACE,UAAU,EAAE,oBAAoB;wBAChC,WAAW,EAAE,kBAAkB,aAAa,GAAG;wBAC/C,OAAO,EAAE,qBAAqB;wBAC9B,UAAU,EAAE,eAAe;qBAC5B,CAAC,CAAC;oBAEL,IAAG,QAAQ,CAAC,OAAO,EAAC,CAAC;wBACnB,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAC,OAAO,CAAC;wBACzC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;oBAC1B,CAAC;yBAAM,CAAC;wBACN,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,YAAY,IAAI,mCAAmC,CAAC;wBACjF,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;wBAChC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;oBAC1B,CAAC;gBACH,CAAC;YACH,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,IAAI,CAAC,YAAY,GAAG,kDAAkD,CAAC;gBACvE,QAAQ,CAAC,KAAK,CAAC,CAAC;gBAChB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YAC1B,CAAC;QACH,CAAC;KAAA;IAEM,WAAW,CAAC,IAAY;QAC7B,MAAM,SAAS,GAA2B;YACxC,KAAK,EAAE,sBAAsB;YAC7B,MAAM,EAAE,mBAAmB;YAC3B,OAAO,EAAE,8BAA8B;YACvC,QAAQ,EAAE,kBAAkB;YAC5B,QAAQ,EAAE,kBAAkB;SAC7B,CAAC;QAEF,OAAO,SAAS,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,CAAC,IAAI,sBAAsB,CAAC;IAClE,CAAC;IAEM,YAAY,CAAC,IAAY;QAC9B,MAAM,UAAU,GAA2B;YACzC,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;YACjB,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,SAAS;YACnB,QAAQ,EAAE,SAAS;SACpB,CAAC;QAEF,OAAO,UAAU,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,CAAC,IAAI,SAAS,CAAC;IACtD,CAAC;IAEM,aAAa,CAAC,QAAuB;;QAC1C,IAAI,CAAC,QAAQ;YAAE,OAAO,SAAS,CAAC;QAChC,MAAM,EAAE,GAAG,IAAI,QAAQ,EAAE,CAAC;QAC1B,OAAO,MAAA,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,QAAQ,CAAC,0CAAE,IAAI,CAAC;IACxD,CAAC;IAEY,WAAW,CAAC,MAAc;;YACrC,IAAI,CAAC;gBACH,MAAM,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC;gBAC7B,MAAM,IAAI,GAAG,MAAM,CAAC,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC;gBAC7D,MAAO,IAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;gBACjC,OAAQ,IAAY,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACnC,CAAC;YAAC,WAAM,CAAC;gBACP,OAAO,SAAS,CAAC;YACnB,CAAC;QACH,CAAC;KAAA;IAEY,YAAY,CAAC,OAAe;;YACvC,IAAI,CAAC;gBACH,MAAM,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC;gBAC7B,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,eAAe,CAAC,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC;gBAChE,MAAO,KAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;gBACnC,OAAQ,KAAa,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACpC,CAAC;YAAC,WAAM,CAAC;gBACP,OAAO,SAAS,CAAC;YACnB,CAAC;QACH,CAAC;KAAA;IAEM,cAAc;QACnB,sCAAsC;QACtC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;IAC1B,CAAC;IAEM,mBAAmB,CAAC,MAAc;QACvC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC3D,CAAC;IAEY,eAAe,CAAC,IAAY,EAAE,SAAiB;;YAC1D,IAAI,CAAC;gBACH,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;gBAC1C,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC;gBAC7B,UAAU,CAAC,GAAG,EAAE;oBACd,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;gBACxB,CAAC,EAAE,IAAI,CAAC,CAAC;YACX,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,QAAQ,CAAC,gCAAgC,GAAG,EAAE,CAAC,CAAC;YAClD,CAAC;QACH,CAAC;KAAA;IAEM,cAAc,CAAC,GAAW;QAC/B,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC;QACtB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC;IAEM,eAAe;QACpB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;IACvB,CAAC;IAEM,gBAAgB,CAAC,QAAgB;QACtC,4DAA4D;QAC5D,OAAO,CAAC,GAAG,CAAC,qBAAqB,EAAE,QAAQ,CAAC,CAAC;IAC/C,CAAC;IAEM,cAAc,CAAC,MAAc;QAClC,4DAA4D;QAC5D,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;IAC3C,CAAC;IAEM,eAAe,CAAC,OAAe;QACpC,4DAA4D;QAC5D,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC;IAC7C,CAAC;IAEY,OAAO;;YAClB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACjD,CAAC;KAAA;IAEM,WAAW;;QAChB,qCAAqC;QACrC,MAAM,OAAO,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,aAAa,CAAC,CAAC;QACvF,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YAC1C,IAAI,CAAC,IAAI;YACT,IAAI,CAAC,GAAG;YACR,IAAI,CAAC,MAAM;YACX,IAAI,CAAC,OAAO;YACZ,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ;YAClD,IAAI,CAAC,QAAQ;YACb,IAAI,CAAC,WAAW,IAAI,EAAE;SACvB,CAAC,CAAC;QAEH,MAAM,GAAG,GAAG,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7F,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;QACnD,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAC7C,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;QACtC,CAAC,CAAC,IAAI,GAAG,GAAG,CAAC;QACb,CAAC,CAAC,QAAQ,GAAG,gBAAgB,CAAA,MAAA,IAAI,CAAC,iBAAiB,0CAAE,IAAI,KAAI,IAAI,CAAC,aAAa,MAAM,CAAC;QACtF,CAAC,CAAC,KAAK,EAAE,CAAC;QACV,MAAM,CAAC,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;IAClC,CAAC;;wFAzMU,oBAAoB;uEAApB,oBAAoB;QCTjC,8BAAiC;QAuL7B,AAjLE,AALF,6EAAkB,wDAKT,iEAiLa;QAqB1B,iBAAM;;QA3MF,cAmLC;QAnLD,wCAmLC;QAGD,eAoBC;QApBD,6CAoBC;;iFDlMQ,oBAAoB;cALhC,SAAS;2BACE,iBAAiB;gBAKlB,aAAa;kBAArB,KAAK;YACG,QAAQ;kBAAhB,KAAK;;kFAFK,oBAAoB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-data-context",
-  "version": "2.44.0",
+  "version": "2.46.0",
   "description": "MemberJunction: Angular component and pop-up window to display and edit the contents of a data context.",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -25,9 +25,10 @@
     "@progress/kendo-angular-indicators": "16.2.0"
   },
   "dependencies": {
-    "@memberjunction/core": "2.44.0",
-    "@memberjunction/core-entities": "2.44.0",
-    "@memberjunction/global": "2.44.0",
+    "@memberjunction/core": "2.46.0",
+    "@memberjunction/core-entities": "2.46.0",
+    "@memberjunction/global": "2.46.0",
+    "@memberjunction/ng-container-directives": "2.46.0",
     "tslib": "^2.3.0"
   },
   "sideEffects": false