@memberjunction/ng-query-viewer 5.9.0 → 5.10.1

package/dist/lib/query-info-panel/query-info-panel.component.js

@@ -4,6 +4,7 @@ import { Subject } from 'rxjs';
 import { debounceTime, takeUntil } from 'rxjs/operators';
 import { UserInfoEngine } from '@memberjunction/core-entities';
 import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-markdown";
 function QueryInfoPanelComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2);
@@ -22,10 +23,10 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_8_Template(rf, ctx) {
     i0.ɵɵtextInterpolate(ctx_r1.QueryInfo.Name);
 } }
 function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 24)(1, "span", 25);
+    i0.ɵɵelementStart(0, "div", 25)(1, "span", 26);
     i0.ɵɵtext(2, "Description");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 28);
+    i0.ɵɵelementStart(3, "span", 29);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -34,11 +35,11 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Cond
     i0.ɵɵtextInterpolate(ctx_r1.QueryInfo.Description);
 } }
 function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 24)(1, "span", 25);
+    i0.ɵɵelementStart(0, "div", 25)(1, "span", 26);
     i0.ɵɵtext(2, "Category");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 26);
-    i0.ɵɵelement(4, "i", 29);
+    i0.ɵɵelementStart(3, "span", 27);
+    i0.ɵɵelement(4, "i", 30);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -47,30 +48,30 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Cond
     i0.ɵɵtextInterpolate1(" ", ctx_r1.QueryInfo.Category, " ");
 } }
 function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 24)(1, "span", 25);
+    i0.ɵɵelementStart(0, "div", 25)(1, "span", 26);
     i0.ɵɵtext(2, "Has SQL");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 26);
-    i0.ɵɵelement(4, "i", 30);
+    i0.ɵɵelementStart(3, "span", 27);
+    i0.ɵɵelement(4, "i", 31);
     i0.ɵɵtext(5, " Yes ");
     i0.ɵɵelementEnd()();
 } }
 function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 22)(1, "div", 24)(2, "span", 25);
+    i0.ɵɵelementStart(0, "div", 22)(1, "div", 25)(2, "span", 26);
     i0.ɵɵtext(3, "Name");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 26);
+    i0.ɵɵelementStart(4, "span", 27);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(6, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_6_Template, 5, 1, "div", 24);
-    i0.ɵɵconditionalCreate(7, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_7_Template, 6, 1, "div", 24);
-    i0.ɵɵelementStart(8, "div", 24)(9, "span", 25);
+    i0.ɵɵconditionalCreate(6, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_6_Template, 5, 1, "div", 25);
+    i0.ɵɵconditionalCreate(7, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_7_Template, 6, 1, "div", 25);
+    i0.ɵɵelementStart(8, "div", 25)(9, "span", 26);
     i0.ɵɵtext(10, "Status");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(11, "span", 26)(12, "span", 27);
+    i0.ɵɵelementStart(11, "span", 27)(12, "span", 28);
     i0.ɵɵtext(13);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵconditionalCreate(14, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_14_Template, 6, 0, "div", 24);
+    i0.ɵɵconditionalCreate(14, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Conditional_14_Template, 6, 0, "div", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -87,165 +88,192 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Temp
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.QueryInfo.OriginalSQL ? 14 : -1);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 38);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_7_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 32);
+    i0.ɵɵelement(1, "mj-markdown", 33);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("data", ctx_r1.QueryInfo.TechnicalDescription || "")("enableMermaid", true)("enableHighlight", true)("enableCollapsibleHeadings", false)("enableSmartypants", true);
+} }
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 18)(1, "div", 19);
+    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_7_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.ToggleSection("technical")); });
+    i0.ɵɵelement(2, "i", 20);
+    i0.ɵɵelementStart(3, "span", 21);
+    i0.ɵɵtext(4, "Technical Description");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(5, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_7_Conditional_5_Template, 2, 5, "div", 32);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("expanded", ctx_r1.IsSectionExpanded("technical"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("fa-chevron-down", ctx_r1.IsSectionExpanded("technical"))("fa-chevron-right", !ctx_r1.IsSectionExpanded("technical"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("technical") ? 5 : -1);
+} }
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 41);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const field_r5 = i0.ɵɵnextContext(2).$implicit;
+    const field_r6 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", field_r5.Description, " ");
+    i0.ɵɵtextInterpolate1(" ", field_r6.Description, " ");
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 39);
-    i0.ɵɵelement(1, "i", 40);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 42);
+    i0.ɵɵelement(1, "i", 43);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const field_r5 = i0.ɵɵnextContext(2).$implicit;
+    const field_r6 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate2(" ", field_r5.SourceEntity, ".", field_r5.SourceFieldName, " ");
+    i0.ɵɵtextInterpolate2(" ", field_r6.SourceEntity, ".", field_r6.SourceFieldName, " ");
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 37);
-    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Conditional_1_Template, 2, 1, "span", 38);
-    i0.ɵɵconditionalCreate(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Conditional_2_Template, 3, 2, "span", 39);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 40);
+    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Conditional_1_Template, 2, 1, "span", 41);
+    i0.ɵɵconditionalCreate(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Conditional_2_Template, 3, 2, "span", 42);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const field_r5 = i0.ɵɵnextContext().$implicit;
+    const field_r6 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵconditional(field_r5.Description ? 1 : -1);
+    i0.ɵɵconditional(field_r6.Description ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(field_r5.SourceEntity ? 2 : -1);
+    i0.ɵɵconditional(field_r6.SourceEntity ? 2 : -1);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 33)(1, "div", 34)(2, "span", 35);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 36)(1, "div", 37)(2, "span", 38);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 36);
+    i0.ɵɵelementStart(4, "span", 39);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(6, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Conditional_6_Template, 3, 2, "div", 37);
+    i0.ɵɵconditionalCreate(6, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Conditional_6_Template, 3, 2, "div", 40);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const field_r5 = ctx.$implicit;
+    const field_r6 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(field_r5.Name);
+    i0.ɵɵtextInterpolate(field_r6.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.GetFieldTypeDisplay(field_r5));
+    i0.ɵɵtextInterpolate(ctx_r1.GetFieldTypeDisplay(field_r6));
     i0.ɵɵadvance();
-    i0.ɵɵconditional(field_r5.Description || field_r5.SourceEntity ? 6 : -1);
+    i0.ɵɵconditional(field_r6.Description || field_r6.SourceEntity ? 6 : -1);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 31);
-    i0.ɵɵrepeaterCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_For_2_Template, 7, 3, "div", 33, i0.ɵɵcomponentInstance().TrackByField, true);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 34);
+    i0.ɵɵrepeaterCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_For_2_Template, 7, 3, "div", 36, i0.ɵɵcomponentInstance().TrackByField, true);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.QueryInfo.Fields);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 32);
-    i0.ɵɵelement(1, "i", 41);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 35);
+    i0.ɵɵelement(1, "i", 44);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "No fields defined");
     i0.ɵɵelementEnd()();
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 22);
-    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_1_Template, 3, 0, "div", 31)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Conditional_2_Template, 4, 0, "div", 32);
+    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_1_Template, 3, 0, "div", 34)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Conditional_2_Template, 4, 0, "div", 35);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.QueryInfo.Fields.length ? 1 : 2);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 46);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 49);
     i0.ɵɵtext(1, "Required");
     i0.ɵɵelementEnd();
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 49);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 52);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r6 = i0.ɵɵnextContext(2).$implicit;
+    const param_r7 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", param_r6.Description, " ");
+    i0.ɵɵtextInterpolate1(" ", param_r7.Description, " ");
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 50);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 53);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r6 = i0.ɵɵnextContext(2).$implicit;
+    const param_r7 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" Default: ", param_r6.DefaultValue, " ");
+    i0.ɵɵtextInterpolate1(" Default: ", param_r7.DefaultValue, " ");
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 48);
-    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Conditional_1_Template, 2, 1, "span", 49);
-    i0.ɵɵconditionalCreate(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Conditional_2_Template, 2, 1, "span", 50);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 51);
+    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Conditional_1_Template, 2, 1, "span", 52);
+    i0.ɵɵconditionalCreate(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Conditional_2_Template, 2, 1, "span", 53);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r6 = i0.ɵɵnextContext().$implicit;
+    const param_r7 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r6.Description ? 1 : -1);
+    i0.ɵɵconditional(param_r7.Description ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r6.DefaultValue ? 2 : -1);
+    i0.ɵɵconditional(param_r7.DefaultValue ? 2 : -1);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 43)(1, "div", 44)(2, "span", 45);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 46)(1, "div", 47)(2, "span", 48);
     i0.ɵɵtext(3);
-    i0.ɵɵconditionalCreate(4, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_4_Template, 2, 0, "span", 46);
+    i0.ɵɵconditionalCreate(4, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_4_Template, 2, 0, "span", 49);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 47);
+    i0.ɵɵelementStart(5, "span", 50);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(7, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Conditional_7_Template, 3, 2, "div", 48);
+    i0.ɵɵconditionalCreate(7, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Conditional_7_Template, 3, 2, "div", 51);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r6 = ctx.$implicit;
+    const param_r7 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", param_r6.Name, " ");
+    i0.ɵɵtextInterpolate1(" ", param_r7.Name, " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r6.IsRequired ? 4 : -1);
+    i0.ɵɵconditional(param_r7.IsRequired ? 4 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.GetParamTypeDisplay(param_r6));
+    i0.ɵɵtextInterpolate(ctx_r1.GetParamTypeDisplay(param_r7));
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r6.Description || param_r6.DefaultValue ? 7 : -1);
+    i0.ɵɵconditional(param_r7.Description || param_r7.DefaultValue ? 7 : -1);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 42);
-    i0.ɵɵrepeaterCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_For_2_Template, 8, 4, "div", 43, i0.ɵɵcomponentInstance().TrackByParam, true);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 45);
+    i0.ɵɵrepeaterCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_For_2_Template, 8, 4, "div", 46, i0.ɵɵcomponentInstance().TrackByParam, true);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.QueryInfo.Parameters);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 32);
-    i0.ɵɵelement(1, "i", 51);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 35);
+    i0.ɵɵelement(1, "i", 54);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "No parameters required");
     i0.ɵɵelementEnd()();
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 22);
-    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_1_Template, 3, 0, "div", 42)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Conditional_2_Template, 4, 0, "div", 32);
+    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_1_Template, 3, 0, "div", 45)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Conditional_2_Template, 4, 0, "div", 35);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.QueryInfo.Parameters.length ? 1 : 2);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 52)(1, "pre", 53);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 55)(1, "pre", 56);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -253,16 +281,16 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Con
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(ctx_r1.QueryInfo.SQL);
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 32);
-    i0.ɵɵelement(1, "i", 54);
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 35);
+    i0.ɵɵelement(1, "i", 57);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "SQL not available");
     i0.ɵɵelementEnd()();
 } }
-function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Template(rf, ctx) { if (rf & 1) {
+function QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 22);
-    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Conditional_1_Template, 3, 1, "div", 52)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Conditional_2_Template, 4, 0, "div", 32);
+    i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Conditional_1_Template, 3, 1, "div", 55)(2, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Conditional_2_Template, 4, 0, "div", 35);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -279,35 +307,36 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template(rf, ctx)
     i0.ɵɵelementEnd()();
     i0.ɵɵconditionalCreate(6, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_6_Template, 15, 7, "div", 22);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 18)(8, "div", 19);
-    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_8_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("fields")); });
-    i0.ɵɵelement(9, "i", 20);
-    i0.ɵɵelementStart(10, "span", 21);
-    i0.ɵɵtext(11, "Fields");
+    i0.ɵɵconditionalCreate(7, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_7_Template, 6, 7, "div", 23);
+    i0.ɵɵelementStart(8, "div", 18)(9, "div", 19);
+    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_9_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("fields")); });
+    i0.ɵɵelement(10, "i", 20);
+    i0.ɵɵelementStart(11, "span", 21);
+    i0.ɵɵtext(12, "Fields");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "span", 23);
-    i0.ɵɵtext(13);
+    i0.ɵɵelementStart(13, "span", 24);
+    i0.ɵɵtext(14);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(14, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_14_Template, 3, 1, "div", 22);
+    i0.ɵɵconditionalCreate(15, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_15_Template, 3, 1, "div", 22);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "div", 18)(16, "div", 19);
-    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_16_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("parameters")); });
-    i0.ɵɵelement(17, "i", 20);
-    i0.ɵɵelementStart(18, "span", 21);
-    i0.ɵɵtext(19, "Parameters");
+    i0.ɵɵelementStart(16, "div", 18)(17, "div", 19);
+    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_17_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("parameters")); });
+    i0.ɵɵelement(18, "i", 20);
+    i0.ɵɵelementStart(19, "span", 21);
+    i0.ɵɵtext(20, "Parameters");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(20, "span", 23);
-    i0.ɵɵtext(21);
+    i0.ɵɵelementStart(21, "span", 24);
+    i0.ɵɵtext(22);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(22, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_22_Template, 3, 1, "div", 22);
+    i0.ɵɵconditionalCreate(23, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_23_Template, 3, 1, "div", 22);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(23, "div", 18)(24, "div", 19);
-    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_24_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("sql")); });
-    i0.ɵɵelement(25, "i", 20);
-    i0.ɵɵelementStart(26, "span", 21);
-    i0.ɵɵtext(27, "SQL Query");
+    i0.ɵɵelementStart(24, "div", 18)(25, "div", 19);
+    i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template_div_click_25_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleSection("sql")); });
+    i0.ɵɵelement(26, "i", 20);
+    i0.ɵɵelementStart(27, "span", 21);
+    i0.ɵɵtext(28, "SQL Query");
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(28, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_28_Template, 3, 1, "div", 22);
+    i0.ɵɵconditionalCreate(29, QueryInfoPanelComponent_Conditional_1_Conditional_11_Conditional_29_Template, 3, 1, "div", 22);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -318,13 +347,15 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template(rf, ctx)
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.IsSectionExpanded("overview") ? 6 : -1);
     i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.QueryInfo.TechnicalDescription ? 7 : -1);
+    i0.ɵɵadvance();
     i0.ɵɵclassProp("expanded", ctx_r1.IsSectionExpanded("fields"));
     i0.ɵɵadvance(2);
     i0.ɵɵclassProp("fa-chevron-down", ctx_r1.IsSectionExpanded("fields"))("fa-chevron-right", !ctx_r1.IsSectionExpanded("fields"));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1("(", ctx_r1.QueryInfo.Fields.length || 0, ")");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("fields") ? 14 : -1);
+    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("fields") ? 15 : -1);
     i0.ɵɵadvance();
     i0.ɵɵclassProp("expanded", ctx_r1.IsSectionExpanded("parameters"));
     i0.ɵɵadvance(2);
@@ -332,13 +363,13 @@ function QueryInfoPanelComponent_Conditional_1_Conditional_11_Template(rf, ctx)
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1("(", ctx_r1.QueryInfo.Parameters.length || 0, ")");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("parameters") ? 22 : -1);
+    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("parameters") ? 23 : -1);
     i0.ɵɵadvance();
     i0.ɵɵclassProp("expanded", ctx_r1.IsSectionExpanded("sql"));
     i0.ɵɵadvance(2);
     i0.ɵɵclassProp("fa-chevron-down", ctx_r1.IsSectionExpanded("sql"))("fa-chevron-right", !ctx_r1.IsSectionExpanded("sql"));
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("sql") ? 28 : -1);
+    i0.ɵɵconditional(ctx_r1.IsSectionExpanded("sql") ? 29 : -1);
 } }
 function QueryInfoPanelComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
@@ -356,7 +387,7 @@ function QueryInfoPanelComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnClose()); });
     i0.ɵɵelement(10, "i", 12);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(11, QueryInfoPanelComponent_Conditional_1_Conditional_11_Template, 29, 30, "div", 13);
+    i0.ɵɵconditionalCreate(11, QueryInfoPanelComponent_Conditional_1_Conditional_11_Template, 30, 31, "div", 13);
     i0.ɵɵelementStart(12, "div", 14)(13, "button", 15);
     i0.ɵɵlistener("click", function QueryInfoPanelComponent_Conditional_1_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnOpenRecord()); });
     i0.ɵɵelement(14, "i", 16);
@@ -508,14 +539,14 @@ export class QueryInfoPanelComponent {
     static ɵfac = function QueryInfoPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryInfoPanelComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryInfoPanelComponent, selectors: [["mj-query-info-panel"]], hostBindings: function QueryInfoPanelComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("mousemove", function QueryInfoPanelComponent_mousemove_HostBindingHandler($event) { return ctx.OnMouseMove($event); }, i0.ɵɵresolveDocument)("mouseup", function QueryInfoPanelComponent_mouseup_HostBindingHandler() { return ctx.OnMouseUp(); }, i0.ɵɵresolveDocument);
-        } }, inputs: { QueryInfo: "QueryInfo", Visible: "Visible", ShowOverlay: "ShowOverlay" }, outputs: { Close: "Close", OpenRecord: "OpenRecord" }, standalone: false, decls: 2, vars: 2, consts: [[1, "info-panel-overlay"], [1, "info-panel", 3, "width"], [1, "info-panel-overlay", 3, "click"], [1, "info-panel"], [1, "resize-handle", 3, "mousedown"], [1, "panel-header"], [1, "header-content"], [1, "fa-solid", "fa-circle-info", "header-icon"], [1, "header-text"], [1, "header-title"], [1, "header-subtitle"], ["title", "Close", 1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "panel-content"], [1, "panel-footer"], [1, "btn", "btn-primary", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "btn", "btn-secondary", 3, "click"], [1, "info-section"], [1, "section-header", 3, "click"], [1, "fa-solid", "section-icon"], [1, "section-title"], [1, "section-content"], [1, "section-count"], [1, "info-row"], [1, "info-label"], [1, "info-value"], [1, "status-badge"], [1, "info-value", "description"], [1, "fa-solid", "fa-folder", "category-icon"], [1, "fa-solid", "fa-check", "text-success"], [1, "fields-list"], [1, "empty-section"], [1, "field-item"], [1, "field-header"], [1, "field-name"], [1, "field-type"], [1, "field-details"], [1, "field-description"], [1, "field-source"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-table-columns"], [1, "params-list"], [1, "param-item"], [1, "param-header"], [1, "param-name"], [1, "required-badge"], [1, "param-type"], [1, "param-details"], [1, "param-description"], [1, "param-default"], [1, "fa-solid", "fa-sliders"], [1, "sql-container"], [1, "sql-code"], [1, "fa-solid", "fa-code"]], template: function QueryInfoPanelComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { QueryInfo: "QueryInfo", Visible: "Visible", ShowOverlay: "ShowOverlay" }, outputs: { Close: "Close", OpenRecord: "OpenRecord" }, standalone: false, decls: 2, vars: 2, consts: [[1, "info-panel-overlay"], [1, "info-panel", 3, "width"], [1, "info-panel-overlay", 3, "click"], [1, "info-panel"], [1, "resize-handle", 3, "mousedown"], [1, "panel-header"], [1, "header-content"], [1, "fa-solid", "fa-circle-info", "header-icon"], [1, "header-text"], [1, "header-title"], [1, "header-subtitle"], ["title", "Close", 1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "panel-content"], [1, "panel-footer"], [1, "btn", "btn-primary", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "btn", "btn-secondary", 3, "click"], [1, "info-section"], [1, "section-header", 3, "click"], [1, "fa-solid", "section-icon"], [1, "section-title"], [1, "section-content"], [1, "info-section", 3, "expanded"], [1, "section-count"], [1, "info-row"], [1, "info-label"], [1, "info-value"], [1, "status-badge"], [1, "info-value", "description"], [1, "fa-solid", "fa-folder", "category-icon"], [1, "fa-solid", "fa-check", "text-success"], [1, "section-content", "technical-description-content"], [3, "data", "enableMermaid", "enableHighlight", "enableCollapsibleHeadings", "enableSmartypants"], [1, "fields-list"], [1, "empty-section"], [1, "field-item"], [1, "field-header"], [1, "field-name"], [1, "field-type"], [1, "field-details"], [1, "field-description"], [1, "field-source"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-table-columns"], [1, "params-list"], [1, "param-item"], [1, "param-header"], [1, "param-name"], [1, "required-badge"], [1, "param-type"], [1, "param-details"], [1, "param-description"], [1, "param-default"], [1, "fa-solid", "fa-sliders"], [1, "sql-container"], [1, "sql-code"], [1, "fa-solid", "fa-code"]], template: function QueryInfoPanelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, QueryInfoPanelComponent_Conditional_0_Template, 1, 1, "div", 0);
             i0.ɵɵconditionalCreate(1, QueryInfoPanelComponent_Conditional_1_Template, 18, 5, "div", 1);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.Visible && ctx.ShowOverlay ? 0 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.Visible ? 1 : -1);
-        } }, styles: ["\n\n\n\n\n.info-panel-overlay[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.3);\n    z-index: 999;\n}\n\n\n\n.info-panel[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    right: 0;\n    height: 100%;\n    background: #fff;\n    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n    min-width: 350px;\n    max-width: 800px;\n}\n\n\n\n.resize-handle[_ngcontent-%COMP%] {\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: 6px;\n    cursor: ew-resize;\n    background: transparent;\n    transition: background 0.15s ease;\n    z-index: 10;\n}\n\n.resize-handle[_ngcontent-%COMP%]:hover {\n    background: rgba(92, 107, 192, 0.3);\n}\n\n.resize-handle[_ngcontent-%COMP%]:active {\n    background: rgba(92, 107, 192, 0.5);\n}\n\n\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 20px;\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n    flex-shrink: 0;\n}\n\n.header-content[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.header-icon[_ngcontent-%COMP%] {\n    font-size: 24px;\n    opacity: 0.9;\n}\n\n.header-text[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.header-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 600;\n}\n\n.header-subtitle[_ngcontent-%COMP%] {\n    font-size: 13px;\n    opacity: 0.85;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: rgba(255, 255, 255, 0.15);\n    color: #fff;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n    background: rgba(255, 255, 255, 0.25);\n}\n\n\n\n.panel-content[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px;\n}\n\n\n\n.info-section[_ngcontent-%COMP%] {\n    margin-bottom: 8px;\n    border: 1px solid #e0e0e0;\n    border-radius: 8px;\n    overflow: hidden;\n}\n\n.info-section.expanded[_ngcontent-%COMP%] {\n    border-color: #c5cae9;\n}\n\n.section-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    background: #fafafa;\n    cursor: pointer;\n    transition: background 0.15s ease;\n    user-select: none;\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n    background: #f0f0f0;\n}\n\n.info-section.expanded[_ngcontent-%COMP%]   .section-header[_ngcontent-%COMP%] {\n    background: #e8eaf6;\n    border-bottom: 1px solid #c5cae9;\n}\n\n.section-icon[_ngcontent-%COMP%] {\n    font-size: 10px;\n    color: #666;\n    width: 12px;\n    text-align: center;\n}\n\n.section-title[_ngcontent-%COMP%] {\n    flex: 1;\n    font-weight: 600;\n    font-size: 14px;\n    color: #333;\n}\n\n.section-count[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #888;\n    font-weight: 400;\n}\n\n.section-content[_ngcontent-%COMP%] {\n    padding: 16px;\n    background: #fff;\n}\n\n\n\n.info-row[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    padding: 8px 0;\n    border-bottom: 1px solid #f0f0f0;\n}\n\n.info-row[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.info-label[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-weight: 600;\n    color: #888;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.info-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: #333;\n    line-height: 1.4;\n}\n\n.info-value.description[_ngcontent-%COMP%] {\n    color: #555;\n    font-style: italic;\n}\n\n.category-icon[_ngcontent-%COMP%] {\n    color: #f9a825;\n    margin-right: 4px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    display: inline-block;\n    padding: 2px 8px;\n    border-radius: 12px;\n    font-size: 12px;\n    font-weight: 500;\n    background: #f5f5f5;\n    color: #666;\n}\n\n.status-badge.approved[_ngcontent-%COMP%] {\n    background: #e8f5e9;\n    color: #2e7d32;\n}\n\n.text-success[_ngcontent-%COMP%] {\n    color: #2e7d32;\n}\n\n\n\n.fields-list[_ngcontent-%COMP%], \n.params-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.field-item[_ngcontent-%COMP%], \n.param-item[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n    background: #f8f9fa;\n    border-radius: 6px;\n    border-left: 3px solid #5c6bc0;\n}\n\n.field-header[_ngcontent-%COMP%], \n.param-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 4px;\n}\n\n.field-name[_ngcontent-%COMP%], \n.param-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    font-size: 13px;\n    color: #333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.field-type[_ngcontent-%COMP%], \n.param-type[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-family: 'Consolas', 'Monaco', monospace;\n    color: #666;\n    background: #e8eaf6;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.field-details[_ngcontent-%COMP%], \n.param-details[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    margin-top: 6px;\n}\n\n.field-description[_ngcontent-%COMP%], \n.param-description[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n}\n\n.field-source[_ngcontent-%COMP%] {\n    font-size: 11px;\n    color: #5c6bc0;\n}\n\n.field-source[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    margin-right: 4px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    background: #ffebee;\n    color: #c62828;\n    border-radius: 4px;\n    text-transform: uppercase;\n}\n\n.param-default[_ngcontent-%COMP%] {\n    font-size: 11px;\n    color: #888;\n}\n\n\n\n.sql-container[_ngcontent-%COMP%] {\n    background: #1e1e1e;\n    border-radius: 6px;\n    overflow: hidden;\n}\n\n.sql-code[_ngcontent-%COMP%] {\n    margin: 0;\n    padding: 16px;\n    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    color: #d4d4d4;\n    white-space: pre-wrap;\n    word-break: break-word;\n    overflow-x: auto;\n}\n\n\n\n.empty-section[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 16px;\n    color: #888;\n    font-style: italic;\n}\n\n.empty-section[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n    opacity: 0.6;\n}\n\n\n\n.panel-footer[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-start;\n    gap: 12px;\n    padding: 16px 20px;\n    background: #f5f5f5;\n    border-top: 1px solid #e0e0e0;\n    flex-shrink: 0;\n}\n\n.btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 16px;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n}\n\n.btn-primary[_ngcontent-%COMP%]:hover {\n    background: linear-gradient(135deg, #7986cb 0%, #5c6bc0 100%);\n    box-shadow: 0 2px 8px rgba(92, 107, 192, 0.4);\n}\n\n.btn-secondary[_ngcontent-%COMP%] {\n    background: #fff;\n    color: #333;\n    border: 1px solid #ddd;\n}\n\n.btn-secondary[_ngcontent-%COMP%]:hover {\n    background: #f5f5f5;\n    border-color: #ccc;\n}\n\n\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n    background: #f5f5f5;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background: #ccc;\n    border-radius: 3px;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n    background: #aaa;\n}"], data: { animation: [
+        } }, dependencies: [i1.MarkdownComponent], styles: ["\n\n\n\n\n.info-panel-overlay[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.3);\n    z-index: 999;\n}\n\n\n\n.info-panel[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    right: 0;\n    height: 100%;\n    background: #fff;\n    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n    min-width: 350px;\n    max-width: 800px;\n}\n\n\n\n.resize-handle[_ngcontent-%COMP%] {\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: 6px;\n    cursor: ew-resize;\n    background: transparent;\n    transition: background 0.15s ease;\n    z-index: 10;\n}\n\n.resize-handle[_ngcontent-%COMP%]:hover {\n    background: rgba(92, 107, 192, 0.3);\n}\n\n.resize-handle[_ngcontent-%COMP%]:active {\n    background: rgba(92, 107, 192, 0.5);\n}\n\n\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 20px;\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n    flex-shrink: 0;\n}\n\n.header-content[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.header-icon[_ngcontent-%COMP%] {\n    font-size: 24px;\n    opacity: 0.9;\n}\n\n.header-text[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.header-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 600;\n}\n\n.header-subtitle[_ngcontent-%COMP%] {\n    font-size: 13px;\n    opacity: 0.85;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: rgba(255, 255, 255, 0.15);\n    color: #fff;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n    background: rgba(255, 255, 255, 0.25);\n}\n\n\n\n.panel-content[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px;\n}\n\n\n\n.info-section[_ngcontent-%COMP%] {\n    margin-bottom: 8px;\n    border: 1px solid #e0e0e0;\n    border-radius: 8px;\n    overflow: hidden;\n}\n\n.info-section.expanded[_ngcontent-%COMP%] {\n    border-color: #c5cae9;\n}\n\n.section-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    background: #fafafa;\n    cursor: pointer;\n    transition: background 0.15s ease;\n    user-select: none;\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n    background: #f0f0f0;\n}\n\n.info-section.expanded[_ngcontent-%COMP%]   .section-header[_ngcontent-%COMP%] {\n    background: #e8eaf6;\n    border-bottom: 1px solid #c5cae9;\n}\n\n.section-icon[_ngcontent-%COMP%] {\n    font-size: 10px;\n    color: #666;\n    width: 12px;\n    text-align: center;\n}\n\n.section-title[_ngcontent-%COMP%] {\n    flex: 1;\n    font-weight: 600;\n    font-size: 14px;\n    color: #333;\n}\n\n.section-count[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #888;\n    font-weight: 400;\n}\n\n.section-content[_ngcontent-%COMP%] {\n    padding: 16px;\n    background: #fff;\n}\n\n\n\n.technical-description-content[_ngcontent-%COMP%] {\n    max-height: 400px;\n    overflow-y: auto;\n}\n\n.technical-description-content   [_nghost-%COMP%]     .mj-markdown-container {\n    font-size: 13px;\n    line-height: 1.5;\n}\n\n\n\n.info-row[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    padding: 8px 0;\n    border-bottom: 1px solid #f0f0f0;\n}\n\n.info-row[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.info-label[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-weight: 600;\n    color: #888;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.info-value[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: #333;\n    line-height: 1.4;\n}\n\n.info-value.description[_ngcontent-%COMP%] {\n    color: #555;\n    font-style: italic;\n}\n\n.category-icon[_ngcontent-%COMP%] {\n    color: #f9a825;\n    margin-right: 4px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    display: inline-block;\n    padding: 2px 8px;\n    border-radius: 12px;\n    font-size: 12px;\n    font-weight: 500;\n    background: #f5f5f5;\n    color: #666;\n}\n\n.status-badge.approved[_ngcontent-%COMP%] {\n    background: #e8f5e9;\n    color: #2e7d32;\n}\n\n.text-success[_ngcontent-%COMP%] {\n    color: #2e7d32;\n}\n\n\n\n.fields-list[_ngcontent-%COMP%], \n.params-list[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.field-item[_ngcontent-%COMP%], \n.param-item[_ngcontent-%COMP%] {\n    padding: 10px 12px;\n    background: #f8f9fa;\n    border-radius: 6px;\n    border-left: 3px solid #5c6bc0;\n}\n\n.field-header[_ngcontent-%COMP%], \n.param-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 4px;\n}\n\n.field-name[_ngcontent-%COMP%], \n.param-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    font-size: 13px;\n    color: #333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.field-type[_ngcontent-%COMP%], \n.param-type[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-family: 'Consolas', 'Monaco', monospace;\n    color: #666;\n    background: #e8eaf6;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.field-details[_ngcontent-%COMP%], \n.param-details[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    margin-top: 6px;\n}\n\n.field-description[_ngcontent-%COMP%], \n.param-description[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n}\n\n.field-source[_ngcontent-%COMP%] {\n    font-size: 11px;\n    color: #5c6bc0;\n}\n\n.field-source[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    margin-right: 4px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    background: #ffebee;\n    color: #c62828;\n    border-radius: 4px;\n    text-transform: uppercase;\n}\n\n.param-default[_ngcontent-%COMP%] {\n    font-size: 11px;\n    color: #888;\n}\n\n\n\n.sql-container[_ngcontent-%COMP%] {\n    background: #1e1e1e;\n    border-radius: 6px;\n    overflow: hidden;\n}\n\n.sql-code[_ngcontent-%COMP%] {\n    margin: 0;\n    padding: 16px;\n    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    color: #d4d4d4;\n    white-space: pre-wrap;\n    word-break: break-word;\n    overflow-x: auto;\n}\n\n\n\n.empty-section[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 16px;\n    color: #888;\n    font-style: italic;\n}\n\n.empty-section[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n    opacity: 0.6;\n}\n\n\n\n.panel-footer[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: flex-start;\n    gap: 12px;\n    padding: 16px 20px;\n    background: #f5f5f5;\n    border-top: 1px solid #e0e0e0;\n    flex-shrink: 0;\n}\n\n.btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 16px;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n}\n\n.btn-primary[_ngcontent-%COMP%]:hover {\n    background: linear-gradient(135deg, #7986cb 0%, #5c6bc0 100%);\n    box-shadow: 0 2px 8px rgba(92, 107, 192, 0.4);\n}\n\n.btn-secondary[_ngcontent-%COMP%] {\n    background: #fff;\n    color: #333;\n    border: 1px solid #ddd;\n}\n\n.btn-secondary[_ngcontent-%COMP%]:hover {\n    background: #f5f5f5;\n    border-color: #ccc;\n}\n\n\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n    background: #f5f5f5;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background: #ccc;\n    border-radius: 3px;\n}\n\n.panel-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n    background: #aaa;\n}"], data: { animation: [
                 trigger('slideIn', [
                     transition(':enter', [
                         style({ transform: 'translateX(100%)' }),
@@ -557,7 +588,7 @@ export class QueryInfoPanelComponent {
                             animate('150ms ease-in', style({ opacity: 0 }))
                         ])
                     ])
-                ], template: "<!-- Query Info Panel - Slide-in Panel -->\n@if (Visible && ShowOverlay) {\n  <div class=\"info-panel-overlay\"\n    @fadeIn\n    (click)=\"OnClose()\">\n  </div>\n}\n\n@if (Visible) {\n  <div class=\"info-panel\"\n    @slideIn\n    [style.width.px]=\"PanelWidth\">\n    <!-- Resize handle -->\n    <div class=\"resize-handle\" (mousedown)=\"OnResizeStart($event)\"></div>\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-content\">\n        <i class=\"fa-solid fa-circle-info header-icon\"></i>\n        <div class=\"header-text\">\n          <h3 class=\"header-title\">Query Information</h3>\n          @if (QueryInfo) {\n            <span class=\"header-subtitle\">{{ QueryInfo.Name }}</span>\n          }\n        </div>\n      </div>\n      <button class=\"close-btn\" (click)=\"OnClose()\" title=\"Close\">\n        <i class=\"fa-solid fa-times\"></i>\n      </button>\n    </div>\n    <!-- Content -->\n    @if (QueryInfo) {\n      <div class=\"panel-content\">\n        <!-- Overview Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('overview')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('overview')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('overview')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('overview')\"></i>\n            <span class=\"section-title\">Overview</span>\n          </div>\n          @if (IsSectionExpanded('overview')) {\n            <div class=\"section-content\">\n              <div class=\"info-row\">\n                <span class=\"info-label\">Name</span>\n                <span class=\"info-value\">{{ QueryInfo.Name }}</span>\n              </div>\n              @if (QueryInfo.Description) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Description</span>\n                  <span class=\"info-value description\">{{ QueryInfo.Description }}</span>\n                </div>\n              }\n              @if (QueryInfo.Category) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Category</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-folder category-icon\"></i>\n                    {{ QueryInfo.Category }}\n                  </span>\n                </div>\n              }\n              <div class=\"info-row\">\n                <span class=\"info-label\">Status</span>\n                <span class=\"info-value\">\n                  <span class=\"status-badge\" [class.approved]=\"QueryInfo.Status === 'Approved'\">\n                    {{ QueryInfo.Status }}\n                  </span>\n                </span>\n              </div>\n              @if (QueryInfo.OriginalSQL) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Has SQL</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-check text-success\"></i> Yes\n                  </span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Fields Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('fields')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('fields')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('fields')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('fields')\"></i>\n            <span class=\"section-title\">Fields</span>\n            <span class=\"section-count\">({{ QueryInfo.Fields.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('fields')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Fields.length) {\n                <div class=\"fields-list\">\n                  @for (field of QueryInfo.Fields; track TrackByField($index, field)) {\n                    <div class=\"field-item\">\n                      <div class=\"field-header\">\n                        <span class=\"field-name\">{{ field.Name }}</span>\n                        <span class=\"field-type\">{{ GetFieldTypeDisplay(field) }}</span>\n                      </div>\n                      @if (field.Description || field.SourceEntity) {\n                        <div class=\"field-details\">\n                          @if (field.Description) {\n                            <span class=\"field-description\">\n                              {{ field.Description }}\n                            </span>\n                          }\n                          @if (field.SourceEntity) {\n                            <span class=\"field-source\">\n                              <i class=\"fa-solid fa-link\"></i>\n                              {{ field.SourceEntity }}.{{ field.SourceFieldName }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-table-columns\"></i>\n                  <span>No fields defined</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Parameters Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('parameters')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('parameters')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('parameters')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('parameters')\"></i>\n            <span class=\"section-title\">Parameters</span>\n            <span class=\"section-count\">({{ QueryInfo.Parameters.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('parameters')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Parameters.length) {\n                <div class=\"params-list\">\n                  @for (param of QueryInfo.Parameters; track TrackByParam($index, param)) {\n                    <div class=\"param-item\">\n                      <div class=\"param-header\">\n                        <span class=\"param-name\">\n                          {{ param.Name }}\n                          @if (param.IsRequired) {\n                            <span class=\"required-badge\">Required</span>\n                          }\n                        </span>\n                        <span class=\"param-type\">{{ GetParamTypeDisplay(param) }}</span>\n                      </div>\n                      @if (param.Description || param.DefaultValue) {\n                        <div class=\"param-details\">\n                          @if (param.Description) {\n                            <span class=\"param-description\">\n                              {{ param.Description }}\n                            </span>\n                          }\n                          @if (param.DefaultValue) {\n                            <span class=\"param-default\">\n                              Default: {{ param.DefaultValue }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-sliders\"></i>\n                  <span>No parameters required</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- SQL Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('sql')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('sql')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('sql')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('sql')\"></i>\n            <span class=\"section-title\">SQL Query</span>\n          </div>\n          @if (IsSectionExpanded('sql')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.SQL) {\n                <div class=\"sql-container\">\n                  <pre class=\"sql-code\">{{ QueryInfo.SQL }}</pre>\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-code\"></i>\n                  <span>SQL not available</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n      </div>\n    }\n    <!-- Footer -->\n    <div class=\"panel-footer\">\n      <button class=\"btn btn-primary\" (click)=\"OnOpenRecord()\">\n        <i class=\"fa-solid fa-external-link-alt\"></i>\n        Open Full Record\n      </button>\n      <button class=\"btn btn-secondary\" (click)=\"OnClose()\">\n        Close\n      </button>\n    </div>\n  </div>\n}\n", styles: ["/* Query Info Panel Styles */\n\n/* Overlay */\n.info-panel-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.3);\n    z-index: 999;\n}\n\n/* Panel Container */\n.info-panel {\n    position: absolute;\n    top: 0;\n    right: 0;\n    height: 100%;\n    background: #fff;\n    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n    min-width: 350px;\n    max-width: 800px;\n}\n\n/* Resize Handle */\n.resize-handle {\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: 6px;\n    cursor: ew-resize;\n    background: transparent;\n    transition: background 0.15s ease;\n    z-index: 10;\n}\n\n.resize-handle:hover {\n    background: rgba(92, 107, 192, 0.3);\n}\n\n.resize-handle:active {\n    background: rgba(92, 107, 192, 0.5);\n}\n\n/* Header */\n.panel-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 20px;\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n    flex-shrink: 0;\n}\n\n.header-content {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.header-icon {\n    font-size: 24px;\n    opacity: 0.9;\n}\n\n.header-text {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.header-title {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 600;\n}\n\n.header-subtitle {\n    font-size: 13px;\n    opacity: 0.85;\n}\n\n.close-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: rgba(255, 255, 255, 0.15);\n    color: #fff;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n}\n\n.close-btn:hover {\n    background: rgba(255, 255, 255, 0.25);\n}\n\n/* Content */\n.panel-content {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px;\n}\n\n/* Sections */\n.info-section {\n    margin-bottom: 8px;\n    border: 1px solid #e0e0e0;\n    border-radius: 8px;\n    overflow: hidden;\n}\n\n.info-section.expanded {\n    border-color: #c5cae9;\n}\n\n.section-header {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    background: #fafafa;\n    cursor: pointer;\n    transition: background 0.15s ease;\n    user-select: none;\n}\n\n.section-header:hover {\n    background: #f0f0f0;\n}\n\n.info-section.expanded .section-header {\n    background: #e8eaf6;\n    border-bottom: 1px solid #c5cae9;\n}\n\n.section-icon {\n    font-size: 10px;\n    color: #666;\n    width: 12px;\n    text-align: center;\n}\n\n.section-title {\n    flex: 1;\n    font-weight: 600;\n    font-size: 14px;\n    color: #333;\n}\n\n.section-count {\n    font-size: 12px;\n    color: #888;\n    font-weight: 400;\n}\n\n.section-content {\n    padding: 16px;\n    background: #fff;\n}\n\n/* Info Rows */\n.info-row {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    padding: 8px 0;\n    border-bottom: 1px solid #f0f0f0;\n}\n\n.info-row:last-child {\n    border-bottom: none;\n}\n\n.info-label {\n    font-size: 11px;\n    font-weight: 600;\n    color: #888;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.info-value {\n    font-size: 14px;\n    color: #333;\n    line-height: 1.4;\n}\n\n.info-value.description {\n    color: #555;\n    font-style: italic;\n}\n\n.category-icon {\n    color: #f9a825;\n    margin-right: 4px;\n}\n\n.status-badge {\n    display: inline-block;\n    padding: 2px 8px;\n    border-radius: 12px;\n    font-size: 12px;\n    font-weight: 500;\n    background: #f5f5f5;\n    color: #666;\n}\n\n.status-badge.approved {\n    background: #e8f5e9;\n    color: #2e7d32;\n}\n\n.text-success {\n    color: #2e7d32;\n}\n\n/* Fields List */\n.fields-list,\n.params-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.field-item,\n.param-item {\n    padding: 10px 12px;\n    background: #f8f9fa;\n    border-radius: 6px;\n    border-left: 3px solid #5c6bc0;\n}\n\n.field-header,\n.param-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 4px;\n}\n\n.field-name,\n.param-name {\n    font-weight: 600;\n    font-size: 13px;\n    color: #333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.field-type,\n.param-type {\n    font-size: 11px;\n    font-family: 'Consolas', 'Monaco', monospace;\n    color: #666;\n    background: #e8eaf6;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.field-details,\n.param-details {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    margin-top: 6px;\n}\n\n.field-description,\n.param-description {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n}\n\n.field-source {\n    font-size: 11px;\n    color: #5c6bc0;\n}\n\n.field-source i {\n    margin-right: 4px;\n}\n\n.required-badge {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    background: #ffebee;\n    color: #c62828;\n    border-radius: 4px;\n    text-transform: uppercase;\n}\n\n.param-default {\n    font-size: 11px;\n    color: #888;\n}\n\n/* SQL Section */\n.sql-container {\n    background: #1e1e1e;\n    border-radius: 6px;\n    overflow: hidden;\n}\n\n.sql-code {\n    margin: 0;\n    padding: 16px;\n    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    color: #d4d4d4;\n    white-space: pre-wrap;\n    word-break: break-word;\n    overflow-x: auto;\n}\n\n/* Empty State */\n.empty-section {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 16px;\n    color: #888;\n    font-style: italic;\n}\n\n.empty-section i {\n    font-size: 16px;\n    opacity: 0.6;\n}\n\n/* Footer */\n.panel-footer {\n    display: flex;\n    justify-content: flex-start;\n    gap: 12px;\n    padding: 16px 20px;\n    background: #f5f5f5;\n    border-top: 1px solid #e0e0e0;\n    flex-shrink: 0;\n}\n\n.btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 16px;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary {\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n}\n\n.btn-primary:hover {\n    background: linear-gradient(135deg, #7986cb 0%, #5c6bc0 100%);\n    box-shadow: 0 2px 8px rgba(92, 107, 192, 0.4);\n}\n\n.btn-secondary {\n    background: #fff;\n    color: #333;\n    border: 1px solid #ddd;\n}\n\n.btn-secondary:hover {\n    background: #f5f5f5;\n    border-color: #ccc;\n}\n\n/* Scrollbar */\n.panel-content::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-content::-webkit-scrollbar-track {\n    background: #f5f5f5;\n}\n\n.panel-content::-webkit-scrollbar-thumb {\n    background: #ccc;\n    border-radius: 3px;\n}\n\n.panel-content::-webkit-scrollbar-thumb:hover {\n    background: #aaa;\n}\n"] }]
+                ], template: "<!-- Query Info Panel - Slide-in Panel -->\n@if (Visible && ShowOverlay) {\n  <div class=\"info-panel-overlay\"\n    @fadeIn\n    (click)=\"OnClose()\">\n  </div>\n}\n\n@if (Visible) {\n  <div class=\"info-panel\"\n    @slideIn\n    [style.width.px]=\"PanelWidth\">\n    <!-- Resize handle -->\n    <div class=\"resize-handle\" (mousedown)=\"OnResizeStart($event)\"></div>\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-content\">\n        <i class=\"fa-solid fa-circle-info header-icon\"></i>\n        <div class=\"header-text\">\n          <h3 class=\"header-title\">Query Information</h3>\n          @if (QueryInfo) {\n            <span class=\"header-subtitle\">{{ QueryInfo.Name }}</span>\n          }\n        </div>\n      </div>\n      <button class=\"close-btn\" (click)=\"OnClose()\" title=\"Close\">\n        <i class=\"fa-solid fa-times\"></i>\n      </button>\n    </div>\n    <!-- Content -->\n    @if (QueryInfo) {\n      <div class=\"panel-content\">\n        <!-- Overview Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('overview')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('overview')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('overview')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('overview')\"></i>\n            <span class=\"section-title\">Overview</span>\n          </div>\n          @if (IsSectionExpanded('overview')) {\n            <div class=\"section-content\">\n              <div class=\"info-row\">\n                <span class=\"info-label\">Name</span>\n                <span class=\"info-value\">{{ QueryInfo.Name }}</span>\n              </div>\n              @if (QueryInfo.Description) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Description</span>\n                  <span class=\"info-value description\">{{ QueryInfo.Description }}</span>\n                </div>\n              }\n              @if (QueryInfo.Category) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Category</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-folder category-icon\"></i>\n                    {{ QueryInfo.Category }}\n                  </span>\n                </div>\n              }\n              <div class=\"info-row\">\n                <span class=\"info-label\">Status</span>\n                <span class=\"info-value\">\n                  <span class=\"status-badge\" [class.approved]=\"QueryInfo.Status === 'Approved'\">\n                    {{ QueryInfo.Status }}\n                  </span>\n                </span>\n              </div>\n              @if (QueryInfo.OriginalSQL) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Has SQL</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-check text-success\"></i> Yes\n                  </span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Technical Description Section -->\n        @if (QueryInfo.TechnicalDescription) {\n          <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('technical')\">\n            <div class=\"section-header\" (click)=\"ToggleSection('technical')\">\n              <i class=\"fa-solid section-icon\"\n                [class.fa-chevron-down]=\"IsSectionExpanded('technical')\"\n                [class.fa-chevron-right]=\"!IsSectionExpanded('technical')\"></i>\n              <span class=\"section-title\">Technical Description</span>\n            </div>\n            @if (IsSectionExpanded('technical')) {\n              <div class=\"section-content technical-description-content\">\n                <mj-markdown\n                  [data]=\"QueryInfo.TechnicalDescription || ''\"\n                  [enableMermaid]=\"true\"\n                  [enableHighlight]=\"true\"\n                  [enableCollapsibleHeadings]=\"false\"\n                  [enableSmartypants]=\"true\">\n                </mj-markdown>\n              </div>\n            }\n          </div>\n        }\n        <!-- Fields Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('fields')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('fields')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('fields')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('fields')\"></i>\n            <span class=\"section-title\">Fields</span>\n            <span class=\"section-count\">({{ QueryInfo.Fields.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('fields')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Fields.length) {\n                <div class=\"fields-list\">\n                  @for (field of QueryInfo.Fields; track TrackByField($index, field)) {\n                    <div class=\"field-item\">\n                      <div class=\"field-header\">\n                        <span class=\"field-name\">{{ field.Name }}</span>\n                        <span class=\"field-type\">{{ GetFieldTypeDisplay(field) }}</span>\n                      </div>\n                      @if (field.Description || field.SourceEntity) {\n                        <div class=\"field-details\">\n                          @if (field.Description) {\n                            <span class=\"field-description\">\n                              {{ field.Description }}\n                            </span>\n                          }\n                          @if (field.SourceEntity) {\n                            <span class=\"field-source\">\n                              <i class=\"fa-solid fa-link\"></i>\n                              {{ field.SourceEntity }}.{{ field.SourceFieldName }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-table-columns\"></i>\n                  <span>No fields defined</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Parameters Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('parameters')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('parameters')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('parameters')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('parameters')\"></i>\n            <span class=\"section-title\">Parameters</span>\n            <span class=\"section-count\">({{ QueryInfo.Parameters.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('parameters')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Parameters.length) {\n                <div class=\"params-list\">\n                  @for (param of QueryInfo.Parameters; track TrackByParam($index, param)) {\n                    <div class=\"param-item\">\n                      <div class=\"param-header\">\n                        <span class=\"param-name\">\n                          {{ param.Name }}\n                          @if (param.IsRequired) {\n                            <span class=\"required-badge\">Required</span>\n                          }\n                        </span>\n                        <span class=\"param-type\">{{ GetParamTypeDisplay(param) }}</span>\n                      </div>\n                      @if (param.Description || param.DefaultValue) {\n                        <div class=\"param-details\">\n                          @if (param.Description) {\n                            <span class=\"param-description\">\n                              {{ param.Description }}\n                            </span>\n                          }\n                          @if (param.DefaultValue) {\n                            <span class=\"param-default\">\n                              Default: {{ param.DefaultValue }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-sliders\"></i>\n                  <span>No parameters required</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- SQL Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('sql')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('sql')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('sql')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('sql')\"></i>\n            <span class=\"section-title\">SQL Query</span>\n          </div>\n          @if (IsSectionExpanded('sql')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.SQL) {\n                <div class=\"sql-container\">\n                  <pre class=\"sql-code\">{{ QueryInfo.SQL }}</pre>\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-code\"></i>\n                  <span>SQL not available</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n      </div>\n    }\n    <!-- Footer -->\n    <div class=\"panel-footer\">\n      <button class=\"btn btn-primary\" (click)=\"OnOpenRecord()\">\n        <i class=\"fa-solid fa-external-link-alt\"></i>\n        Open Full Record\n      </button>\n      <button class=\"btn btn-secondary\" (click)=\"OnClose()\">\n        Close\n      </button>\n    </div>\n  </div>\n}\n", styles: ["/* Query Info Panel Styles */\n\n/* Overlay */\n.info-panel-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.3);\n    z-index: 999;\n}\n\n/* Panel Container */\n.info-panel {\n    position: absolute;\n    top: 0;\n    right: 0;\n    height: 100%;\n    background: #fff;\n    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n    min-width: 350px;\n    max-width: 800px;\n}\n\n/* Resize Handle */\n.resize-handle {\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    width: 6px;\n    cursor: ew-resize;\n    background: transparent;\n    transition: background 0.15s ease;\n    z-index: 10;\n}\n\n.resize-handle:hover {\n    background: rgba(92, 107, 192, 0.3);\n}\n\n.resize-handle:active {\n    background: rgba(92, 107, 192, 0.5);\n}\n\n/* Header */\n.panel-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 20px;\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n    flex-shrink: 0;\n}\n\n.header-content {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.header-icon {\n    font-size: 24px;\n    opacity: 0.9;\n}\n\n.header-text {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.header-title {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 600;\n}\n\n.header-subtitle {\n    font-size: 13px;\n    opacity: 0.85;\n}\n\n.close-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: rgba(255, 255, 255, 0.15);\n    color: #fff;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n}\n\n.close-btn:hover {\n    background: rgba(255, 255, 255, 0.25);\n}\n\n/* Content */\n.panel-content {\n    flex: 1;\n    overflow-y: auto;\n    padding: 16px;\n}\n\n/* Sections */\n.info-section {\n    margin-bottom: 8px;\n    border: 1px solid #e0e0e0;\n    border-radius: 8px;\n    overflow: hidden;\n}\n\n.info-section.expanded {\n    border-color: #c5cae9;\n}\n\n.section-header {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    background: #fafafa;\n    cursor: pointer;\n    transition: background 0.15s ease;\n    user-select: none;\n}\n\n.section-header:hover {\n    background: #f0f0f0;\n}\n\n.info-section.expanded .section-header {\n    background: #e8eaf6;\n    border-bottom: 1px solid #c5cae9;\n}\n\n.section-icon {\n    font-size: 10px;\n    color: #666;\n    width: 12px;\n    text-align: center;\n}\n\n.section-title {\n    flex: 1;\n    font-weight: 600;\n    font-size: 14px;\n    color: #333;\n}\n\n.section-count {\n    font-size: 12px;\n    color: #888;\n    font-weight: 400;\n}\n\n.section-content {\n    padding: 16px;\n    background: #fff;\n}\n\n/* Technical Description Markdown */\n.technical-description-content {\n    max-height: 400px;\n    overflow-y: auto;\n}\n\n.technical-description-content :host ::ng-deep .mj-markdown-container {\n    font-size: 13px;\n    line-height: 1.5;\n}\n\n/* Info Rows */\n.info-row {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    padding: 8px 0;\n    border-bottom: 1px solid #f0f0f0;\n}\n\n.info-row:last-child {\n    border-bottom: none;\n}\n\n.info-label {\n    font-size: 11px;\n    font-weight: 600;\n    color: #888;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.info-value {\n    font-size: 14px;\n    color: #333;\n    line-height: 1.4;\n}\n\n.info-value.description {\n    color: #555;\n    font-style: italic;\n}\n\n.category-icon {\n    color: #f9a825;\n    margin-right: 4px;\n}\n\n.status-badge {\n    display: inline-block;\n    padding: 2px 8px;\n    border-radius: 12px;\n    font-size: 12px;\n    font-weight: 500;\n    background: #f5f5f5;\n    color: #666;\n}\n\n.status-badge.approved {\n    background: #e8f5e9;\n    color: #2e7d32;\n}\n\n.text-success {\n    color: #2e7d32;\n}\n\n/* Fields List */\n.fields-list,\n.params-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.field-item,\n.param-item {\n    padding: 10px 12px;\n    background: #f8f9fa;\n    border-radius: 6px;\n    border-left: 3px solid #5c6bc0;\n}\n\n.field-header,\n.param-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 4px;\n}\n\n.field-name,\n.param-name {\n    font-weight: 600;\n    font-size: 13px;\n    color: #333;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.field-type,\n.param-type {\n    font-size: 11px;\n    font-family: 'Consolas', 'Monaco', monospace;\n    color: #666;\n    background: #e8eaf6;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.field-details,\n.param-details {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n    margin-top: 6px;\n}\n\n.field-description,\n.param-description {\n    font-size: 12px;\n    color: #666;\n    font-style: italic;\n}\n\n.field-source {\n    font-size: 11px;\n    color: #5c6bc0;\n}\n\n.field-source i {\n    margin-right: 4px;\n}\n\n.required-badge {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    background: #ffebee;\n    color: #c62828;\n    border-radius: 4px;\n    text-transform: uppercase;\n}\n\n.param-default {\n    font-size: 11px;\n    color: #888;\n}\n\n/* SQL Section */\n.sql-container {\n    background: #1e1e1e;\n    border-radius: 6px;\n    overflow: hidden;\n}\n\n.sql-code {\n    margin: 0;\n    padding: 16px;\n    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    color: #d4d4d4;\n    white-space: pre-wrap;\n    word-break: break-word;\n    overflow-x: auto;\n}\n\n/* Empty State */\n.empty-section {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 16px;\n    color: #888;\n    font-style: italic;\n}\n\n.empty-section i {\n    font-size: 16px;\n    opacity: 0.6;\n}\n\n/* Footer */\n.panel-footer {\n    display: flex;\n    justify-content: flex-start;\n    gap: 12px;\n    padding: 16px 20px;\n    background: #f5f5f5;\n    border-top: 1px solid #e0e0e0;\n    flex-shrink: 0;\n}\n\n.btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 16px;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary {\n    background: linear-gradient(135deg, #5c6bc0 0%, #3949ab 100%);\n    color: #fff;\n}\n\n.btn-primary:hover {\n    background: linear-gradient(135deg, #7986cb 0%, #5c6bc0 100%);\n    box-shadow: 0 2px 8px rgba(92, 107, 192, 0.4);\n}\n\n.btn-secondary {\n    background: #fff;\n    color: #333;\n    border: 1px solid #ddd;\n}\n\n.btn-secondary:hover {\n    background: #f5f5f5;\n    border-color: #ccc;\n}\n\n/* Scrollbar */\n.panel-content::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-content::-webkit-scrollbar-track {\n    background: #f5f5f5;\n}\n\n.panel-content::-webkit-scrollbar-thumb {\n    background: #ccc;\n    border-radius: 3px;\n}\n\n.panel-content::-webkit-scrollbar-thumb:hover {\n    background: #aaa;\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }], { QueryInfo: [{
             type: Input
         }], Visible: [{

package/dist/lib/query-info-panel/query-info-panel.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"query-info-panel.component.js","sourceRoot":"","sources":["../../../src/lib/query-info-panel/query-info-panel.component.ts","../../../src/lib/query-info-panel/query-info-panel.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Input,\n    Output,\n    EventEmitter,\n    ChangeDetectorRef,\n    ChangeDetectionStrategy,\n    OnInit,\n    OnDestroy,\n    HostListener\n} from '@angular/core';\nimport { trigger, transition, style, animate } from '@angular/animations';\nimport { Subject } from 'rxjs';\nimport { debounceTime, takeUntil } from 'rxjs/operators';\nimport { QueryInfo, QueryFieldInfo, QueryParameterInfo } from '@memberjunction/core';\nimport { UserInfoEngine } from '@memberjunction/core-entities';\n\n/**\n * User Settings key for info panel width\n */\nconst INFO_PANEL_WIDTH_KEY = 'QueryViewer_InfoPanelWidth';\n\n/**\n * Event emitted when opening the full query record\n */\nexport interface OpenQueryRecordEvent {\n    queryId: string;\n    queryName: string;\n}\n\n/**\n * A slide-in panel that displays detailed query information.\n * Features:\n * - Expandable sections for fields, parameters, and SQL\n * - Resizable width with persistence\n * - Open button to navigate to full record\n */\n@Component({\n  standalone: false,\n    selector: 'mj-query-info-panel',\n    templateUrl: './query-info-panel.component.html',\n    styleUrls: ['./query-info-panel.component.css'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    animations: [\n        trigger('slideIn', [\n            transition(':enter', [\n                style({ transform: 'translateX(100%)' }),\n                animate('250ms ease-out', style({ transform: 'translateX(0)' }))\n            ]),\n            transition(':leave', [\n                animate('200ms ease-in', style({ transform: 'translateX(100%)' }))\n            ])\n        ]),\n        trigger('fadeIn', [\n            transition(':enter', [\n                style({ opacity: 0 }),\n                animate('200ms ease-out', style({ opacity: 1 }))\n            ]),\n            transition(':leave', [\n                animate('150ms ease-in', style({ opacity: 0 }))\n            ])\n        ])\n    ]\n})\nexport class QueryInfoPanelComponent implements OnInit, OnDestroy {\n    // ========================================\n    // Inputs\n    // ========================================\n\n    @Input() QueryInfo: QueryInfo | null = null;\n    @Input() Visible: boolean = false;\n    @Input() ShowOverlay: boolean = true;\n\n    // ========================================\n    // Outputs\n    // ========================================\n\n    @Output() Close = new EventEmitter<void>();\n    @Output() OpenRecord = new EventEmitter<OpenQueryRecordEvent>();\n\n    // ========================================\n    // Internal State\n    // ========================================\n\n    public PanelWidth: number = 450;\n    public ExpandedSections: Set<string> = new Set(['overview', 'fields']);\n\n    private isResizing: boolean = false;\n    private destroy$ = new Subject<void>();\n    private widthPersistSubject = new Subject<number>();\n\n    constructor(private cdr: ChangeDetectorRef) {\n        // Debounce width persistence\n        this.widthPersistSubject.pipe(\n            debounceTime(500),\n            takeUntil(this.destroy$)\n        ).subscribe(width => {\n            this.persistPanelWidth(width);\n        });\n    }\n\n    ngOnInit(): void {\n        this.loadPanelWidth();\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    // ========================================\n    // Section Toggle\n    // ========================================\n\n    public ToggleSection(section: string): void {\n        if (this.ExpandedSections.has(section)) {\n            this.ExpandedSections.delete(section);\n        } else {\n            this.ExpandedSections.add(section);\n        }\n        this.cdr.markForCheck();\n    }\n\n    public IsSectionExpanded(section: string): boolean {\n        return this.ExpandedSections.has(section);\n    }\n\n    // ========================================\n    // Panel Actions\n    // ========================================\n\n    public OnClose(): void {\n        this.Close.emit();\n    }\n\n    public OnOpenRecord(): void {\n        if (this.QueryInfo) {\n            this.OpenRecord.emit({\n                queryId: this.QueryInfo.ID,\n                queryName: this.QueryInfo.Name\n            });\n        }\n    }\n\n    // ========================================\n    // Resize Handling\n    // ========================================\n\n    public OnResizeStart(event: MouseEvent): void {\n        event.preventDefault();\n        this.isResizing = true;\n    }\n\n    @HostListener('document:mousemove', ['$event'])\n    OnMouseMove(event: MouseEvent): void {\n        if (!this.isResizing) return;\n\n        const newWidth = window.innerWidth - event.clientX;\n        this.PanelWidth = Math.min(Math.max(newWidth, 350), 800);\n        this.widthPersistSubject.next(this.PanelWidth);\n        this.cdr.markForCheck();\n    }\n\n    @HostListener('document:mouseup')\n    OnMouseUp(): void {\n        this.isResizing = false;\n    }\n\n    // ========================================\n    // Width Persistence\n    // ========================================\n\n    private loadPanelWidth(): void {\n        try {\n            const saved = UserInfoEngine.Instance.GetSetting(INFO_PANEL_WIDTH_KEY);\n            if (saved) {\n                this.PanelWidth = parseInt(saved, 10) || 450;\n            }\n        } catch (error) {\n            console.warn('[query-info-panel] Failed to load panel width:', error);\n        }\n    }\n\n    private async persistPanelWidth(width: number): Promise<void> {\n        try {\n            await UserInfoEngine.Instance.SetSetting(INFO_PANEL_WIDTH_KEY, String(width));\n        } catch (error) {\n            console.warn('[query-info-panel] Failed to persist panel width:', error);\n        }\n    }\n\n    // ========================================\n    // Helpers\n    // ========================================\n\n    public GetFieldTypeDisplay(field: QueryFieldInfo): string {\n        return field.SQLFullType || field.SQLBaseType || 'unknown';\n    }\n\n    public GetParamTypeDisplay(param: QueryParameterInfo): string {\n        return param.Type || 'string';\n    }\n\n    public TrackByField(index: number, field: QueryFieldInfo): string {\n        return field.Name;\n    }\n\n    public TrackByParam(index: number, param: QueryParameterInfo): string {\n        return param.Name;\n    }\n}\n","<!-- Query Info Panel - Slide-in Panel -->\n@if (Visible && ShowOverlay) {\n  <div class=\"info-panel-overlay\"\n    @fadeIn\n    (click)=\"OnClose()\">\n  </div>\n}\n\n@if (Visible) {\n  <div class=\"info-panel\"\n    @slideIn\n    [style.width.px]=\"PanelWidth\">\n    <!-- Resize handle -->\n    <div class=\"resize-handle\" (mousedown)=\"OnResizeStart($event)\"></div>\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-content\">\n        <i class=\"fa-solid fa-circle-info header-icon\"></i>\n        <div class=\"header-text\">\n          <h3 class=\"header-title\">Query Information</h3>\n          @if (QueryInfo) {\n            <span class=\"header-subtitle\">{{ QueryInfo.Name }}</span>\n          }\n        </div>\n      </div>\n      <button class=\"close-btn\" (click)=\"OnClose()\" title=\"Close\">\n        <i class=\"fa-solid fa-times\"></i>\n      </button>\n    </div>\n    <!-- Content -->\n    @if (QueryInfo) {\n      <div class=\"panel-content\">\n        <!-- Overview Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('overview')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('overview')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('overview')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('overview')\"></i>\n            <span class=\"section-title\">Overview</span>\n          </div>\n          @if (IsSectionExpanded('overview')) {\n            <div class=\"section-content\">\n              <div class=\"info-row\">\n                <span class=\"info-label\">Name</span>\n                <span class=\"info-value\">{{ QueryInfo.Name }}</span>\n              </div>\n              @if (QueryInfo.Description) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Description</span>\n                  <span class=\"info-value description\">{{ QueryInfo.Description }}</span>\n                </div>\n              }\n              @if (QueryInfo.Category) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Category</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-folder category-icon\"></i>\n                    {{ QueryInfo.Category }}\n                  </span>\n                </div>\n              }\n              <div class=\"info-row\">\n                <span class=\"info-label\">Status</span>\n                <span class=\"info-value\">\n                  <span class=\"status-badge\" [class.approved]=\"QueryInfo.Status === 'Approved'\">\n                    {{ QueryInfo.Status }}\n                  </span>\n                </span>\n              </div>\n              @if (QueryInfo.OriginalSQL) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Has SQL</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-check text-success\"></i> Yes\n                  </span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Fields Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('fields')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('fields')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('fields')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('fields')\"></i>\n            <span class=\"section-title\">Fields</span>\n            <span class=\"section-count\">({{ QueryInfo.Fields.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('fields')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Fields.length) {\n                <div class=\"fields-list\">\n                  @for (field of QueryInfo.Fields; track TrackByField($index, field)) {\n                    <div class=\"field-item\">\n                      <div class=\"field-header\">\n                        <span class=\"field-name\">{{ field.Name }}</span>\n                        <span class=\"field-type\">{{ GetFieldTypeDisplay(field) }}</span>\n                      </div>\n                      @if (field.Description || field.SourceEntity) {\n                        <div class=\"field-details\">\n                          @if (field.Description) {\n                            <span class=\"field-description\">\n                              {{ field.Description }}\n                            </span>\n                          }\n                          @if (field.SourceEntity) {\n                            <span class=\"field-source\">\n                              <i class=\"fa-solid fa-link\"></i>\n                              {{ field.SourceEntity }}.{{ field.SourceFieldName }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-table-columns\"></i>\n                  <span>No fields defined</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Parameters Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('parameters')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('parameters')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('parameters')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('parameters')\"></i>\n            <span class=\"section-title\">Parameters</span>\n            <span class=\"section-count\">({{ QueryInfo.Parameters.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('parameters')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Parameters.length) {\n                <div class=\"params-list\">\n                  @for (param of QueryInfo.Parameters; track TrackByParam($index, param)) {\n                    <div class=\"param-item\">\n                      <div class=\"param-header\">\n                        <span class=\"param-name\">\n                          {{ param.Name }}\n                          @if (param.IsRequired) {\n                            <span class=\"required-badge\">Required</span>\n                          }\n                        </span>\n                        <span class=\"param-type\">{{ GetParamTypeDisplay(param) }}</span>\n                      </div>\n                      @if (param.Description || param.DefaultValue) {\n                        <div class=\"param-details\">\n                          @if (param.Description) {\n                            <span class=\"param-description\">\n                              {{ param.Description }}\n                            </span>\n                          }\n                          @if (param.DefaultValue) {\n                            <span class=\"param-default\">\n                              Default: {{ param.DefaultValue }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-sliders\"></i>\n                  <span>No parameters required</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- SQL Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('sql')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('sql')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('sql')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('sql')\"></i>\n            <span class=\"section-title\">SQL Query</span>\n          </div>\n          @if (IsSectionExpanded('sql')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.SQL) {\n                <div class=\"sql-container\">\n                  <pre class=\"sql-code\">{{ QueryInfo.SQL }}</pre>\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-code\"></i>\n                  <span>SQL not available</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n      </div>\n    }\n    <!-- Footer -->\n    <div class=\"panel-footer\">\n      <button class=\"btn btn-primary\" (click)=\"OnOpenRecord()\">\n        <i class=\"fa-solid fa-external-link-alt\"></i>\n        Open Full Record\n      </button>\n      <button class=\"btn btn-secondary\" (click)=\"OnClose()\">\n        Close\n      </button>\n    </div>\n  </div>\n}\n"]}
+{"version":3,"file":"query-info-panel.component.js","sourceRoot":"","sources":["../../../src/lib/query-info-panel/query-info-panel.component.ts","../../../src/lib/query-info-panel/query-info-panel.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Input,\n    Output,\n    EventEmitter,\n    ChangeDetectorRef,\n    ChangeDetectionStrategy,\n    OnInit,\n    OnDestroy,\n    HostListener\n} from '@angular/core';\nimport { trigger, transition, style, animate } from '@angular/animations';\nimport { Subject } from 'rxjs';\nimport { debounceTime, takeUntil } from 'rxjs/operators';\nimport { QueryInfo, QueryFieldInfo, QueryParameterInfo } from '@memberjunction/core';\nimport { UserInfoEngine } from '@memberjunction/core-entities';\n\n/**\n * User Settings key for info panel width\n */\nconst INFO_PANEL_WIDTH_KEY = 'QueryViewer_InfoPanelWidth';\n\n/**\n * Event emitted when opening the full query record\n */\nexport interface OpenQueryRecordEvent {\n    queryId: string;\n    queryName: string;\n}\n\n/**\n * A slide-in panel that displays detailed query information.\n * Features:\n * - Expandable sections for fields, parameters, and SQL\n * - Resizable width with persistence\n * - Open button to navigate to full record\n */\n@Component({\n  standalone: false,\n    selector: 'mj-query-info-panel',\n    templateUrl: './query-info-panel.component.html',\n    styleUrls: ['./query-info-panel.component.css'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    animations: [\n        trigger('slideIn', [\n            transition(':enter', [\n                style({ transform: 'translateX(100%)' }),\n                animate('250ms ease-out', style({ transform: 'translateX(0)' }))\n            ]),\n            transition(':leave', [\n                animate('200ms ease-in', style({ transform: 'translateX(100%)' }))\n            ])\n        ]),\n        trigger('fadeIn', [\n            transition(':enter', [\n                style({ opacity: 0 }),\n                animate('200ms ease-out', style({ opacity: 1 }))\n            ]),\n            transition(':leave', [\n                animate('150ms ease-in', style({ opacity: 0 }))\n            ])\n        ])\n    ]\n})\nexport class QueryInfoPanelComponent implements OnInit, OnDestroy {\n    // ========================================\n    // Inputs\n    // ========================================\n\n    @Input() QueryInfo: QueryInfo | null = null;\n    @Input() Visible: boolean = false;\n    @Input() ShowOverlay: boolean = true;\n\n    // ========================================\n    // Outputs\n    // ========================================\n\n    @Output() Close = new EventEmitter<void>();\n    @Output() OpenRecord = new EventEmitter<OpenQueryRecordEvent>();\n\n    // ========================================\n    // Internal State\n    // ========================================\n\n    public PanelWidth: number = 450;\n    public ExpandedSections: Set<string> = new Set(['overview', 'fields']);\n\n    private isResizing: boolean = false;\n    private destroy$ = new Subject<void>();\n    private widthPersistSubject = new Subject<number>();\n\n    constructor(private cdr: ChangeDetectorRef) {\n        // Debounce width persistence\n        this.widthPersistSubject.pipe(\n            debounceTime(500),\n            takeUntil(this.destroy$)\n        ).subscribe(width => {\n            this.persistPanelWidth(width);\n        });\n    }\n\n    ngOnInit(): void {\n        this.loadPanelWidth();\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    // ========================================\n    // Section Toggle\n    // ========================================\n\n    public ToggleSection(section: string): void {\n        if (this.ExpandedSections.has(section)) {\n            this.ExpandedSections.delete(section);\n        } else {\n            this.ExpandedSections.add(section);\n        }\n        this.cdr.markForCheck();\n    }\n\n    public IsSectionExpanded(section: string): boolean {\n        return this.ExpandedSections.has(section);\n    }\n\n    // ========================================\n    // Panel Actions\n    // ========================================\n\n    public OnClose(): void {\n        this.Close.emit();\n    }\n\n    public OnOpenRecord(): void {\n        if (this.QueryInfo) {\n            this.OpenRecord.emit({\n                queryId: this.QueryInfo.ID,\n                queryName: this.QueryInfo.Name\n            });\n        }\n    }\n\n    // ========================================\n    // Resize Handling\n    // ========================================\n\n    public OnResizeStart(event: MouseEvent): void {\n        event.preventDefault();\n        this.isResizing = true;\n    }\n\n    @HostListener('document:mousemove', ['$event'])\n    OnMouseMove(event: MouseEvent): void {\n        if (!this.isResizing) return;\n\n        const newWidth = window.innerWidth - event.clientX;\n        this.PanelWidth = Math.min(Math.max(newWidth, 350), 800);\n        this.widthPersistSubject.next(this.PanelWidth);\n        this.cdr.markForCheck();\n    }\n\n    @HostListener('document:mouseup')\n    OnMouseUp(): void {\n        this.isResizing = false;\n    }\n\n    // ========================================\n    // Width Persistence\n    // ========================================\n\n    private loadPanelWidth(): void {\n        try {\n            const saved = UserInfoEngine.Instance.GetSetting(INFO_PANEL_WIDTH_KEY);\n            if (saved) {\n                this.PanelWidth = parseInt(saved, 10) || 450;\n            }\n        } catch (error) {\n            console.warn('[query-info-panel] Failed to load panel width:', error);\n        }\n    }\n\n    private async persistPanelWidth(width: number): Promise<void> {\n        try {\n            await UserInfoEngine.Instance.SetSetting(INFO_PANEL_WIDTH_KEY, String(width));\n        } catch (error) {\n            console.warn('[query-info-panel] Failed to persist panel width:', error);\n        }\n    }\n\n    // ========================================\n    // Helpers\n    // ========================================\n\n    public GetFieldTypeDisplay(field: QueryFieldInfo): string {\n        return field.SQLFullType || field.SQLBaseType || 'unknown';\n    }\n\n    public GetParamTypeDisplay(param: QueryParameterInfo): string {\n        return param.Type || 'string';\n    }\n\n    public TrackByField(index: number, field: QueryFieldInfo): string {\n        return field.Name;\n    }\n\n    public TrackByParam(index: number, param: QueryParameterInfo): string {\n        return param.Name;\n    }\n}\n","<!-- Query Info Panel - Slide-in Panel -->\n@if (Visible && ShowOverlay) {\n  <div class=\"info-panel-overlay\"\n    @fadeIn\n    (click)=\"OnClose()\">\n  </div>\n}\n\n@if (Visible) {\n  <div class=\"info-panel\"\n    @slideIn\n    [style.width.px]=\"PanelWidth\">\n    <!-- Resize handle -->\n    <div class=\"resize-handle\" (mousedown)=\"OnResizeStart($event)\"></div>\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-content\">\n        <i class=\"fa-solid fa-circle-info header-icon\"></i>\n        <div class=\"header-text\">\n          <h3 class=\"header-title\">Query Information</h3>\n          @if (QueryInfo) {\n            <span class=\"header-subtitle\">{{ QueryInfo.Name }}</span>\n          }\n        </div>\n      </div>\n      <button class=\"close-btn\" (click)=\"OnClose()\" title=\"Close\">\n        <i class=\"fa-solid fa-times\"></i>\n      </button>\n    </div>\n    <!-- Content -->\n    @if (QueryInfo) {\n      <div class=\"panel-content\">\n        <!-- Overview Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('overview')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('overview')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('overview')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('overview')\"></i>\n            <span class=\"section-title\">Overview</span>\n          </div>\n          @if (IsSectionExpanded('overview')) {\n            <div class=\"section-content\">\n              <div class=\"info-row\">\n                <span class=\"info-label\">Name</span>\n                <span class=\"info-value\">{{ QueryInfo.Name }}</span>\n              </div>\n              @if (QueryInfo.Description) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Description</span>\n                  <span class=\"info-value description\">{{ QueryInfo.Description }}</span>\n                </div>\n              }\n              @if (QueryInfo.Category) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Category</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-folder category-icon\"></i>\n                    {{ QueryInfo.Category }}\n                  </span>\n                </div>\n              }\n              <div class=\"info-row\">\n                <span class=\"info-label\">Status</span>\n                <span class=\"info-value\">\n                  <span class=\"status-badge\" [class.approved]=\"QueryInfo.Status === 'Approved'\">\n                    {{ QueryInfo.Status }}\n                  </span>\n                </span>\n              </div>\n              @if (QueryInfo.OriginalSQL) {\n                <div class=\"info-row\">\n                  <span class=\"info-label\">Has SQL</span>\n                  <span class=\"info-value\">\n                    <i class=\"fa-solid fa-check text-success\"></i> Yes\n                  </span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Technical Description Section -->\n        @if (QueryInfo.TechnicalDescription) {\n          <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('technical')\">\n            <div class=\"section-header\" (click)=\"ToggleSection('technical')\">\n              <i class=\"fa-solid section-icon\"\n                [class.fa-chevron-down]=\"IsSectionExpanded('technical')\"\n                [class.fa-chevron-right]=\"!IsSectionExpanded('technical')\"></i>\n              <span class=\"section-title\">Technical Description</span>\n            </div>\n            @if (IsSectionExpanded('technical')) {\n              <div class=\"section-content technical-description-content\">\n                <mj-markdown\n                  [data]=\"QueryInfo.TechnicalDescription || ''\"\n                  [enableMermaid]=\"true\"\n                  [enableHighlight]=\"true\"\n                  [enableCollapsibleHeadings]=\"false\"\n                  [enableSmartypants]=\"true\">\n                </mj-markdown>\n              </div>\n            }\n          </div>\n        }\n        <!-- Fields Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('fields')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('fields')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('fields')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('fields')\"></i>\n            <span class=\"section-title\">Fields</span>\n            <span class=\"section-count\">({{ QueryInfo.Fields.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('fields')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Fields.length) {\n                <div class=\"fields-list\">\n                  @for (field of QueryInfo.Fields; track TrackByField($index, field)) {\n                    <div class=\"field-item\">\n                      <div class=\"field-header\">\n                        <span class=\"field-name\">{{ field.Name }}</span>\n                        <span class=\"field-type\">{{ GetFieldTypeDisplay(field) }}</span>\n                      </div>\n                      @if (field.Description || field.SourceEntity) {\n                        <div class=\"field-details\">\n                          @if (field.Description) {\n                            <span class=\"field-description\">\n                              {{ field.Description }}\n                            </span>\n                          }\n                          @if (field.SourceEntity) {\n                            <span class=\"field-source\">\n                              <i class=\"fa-solid fa-link\"></i>\n                              {{ field.SourceEntity }}.{{ field.SourceFieldName }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-table-columns\"></i>\n                  <span>No fields defined</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- Parameters Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('parameters')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('parameters')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('parameters')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('parameters')\"></i>\n            <span class=\"section-title\">Parameters</span>\n            <span class=\"section-count\">({{ QueryInfo.Parameters.length || 0 }})</span>\n          </div>\n          @if (IsSectionExpanded('parameters')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.Parameters.length) {\n                <div class=\"params-list\">\n                  @for (param of QueryInfo.Parameters; track TrackByParam($index, param)) {\n                    <div class=\"param-item\">\n                      <div class=\"param-header\">\n                        <span class=\"param-name\">\n                          {{ param.Name }}\n                          @if (param.IsRequired) {\n                            <span class=\"required-badge\">Required</span>\n                          }\n                        </span>\n                        <span class=\"param-type\">{{ GetParamTypeDisplay(param) }}</span>\n                      </div>\n                      @if (param.Description || param.DefaultValue) {\n                        <div class=\"param-details\">\n                          @if (param.Description) {\n                            <span class=\"param-description\">\n                              {{ param.Description }}\n                            </span>\n                          }\n                          @if (param.DefaultValue) {\n                            <span class=\"param-default\">\n                              Default: {{ param.DefaultValue }}\n                            </span>\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-sliders\"></i>\n                  <span>No parameters required</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n        <!-- SQL Section -->\n        <div class=\"info-section\" [class.expanded]=\"IsSectionExpanded('sql')\">\n          <div class=\"section-header\" (click)=\"ToggleSection('sql')\">\n            <i class=\"fa-solid section-icon\"\n              [class.fa-chevron-down]=\"IsSectionExpanded('sql')\"\n            [class.fa-chevron-right]=\"!IsSectionExpanded('sql')\"></i>\n            <span class=\"section-title\">SQL Query</span>\n          </div>\n          @if (IsSectionExpanded('sql')) {\n            <div class=\"section-content\">\n              @if (QueryInfo.SQL) {\n                <div class=\"sql-container\">\n                  <pre class=\"sql-code\">{{ QueryInfo.SQL }}</pre>\n                </div>\n              } @else {\n                <div class=\"empty-section\">\n                  <i class=\"fa-solid fa-code\"></i>\n                  <span>SQL not available</span>\n                </div>\n              }\n            </div>\n          }\n        </div>\n      </div>\n    }\n    <!-- Footer -->\n    <div class=\"panel-footer\">\n      <button class=\"btn btn-primary\" (click)=\"OnOpenRecord()\">\n        <i class=\"fa-solid fa-external-link-alt\"></i>\n        Open Full Record\n      </button>\n      <button class=\"btn btn-secondary\" (click)=\"OnClose()\">\n        Close\n      </button>\n    </div>\n  </div>\n}\n"]}

package/dist/lib/query-viewer.module.d.ts

@@ -9,9 +9,10 @@ import * as i7 from "@angular/forms";
 import * as i8 from "ag-grid-angular";
 import * as i9 from "@memberjunction/ng-shared-generic";
 import * as i10 from "@memberjunction/ng-export-service";
+import * as i11 from "@memberjunction/ng-markdown";
 export declare class QueryViewerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<QueryViewerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<QueryViewerModule, [typeof i1.QueryDataGridComponent, typeof i2.QueryParameterFormComponent, typeof i3.QueryViewerComponent, typeof i4.QueryRowDetailComponent, typeof i5.QueryInfoPanelComponent], [typeof i6.CommonModule, typeof i7.FormsModule, typeof i8.AgGridModule, typeof i9.SharedGenericModule, typeof i10.ExportServiceModule], [typeof i1.QueryDataGridComponent, typeof i2.QueryParameterFormComponent, typeof i3.QueryViewerComponent, typeof i4.QueryRowDetailComponent, typeof i5.QueryInfoPanelComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<QueryViewerModule, [typeof i1.QueryDataGridComponent, typeof i2.QueryParameterFormComponent, typeof i3.QueryViewerComponent, typeof i4.QueryRowDetailComponent, typeof i5.QueryInfoPanelComponent], [typeof i6.CommonModule, typeof i7.FormsModule, typeof i8.AgGridModule, typeof i9.SharedGenericModule, typeof i10.ExportServiceModule, typeof i11.MarkdownModule], [typeof i1.QueryDataGridComponent, typeof i2.QueryParameterFormComponent, typeof i3.QueryViewerComponent, typeof i4.QueryRowDetailComponent, typeof i5.QueryInfoPanelComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<QueryViewerModule>;
 }
 //# sourceMappingURL=query-viewer.module.d.ts.map

package/dist/lib/query-viewer.module.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"query-viewer.module.d.ts","sourceRoot":"","sources":["../../src/lib/query-viewer.module.ts"],"names":[],"mappings":";;;;;;;;;;;AAkBA,qBAuBa,iBAAiB;yCAAjB,iBAAiB;0CAAjB,iBAAiB;0CAAjB,iBAAiB;CAAI"}
+{"version":3,"file":"query-viewer.module.d.ts","sourceRoot":"","sources":["../../src/lib/query-viewer.module.ts"],"names":[],"mappings":";;;;;;;;;;;;AAmBA,qBAwBa,iBAAiB;yCAAjB,iBAAiB;0CAAjB,iBAAiB;0CAAjB,iBAAiB;CAAI"}

package/dist/lib/query-viewer.module.js

@@ -6,6 +6,7 @@ import { AgGridModule } from 'ag-grid-angular';
 // MJ Components
 import { SharedGenericModule } from '@memberjunction/ng-shared-generic';
 import { ExportServiceModule } from '@memberjunction/ng-export-service';
+import { MarkdownModule } from '@memberjunction/ng-markdown';
 // Query Viewer Components
 import { QueryDataGridComponent } from './query-data-grid/query-data-grid.component';
 import { QueryParameterFormComponent } from './query-parameter-form/query-parameter-form.component';
@@ -20,7 +21,8 @@ export class QueryViewerModule {
             FormsModule,
             AgGridModule,
             SharedGenericModule,
-            ExportServiceModule] });
+            ExportServiceModule,
+            MarkdownModule] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryViewerModule, [{
         type: NgModule,
@@ -37,7 +39,8 @@ export class QueryViewerModule {
                     FormsModule,
                     AgGridModule,
                     SharedGenericModule,
-                    ExportServiceModule
+                    ExportServiceModule,
+                    MarkdownModule
                 ],
                 exports: [
                     QueryDataGridComponent,
@@ -56,7 +59,8 @@ export class QueryViewerModule {
         FormsModule,
         AgGridModule,
         SharedGenericModule,
-        ExportServiceModule], exports: [QueryDataGridComponent,
+        ExportServiceModule,
+        MarkdownModule], exports: [QueryDataGridComponent,
         QueryParameterFormComponent,
         QueryViewerComponent,
         QueryRowDetailComponent,

package/dist/lib/query-viewer.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"query-viewer.module.js","sourceRoot":"","sources":["../../src/lib/query-viewer.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,UAAU;AACV,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,gBAAgB;AAChB,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAExE,0BAA0B;AAC1B,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,2BAA2B,EAAE,MAAM,uDAAuD,CAAC;AACpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,uBAAuB,EAAE,MAAM,+CAA+C,CAAC;AACxF,OAAO,EAAE,uBAAuB,EAAE,MAAM,+CAA+C,CAAC;;AAyBxF,MAAM,OAAO,iBAAiB;2GAAjB,iBAAiB;4DAAjB,iBAAiB;gEAdtB,YAAY;YACZ,WAAW;YACX,YAAY;YACZ,mBAAmB;YACnB,mBAAmB;;iFAUd,iBAAiB;cAvB7B,QAAQ;eAAC;gBACN,YAAY,EAAE;oBACV,sBAAsB;oBACtB,2BAA2B;oBAC3B,oBAAoB;oBACpB,uBAAuB;oBACvB,uBAAuB;iBAC1B;gBACD,OAAO,EAAE;oBACL,YAAY;oBACZ,WAAW;oBACX,YAAY;oBACZ,mBAAmB;oBACnB,mBAAmB;iBACtB;gBACD,OAAO,EAAE;oBACL,sBAAsB;oBACtB,2BAA2B;oBAC3B,oBAAoB;oBACpB,uBAAuB;oBACvB,uBAAuB;iBAC1B;aACJ;;wFACY,iBAAiB,mBArBtB,sBAAsB;QACtB,2BAA2B;QAC3B,oBAAoB;QACpB,uBAAuB;QACvB,uBAAuB,aAGvB,YAAY;QACZ,WAAW;QACX,YAAY;QACZ,mBAAmB;QACnB,mBAAmB,aAGnB,sBAAsB;QACtB,2BAA2B;QAC3B,oBAAoB;QACpB,uBAAuB;QACvB,uBAAuB","sourcesContent":["import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\n\n// AG Grid\nimport { AgGridModule } from 'ag-grid-angular';\n\n// MJ Components\nimport { SharedGenericModule } from '@memberjunction/ng-shared-generic';\nimport { ExportServiceModule } from '@memberjunction/ng-export-service';\n\n// Query Viewer Components\nimport { QueryDataGridComponent } from './query-data-grid/query-data-grid.component';\nimport { QueryParameterFormComponent } from './query-parameter-form/query-parameter-form.component';\nimport { QueryViewerComponent } from './query-viewer/query-viewer.component';\nimport { QueryRowDetailComponent } from './query-row-detail/query-row-detail.component';\nimport { QueryInfoPanelComponent } from './query-info-panel/query-info-panel.component';\n\n@NgModule({\n    declarations: [\n        QueryDataGridComponent,\n        QueryParameterFormComponent,\n        QueryViewerComponent,\n        QueryRowDetailComponent,\n        QueryInfoPanelComponent\n    ],\n    imports: [\n        CommonModule,\n        FormsModule,\n        AgGridModule,\n        SharedGenericModule,\n        ExportServiceModule\n    ],\n    exports: [\n        QueryDataGridComponent,\n        QueryParameterFormComponent,\n        QueryViewerComponent,\n        QueryRowDetailComponent,\n        QueryInfoPanelComponent\n    ]\n})\nexport class QueryViewerModule { }\n"]}
+{"version":3,"file":"query-viewer.module.js","sourceRoot":"","sources":["../../src/lib/query-viewer.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,UAAU;AACV,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,gBAAgB;AAChB,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,0BAA0B;AAC1B,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,2BAA2B,EAAE,MAAM,uDAAuD,CAAC;AACpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,uBAAuB,EAAE,MAAM,+CAA+C,CAAC;AACxF,OAAO,EAAE,uBAAuB,EAAE,MAAM,+CAA+C,CAAC;;AA0BxF,MAAM,OAAO,iBAAiB;2GAAjB,iBAAiB;4DAAjB,iBAAiB;gEAftB,YAAY;YACZ,WAAW;YACX,YAAY;YACZ,mBAAmB;YACnB,mBAAmB;YACnB,cAAc;;iFAUT,iBAAiB;cAxB7B,QAAQ;eAAC;gBACN,YAAY,EAAE;oBACV,sBAAsB;oBACtB,2BAA2B;oBAC3B,oBAAoB;oBACpB,uBAAuB;oBACvB,uBAAuB;iBAC1B;gBACD,OAAO,EAAE;oBACL,YAAY;oBACZ,WAAW;oBACX,YAAY;oBACZ,mBAAmB;oBACnB,mBAAmB;oBACnB,cAAc;iBACjB;gBACD,OAAO,EAAE;oBACL,sBAAsB;oBACtB,2BAA2B;oBAC3B,oBAAoB;oBACpB,uBAAuB;oBACvB,uBAAuB;iBAC1B;aACJ;;wFACY,iBAAiB,mBAtBtB,sBAAsB;QACtB,2BAA2B;QAC3B,oBAAoB;QACpB,uBAAuB;QACvB,uBAAuB,aAGvB,YAAY;QACZ,WAAW;QACX,YAAY;QACZ,mBAAmB;QACnB,mBAAmB;QACnB,cAAc,aAGd,sBAAsB;QACtB,2BAA2B;QAC3B,oBAAoB;QACpB,uBAAuB;QACvB,uBAAuB","sourcesContent":["import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\n\n// AG Grid\nimport { AgGridModule } from 'ag-grid-angular';\n\n// MJ Components\nimport { SharedGenericModule } from '@memberjunction/ng-shared-generic';\nimport { ExportServiceModule } from '@memberjunction/ng-export-service';\nimport { MarkdownModule } from '@memberjunction/ng-markdown';\n\n// Query Viewer Components\nimport { QueryDataGridComponent } from './query-data-grid/query-data-grid.component';\nimport { QueryParameterFormComponent } from './query-parameter-form/query-parameter-form.component';\nimport { QueryViewerComponent } from './query-viewer/query-viewer.component';\nimport { QueryRowDetailComponent } from './query-row-detail/query-row-detail.component';\nimport { QueryInfoPanelComponent } from './query-info-panel/query-info-panel.component';\n\n@NgModule({\n    declarations: [\n        QueryDataGridComponent,\n        QueryParameterFormComponent,\n        QueryViewerComponent,\n        QueryRowDetailComponent,\n        QueryInfoPanelComponent\n    ],\n    imports: [\n        CommonModule,\n        FormsModule,\n        AgGridModule,\n        SharedGenericModule,\n        ExportServiceModule,\n        MarkdownModule\n    ],\n    exports: [\n        QueryDataGridComponent,\n        QueryParameterFormComponent,\n        QueryViewerComponent,\n        QueryRowDetailComponent,\n        QueryInfoPanelComponent\n    ]\n})\nexport class QueryViewerModule { }\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-query-viewer",
-  "version": "5.9.0",
+  "version": "5.10.1",
   "description": "MemberJunction: Angular components for viewing and executing stored queries with parameter input, interactive results grid, and entity linking",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -37,13 +37,14 @@
     "ag-grid-community": "^35.0.1"
   },
   "dependencies": {
-    "@memberjunction/core-entities": "5.9.0",
-    "@memberjunction/export-engine": "5.9.0",
-    "@memberjunction/global": "5.9.0",
-    "@memberjunction/core": "5.9.0",
-    "@memberjunction/ng-shared-generic": "5.9.0",
-    "@memberjunction/ng-export-service": "5.9.0",
-    "@memberjunction/ng-notifications": "5.9.0",
+    "@memberjunction/core-entities": "5.10.1",
+    "@memberjunction/export-engine": "5.10.1",
+    "@memberjunction/global": "5.10.1",
+    "@memberjunction/core": "5.10.1",
+    "@memberjunction/ng-shared-generic": "5.10.1",
+    "@memberjunction/ng-export-service": "5.10.1",
+    "@memberjunction/ng-markdown": "5.10.1",
+    "@memberjunction/ng-notifications": "5.10.1",
     "rxjs": "^7.8.2",
     "tslib": "^2.8.1"
   },