@memberjunction/ng-entity-viewer 3.1.1 → 3.3.0

package/dist/lib/aggregate-setup-dialog/aggregate-setup-dialog.component.js

@@ -0,0 +1,948 @@
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+const _forTrack0 = ($index, $item) => $item.value;
+const _forTrack1 = ($index, $item) => $item.ID;
+function AggregateSetupDialogComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onClose()); });
+    i0.ɵɵelementEnd();
+} }
+function AggregateSetupDialogComponent_Conditional_23_For_10_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 51);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_23_For_10_Template_button_click_0_listener() { const func_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.selectFunction(func_r5.value)); });
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const func_r5 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("active", ctx_r1.SelectedFunction === func_r5.value);
+    i0.ɵɵproperty("title", func_r5.label);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(func_r5.icon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(func_r5.label);
+} }
+function AggregateSetupDialogComponent_Conditional_23_For_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 47);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const field_r6 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("value", field_r6.Name);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.getFieldDisplayLabel(field_r6));
+} }
+function AggregateSetupDialogComponent_Conditional_23_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 48);
+    i0.ɵɵelement(1, "i", 52);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "No numeric fields available. Use COUNT or switch to Advanced mode.");
+    i0.ɵɵelementEnd()();
+} }
+function AggregateSetupDialogComponent_Conditional_23_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 49);
+    i0.ɵɵelement(1, "i", 42);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "No column selected - will count all records (COUNT(*))");
+    i0.ɵɵelementEnd()();
+} }
+function AggregateSetupDialogComponent_Conditional_23_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 50)(1, "label", 53);
+    i0.ɵɵtext(2, "Expression Preview");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "code", 54);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(!ctx_r1.SelectedColumn && ctx_r1.SelectedFunction === "COUNT" ? "COUNT(*)" : ctx_r1.SelectedFunction === "COUNT_DISTINCT" ? "COUNT(DISTINCT " + ctx_r1.SelectedColumn + ")" : ctx_r1.SelectedFunction + "(" + ctx_r1.SelectedColumn + ")");
+} }
+function AggregateSetupDialogComponent_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 15)(1, "div", 41);
+    i0.ɵɵelement(2, "i", 42);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Select a column and an aggregate function to calculate");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 20)(6, "label", 23);
+    i0.ɵɵtext(7, "Function");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 43);
+    i0.ɵɵrepeaterCreate(9, AggregateSetupDialogComponent_Conditional_23_For_10_Template, 4, 6, "button", 44, _forTrack0);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(11, "div", 20)(12, "label", 23);
+    i0.ɵɵtext(13, "Column");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "select", 45);
+    i0.ɵɵtwoWayListener("ngModelChange", function AggregateSetupDialogComponent_Conditional_23_Template_select_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.SelectedColumn, $event) || (ctx_r1.SelectedColumn = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("ngModelChange", function AggregateSetupDialogComponent_Conditional_23_Template_select_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onColumnSelected($event)); });
+    i0.ɵɵelementStart(15, "option", 46);
+    i0.ɵɵtext(16, "Select a column...");
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(17, AggregateSetupDialogComponent_Conditional_23_For_18_Template, 2, 2, "option", 47, _forTrack1);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(19, AggregateSetupDialogComponent_Conditional_23_Conditional_19_Template, 4, 0, "div", 48)(20, AggregateSetupDialogComponent_Conditional_23_Conditional_20_Template, 4, 0, "div", 49);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(21, AggregateSetupDialogComponent_Conditional_23_Conditional_21_Template, 5, 1, "div", 50);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(9);
+    i0.ɵɵrepeater(ctx_r1.AggregateFunctions);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.SelectedColumn);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.AvailableFields);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.SelectedFunction !== "COUNT" && ctx_r1.SelectedFunction !== "COUNT_DISTINCT" && ctx_r1.NumericFields.length === 0 ? 19 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.SelectedFunction === "COUNT" && !ctx_r1.SelectedColumn ? 20 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.SelectedFunction && (ctx_r1.SelectedColumn || ctx_r1.SelectedFunction === "COUNT") ? 21 : -1);
+} }
+function AggregateSetupDialogComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 16)(1, "div", 41);
+    i0.ɵɵelement(2, "i", 42);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Write a custom SQL aggregate expression. Use field names as they appear in the database.");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 20)(6, "label", 23);
+    i0.ɵɵtext(7, "SQL Expression");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "textarea", 55);
+    i0.ɵɵtwoWayListener("ngModelChange", function AggregateSetupDialogComponent_Conditional_24_Template_textarea_ngModelChange_8_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.Expression, $event) || (ctx_r1.Expression = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "div", 56);
+    i0.ɵɵelement(10, "i", 57);
+    i0.ɵɵelementStart(11, "span");
+    i0.ɵɵtext(12, "Tip: Use brackets for column names with spaces, e.g., [Total Amount]");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(13, "div", 20)(14, "label", 58);
+    i0.ɵɵtext(15, "Quick Examples");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "div", 59)(17, "button", 60);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_24_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Expression = "SUM(Amount)"); });
+    i0.ɵɵtext(18, " SUM(Amount) ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "button", 60);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_24_Template_button_click_19_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Expression = "AVG(Price * Quantity)"); });
+    i0.ɵɵtext(20, " AVG(Price * Quantity) ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(21, "button", 60);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_24_Template_button_click_21_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Expression = "COUNT(CASE WHEN Status = 'Active' THEN 1 END)"); });
+    i0.ɵɵtext(22, " COUNT with condition ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(23, "button", 60);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_24_Template_button_click_23_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Expression = "SUM(CASE WHEN Type = 'Credit' THEN Amount ELSE -Amount END)"); });
+    i0.ɵɵtext(24, " Conditional SUM ");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(8);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.Expression);
+} }
+function AggregateSetupDialogComponent_Conditional_25_Conditional_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 69);
+    i0.ɵɵelementStart(1, "span");
+    i0.ɵɵtext(2, "Generating...");
+    i0.ɵɵelementEnd();
+} }
+function AggregateSetupDialogComponent_Conditional_25_Conditional_10_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 13);
+    i0.ɵɵelementStart(1, "span");
+    i0.ɵɵtext(2, "Generate");
+    i0.ɵɵelementEnd();
+} }
+function AggregateSetupDialogComponent_Conditional_25_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 68);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_25_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onGenerateFromPrompt()); });
+    i0.ɵɵtemplate(1, AggregateSetupDialogComponent_Conditional_25_Conditional_10_Conditional_1_Template, 3, 0)(2, AggregateSetupDialogComponent_Conditional_25_Conditional_10_Conditional_2_Template, 3, 0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("disabled", !ctx_r1.SmartPrompt.trim() || ctx_r1.IsGenerating);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.IsGenerating ? 1 : 2);
+} }
+function AggregateSetupDialogComponent_Conditional_25_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 64)(1, "div", 70)(2, "label", 23);
+    i0.ɵɵtext(3, "Generated Expression");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "button", 71);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_25_Conditional_11_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.clearGeneratedExpression()); });
+    i0.ɵɵelement(5, "i", 72);
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7, "Edit Prompt");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(8, "code", 73);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "div", 74);
+    i0.ɵɵelement(11, "i", 42);
+    i0.ɵɵelementStart(12, "span");
+    i0.ɵɵtext(13, "This expression was generated from your description. Clear it to edit the prompt.");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(9);
+    i0.ɵɵtextInterpolate(ctx_r1.GeneratedExpression);
+} }
+function AggregateSetupDialogComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 17)(1, "div", 41);
+    i0.ɵɵelement(2, "i", 13);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Describe what you want to calculate in plain English. AI will generate the expression.");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 20)(6, "label", 23);
+    i0.ɵɵtext(7, "What would you like to calculate?");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 61)(9, "textarea", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function AggregateSetupDialogComponent_Conditional_25_Template_textarea_ngModelChange_9_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.SmartPrompt, $event) || (ctx_r1.SmartPrompt = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(10, AggregateSetupDialogComponent_Conditional_25_Conditional_10_Template, 3, 2, "button", 63);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(11, AggregateSetupDialogComponent_Conditional_25_Conditional_11_Template, 14, 1, "div", 64);
+    i0.ɵɵelementStart(12, "div", 65)(13, "div", 66);
+    i0.ɵɵelement(14, "i", 57);
+    i0.ɵɵelementStart(15, "span");
+    i0.ɵɵtext(16, "Tips for better results:");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(17, "ul", 67)(18, "li");
+    i0.ɵɵtext(19, "Be specific about which fields to use");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(20, "li");
+    i0.ɵɵtext(21, "Mention any conditions or filters");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(22, "li");
+    i0.ɵɵtext(23, "Specify the type of calculation (sum, average, count, etc.)");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(9);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.SmartPrompt);
+    i0.ɵɵproperty("disabled", !!ctx_r1.GeneratedExpression);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.GeneratedExpression ? 10 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.GeneratedExpression ? 11 : -1);
+} }
+function AggregateSetupDialogComponent_Conditional_62_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementStart(2, "button", 75);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Conditional_62_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clearIcon()); });
+    i0.ɵɵelement(3, "i", 6);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.Icon);
+} }
+function AggregateSetupDialogComponent_For_65_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 76);
+    i0.ɵɵlistener("click", function AggregateSetupDialogComponent_For_65_Template_button_click_0_listener() { const icon_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.selectIcon(icon_r13)); });
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const icon_r13 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("active", ctx_r1.Icon === icon_r13);
+    i0.ɵɵproperty("title", icon_r13);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(icon_r13);
+} }
+function AggregateSetupDialogComponent_Conditional_74_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 39);
+    i0.ɵɵelement(1, "i", 77);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r1.ValidationMessage);
+} }
+/**
+ * Default icons for aggregate functions
+ */
+const FUNCTION_ICONS = {
+    'SUM': 'fa-solid fa-plus',
+    'AVG': 'fa-solid fa-divide',
+    'COUNT': 'fa-solid fa-hashtag',
+    'MIN': 'fa-solid fa-arrow-down',
+    'MAX': 'fa-solid fa-arrow-up',
+    'COUNT_DISTINCT': 'fa-solid fa-fingerprint'
+};
+/**
+ * Friendly labels for aggregate functions
+ */
+const FUNCTION_LABELS = {
+    'SUM': 'Sum',
+    'AVG': 'Average',
+    'COUNT': 'Count',
+    'MIN': 'Minimum',
+    'MAX': 'Maximum',
+    'COUNT_DISTINCT': 'Count Distinct'
+};
+/**
+ * AggregateSetupDialogComponent - Dialog for creating/editing aggregate configurations
+ *
+ * Features:
+ * - Simple mode: Pick column + aggregate function (SUM, AVG, COUNT, etc.)
+ * - Advanced mode: Write custom SQL expression
+ * - Smart mode: Describe in natural language (AI generates expression)
+ * - Progressive disclosure - simple mode covers 80% of use cases
+ * - Display type selection (card or column)
+ * - Optional label and icon customization
+ */
+export class AggregateSetupDialogComponent {
+    cdr;
+    /**
+     * The entity being viewed - provides field information
+     */
+    Entity = null;
+    /**
+     * Existing aggregate to edit (null for new)
+     */
+    Aggregate = null;
+    /**
+     * Whether the dialog is open
+     */
+    IsOpen = false;
+    /**
+     * Emitted when the dialog is closed
+     */
+    Close = new EventEmitter();
+    /**
+     * Emitted when an aggregate is saved
+     */
+    Save = new EventEmitter();
+    // Setup mode
+    Mode = 'simple';
+    // Simple mode state
+    SelectedColumn = '';
+    SelectedFunction = 'SUM';
+    // Advanced mode state
+    Expression = '';
+    // Smart mode state
+    SmartPrompt = '';
+    GeneratedExpression = '';
+    IsGenerating = false;
+    // Common configuration
+    Label = '';
+    DisplayType = 'card';
+    Icon = '';
+    Description = '';
+    // Available functions
+    AggregateFunctions = [
+        { value: 'SUM', label: 'Sum', icon: 'fa-solid fa-plus' },
+        { value: 'AVG', label: 'Average', icon: 'fa-solid fa-divide' },
+        { value: 'COUNT', label: 'Count', icon: 'fa-solid fa-hashtag' },
+        { value: 'MIN', label: 'Minimum', icon: 'fa-solid fa-arrow-down' },
+        { value: 'MAX', label: 'Maximum', icon: 'fa-solid fa-arrow-up' },
+        { value: 'COUNT_DISTINCT', label: 'Count Distinct', icon: 'fa-solid fa-fingerprint' }
+    ];
+    // Common icons for selection
+    CommonIcons = [
+        'fa-solid fa-chart-line',
+        'fa-solid fa-chart-bar',
+        'fa-solid fa-dollar-sign',
+        'fa-solid fa-users',
+        'fa-solid fa-shopping-cart',
+        'fa-solid fa-box',
+        'fa-solid fa-clock',
+        'fa-solid fa-calendar',
+        'fa-solid fa-percent',
+        'fa-solid fa-star',
+        'fa-solid fa-check-circle',
+        'fa-solid fa-exclamation-triangle'
+    ];
+    constructor(cdr) {
+        this.cdr = cdr;
+    }
+    ngOnInit() {
+        this.initializeFromAggregate();
+    }
+    ngOnChanges(changes) {
+        // Re-initialize when dialog opens or aggregate changes
+        if (changes['IsOpen'] && this.IsOpen) {
+            this.initializeFromAggregate();
+        }
+        if (changes['Aggregate'] && !changes['Aggregate'].firstChange) {
+            this.initializeFromAggregate();
+        }
+    }
+    /**
+     * Initialize form state from existing aggregate (if editing)
+     */
+    initializeFromAggregate() {
+        if (!this.Aggregate) {
+            this.resetForm();
+            return;
+        }
+        const agg = this.Aggregate;
+        // Set common fields
+        this.Label = agg.label || '';
+        this.DisplayType = agg.displayType || 'card';
+        this.Icon = agg.icon || '';
+        this.Description = agg.description || '';
+        // Determine mode and populate fields
+        if (agg.smartPrompt) {
+            // Smart mode - has AI prompt
+            this.Mode = 'smart';
+            this.SmartPrompt = agg.smartPrompt;
+            this.GeneratedExpression = agg.expression;
+            this.Expression = agg.expression;
+        }
+        else if (this.isSimpleExpression(agg.expression)) {
+            // Simple mode - can be represented as function(column)
+            this.Mode = 'simple';
+            const parsed = this.parseSimpleExpression(agg.expression);
+            if (parsed) {
+                this.SelectedFunction = parsed.func;
+                this.SelectedColumn = parsed.column;
+                this._previousColumn = parsed.column; // Track for auto-label updates
+            }
+        }
+        else {
+            // Advanced mode - custom expression
+            this.Mode = 'advanced';
+            this.Expression = agg.expression;
+        }
+        this.cdr.detectChanges();
+    }
+    /**
+     * Reset form to default state
+     */
+    resetForm() {
+        this.Mode = 'simple';
+        this.SelectedColumn = '';
+        this._previousColumn = ''; // Reset previous column tracking
+        this.SelectedFunction = 'SUM';
+        this.Expression = '';
+        this.SmartPrompt = '';
+        this.GeneratedExpression = '';
+        this.Label = '';
+        this.DisplayType = 'card';
+        this.Icon = '';
+        this.Description = '';
+    }
+    /**
+     * Check if an expression matches simple function(column) pattern
+     * Also matches COUNT(*) for row counting
+     */
+    isSimpleExpression(expression) {
+        const pattern = /^(SUM|AVG|COUNT|MIN|MAX|COUNT_DISTINCT)\s*\(\s*(\*|\[?[\w\s]+\]?)\s*\)$/i;
+        return pattern.test(expression.trim());
+    }
+    /**
+     * Parse a simple expression into function and column
+     * Returns empty string for column if COUNT(*)
+     */
+    parseSimpleExpression(expression) {
+        const match = expression.trim().match(/^(SUM|AVG|COUNT|MIN|MAX|COUNT_DISTINCT)\s*\(\s*(\*|\[?([\w\s]+)\]?)\s*\)$/i);
+        if (!match)
+            return null;
+        const funcName = match[1].toUpperCase().replace(' ', '_');
+        // If it's COUNT(*), column will be empty string
+        const column = match[2] === '*' ? '' : (match[3] || match[2]).trim();
+        return { func: funcName, column };
+    }
+    /**
+     * Get numeric fields for SUM/AVG operations
+     */
+    get NumericFields() {
+        if (!this.Entity)
+            return [];
+        return this.Entity.Fields.filter(f => {
+            const sqlType = f.Type.toLowerCase();
+            return sqlType.includes('int') ||
+                sqlType.includes('decimal') ||
+                sqlType.includes('numeric') ||
+                sqlType.includes('float') ||
+                sqlType.includes('real') ||
+                sqlType.includes('money');
+        });
+    }
+    /**
+     * Get date/datetime fields for MIN/MAX operations
+     */
+    get DateFields() {
+        if (!this.Entity)
+            return [];
+        return this.Entity.Fields.filter(f => {
+            const sqlType = f.Type.toLowerCase();
+            return sqlType.includes('date') || sqlType.includes('time');
+        });
+    }
+    /**
+     * Get string fields for MIN/MAX operations
+     */
+    get StringFields() {
+        if (!this.Entity)
+            return [];
+        return this.Entity.Fields.filter(f => {
+            const sqlType = f.Type.toLowerCase();
+            return (sqlType.includes('char') || sqlType.includes('text')) && !f.IsBinaryFieldType;
+        });
+    }
+    /**
+     * Get all fields for COUNT operations
+     */
+    get AllFields() {
+        if (!this.Entity)
+            return [];
+        return this.Entity.Fields.filter(f => !f.IsBinaryFieldType);
+    }
+    /**
+     * Get fields available for current function
+     */
+    get AvailableFields() {
+        // COUNT and COUNT_DISTINCT can use any field
+        if (this.SelectedFunction === 'COUNT' || this.SelectedFunction === 'COUNT_DISTINCT') {
+            return this.AllFields;
+        }
+        // SUM and AVG only work with numeric fields
+        if (this.SelectedFunction === 'SUM' || this.SelectedFunction === 'AVG') {
+            return this.NumericFields;
+        }
+        // MIN and MAX work with numeric and date fields only (not text/varchar)
+        if (this.SelectedFunction === 'MIN' || this.SelectedFunction === 'MAX') {
+            // Combine numeric and date fields (avoiding duplicates)
+            const combined = [...this.NumericFields, ...this.DateFields];
+            // Remove duplicates by field ID
+            const seen = new Set();
+            return combined.filter(f => {
+                if (seen.has(f.ID))
+                    return false;
+                seen.add(f.ID);
+                return true;
+            });
+        }
+        // Default to all fields
+        return this.AllFields;
+    }
+    /**
+     * Set the setup mode
+     */
+    setMode(mode) {
+        this.Mode = mode;
+        // If switching from smart mode with generated expression, populate advanced mode
+        if (mode === 'advanced' && this.GeneratedExpression) {
+            this.Expression = this.GeneratedExpression;
+        }
+        this.cdr.detectChanges();
+    }
+    /**
+     * Handle function button click - captures old value before changing
+     * Called from template when user clicks a function button
+     */
+    selectFunction(newFunction) {
+        if (newFunction === this.SelectedFunction)
+            return;
+        const previousFunction = this.SelectedFunction;
+        this.SelectedFunction = newFunction;
+        this.onFunctionChange(previousFunction);
+    }
+    /**
+     * Handle column selection from dropdown
+     * Called from template with the NEW value from ngModelChange
+     * We track the previous value internally
+     */
+    _previousColumn = '';
+    onColumnSelected(newColumn) {
+        const previousColumn = this._previousColumn;
+        this._previousColumn = newColumn;
+        this.onColumnChange(previousColumn);
+    }
+    /**
+     * Handle function selection change (internal)
+     */
+    onFunctionChange(previousFunction) {
+        // Check if label matches what we would have auto-generated for the OLD function
+        const shouldUpdateLabel = this.shouldAutoUpdateLabel(previousFunction, this.SelectedColumn);
+        // If current column is not valid for new function, clear it
+        const validFields = this.AvailableFields;
+        if (this.SelectedColumn && !validFields.find(f => f.Name === this.SelectedColumn)) {
+            this.SelectedColumn = '';
+        }
+        // Update label if it was auto-generated (matches old pattern) or is empty
+        // For COUNT, we can set auto-label even without a column (COUNT(*))
+        if (shouldUpdateLabel && (this.SelectedColumn || this.SelectedFunction === 'COUNT')) {
+            this.setAutoLabel();
+        }
+        this.cdr.detectChanges();
+    }
+    /**
+     * Handle column selection change
+     */
+    onColumnChange(previousColumn) {
+        // Check if label matches what we would have auto-generated for the OLD column
+        const shouldUpdateLabel = this.shouldAutoUpdateLabel(this.SelectedFunction, previousColumn);
+        // Update label if it was auto-generated (matches old pattern) or is empty
+        if (shouldUpdateLabel) {
+            this.setAutoLabel();
+        }
+        this.cdr.detectChanges();
+    }
+    /**
+     * Check if the current label matches what we would have auto-generated
+     * for the given function and column. If so, we should update the label
+     * when either changes. This allows auto-updating while preserving manual edits.
+     */
+    shouldAutoUpdateLabel(func, column) {
+        // Always update if label is empty
+        if (!this.Label)
+            return true;
+        // Check if current label matches the auto-generated pattern for the old values
+        const expectedOldLabel = this.generateAutoLabel(func, column);
+        return expectedOldLabel !== null && this.Label === expectedOldLabel;
+    }
+    /**
+     * Generate what the auto-label would be for a given function and column
+     * Returns null if we can't generate a label (missing data)
+     * Handles COUNT(*) case with "Record Count" label
+     */
+    generateAutoLabel(func, column) {
+        if (!func)
+            return null;
+        // Handle COUNT(*) case - no column needed
+        if (!column) {
+            if (func === 'COUNT') {
+                return 'Record Count';
+            }
+            return null; // Other functions require a column
+        }
+        const field = this.Entity?.Fields.find(f => f.Name === column);
+        if (!field)
+            return null;
+        const funcLabel = FUNCTION_LABELS[func] || func;
+        return `${funcLabel} of ${field.DisplayNameOrName}`;
+    }
+    /**
+     * Set the auto-generated label based on current function and column
+     */
+    setAutoLabel() {
+        const label = this.generateAutoLabel(this.SelectedFunction, this.SelectedColumn);
+        if (label) {
+            this.Label = label;
+        }
+    }
+    /**
+     * Select an icon
+     */
+    selectIcon(icon) {
+        this.Icon = icon;
+        this.cdr.detectChanges();
+    }
+    /**
+     * Clear the icon
+     */
+    clearIcon() {
+        this.Icon = '';
+        this.cdr.detectChanges();
+    }
+    /**
+     * Build the expression based on current mode
+     */
+    buildExpression() {
+        switch (this.Mode) {
+            case 'simple':
+                if (!this.SelectedFunction)
+                    return '';
+                // COUNT can work without a column (uses COUNT(*))
+                // COUNT_DISTINCT requires a column
+                if (!this.SelectedColumn) {
+                    if (this.SelectedFunction === 'COUNT') {
+                        return 'COUNT(*)';
+                    }
+                    return ''; // Other functions require a column
+                }
+                // Use brackets for column names with spaces
+                const columnRef = this.SelectedColumn.includes(' ')
+                    ? `[${this.SelectedColumn}]`
+                    : this.SelectedColumn;
+                if (this.SelectedFunction === 'COUNT_DISTINCT') {
+                    return `COUNT(DISTINCT ${columnRef})`;
+                }
+                return `${this.SelectedFunction}(${columnRef})`;
+            case 'advanced':
+                return this.Expression;
+            case 'smart':
+                return this.GeneratedExpression || '';
+            default:
+                return '';
+        }
+    }
+    /**
+     * Check if the form is valid
+     */
+    get IsValid() {
+        const hasExpression = !!this.buildExpression();
+        const hasLabel = !!this.Label.trim();
+        return hasExpression && hasLabel;
+    }
+    /**
+     * Get validation message
+     */
+    get ValidationMessage() {
+        if (!this.Label.trim()) {
+            return 'Please enter a label for this aggregate';
+        }
+        switch (this.Mode) {
+            case 'simple':
+                // COUNT can work without a column (uses COUNT(*))
+                // All other functions require a column
+                if (!this.SelectedColumn && this.SelectedFunction !== 'COUNT') {
+                    return 'Please select a column';
+                }
+                break;
+            case 'advanced':
+                if (!this.Expression.trim())
+                    return 'Please enter an expression';
+                break;
+            case 'smart':
+                if (!this.GeneratedExpression)
+                    return 'Please generate an expression from your prompt';
+                break;
+        }
+        return '';
+    }
+    /**
+     * Save the aggregate
+     */
+    onSave() {
+        if (!this.IsValid)
+            return;
+        const aggregate = {
+            id: this.Aggregate?.id || this.generateId(),
+            expression: this.buildExpression(),
+            displayType: this.DisplayType,
+            label: this.Label.trim(),
+            description: this.Description.trim() || undefined,
+            icon: this.Icon || this.getDefaultIcon(),
+            enabled: this.Aggregate?.enabled ?? true, // Preserve enabled state when editing, default to true for new
+            order: this.Aggregate?.order || 0
+        };
+        // Only include smartPrompt if in smart mode
+        if (this.Mode === 'smart' && this.SmartPrompt) {
+            aggregate.smartPrompt = this.SmartPrompt;
+        }
+        this.Save.emit(aggregate);
+        this.onClose();
+    }
+    /**
+     * Get default icon based on function
+     */
+    getDefaultIcon() {
+        if (this.Mode === 'simple' && this.SelectedFunction) {
+            return FUNCTION_ICONS[this.SelectedFunction] || 'fa-solid fa-chart-simple';
+        }
+        return 'fa-solid fa-chart-simple';
+    }
+    /**
+     * Generate a unique ID for new aggregates
+     */
+    generateId() {
+        return `agg_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+    }
+    /**
+     * Close the dialog
+     */
+    onClose() {
+        this.Close.emit();
+    }
+    /**
+     * Handle smart prompt generation (placeholder - actual AI call would be made by parent)
+     */
+    onGenerateFromPrompt() {
+        if (!this.SmartPrompt.trim())
+            return;
+        this.IsGenerating = true;
+        this.cdr.detectChanges();
+        // This would typically call an AI service
+        // For now, we'll show a placeholder message
+        // The actual implementation would be handled by the parent component or a service
+        setTimeout(() => {
+            this.IsGenerating = false;
+            // Placeholder: In real implementation, this would be replaced with AI-generated expression
+            this.GeneratedExpression = '/* AI-generated expression will appear here */';
+            this.cdr.detectChanges();
+        }, 500);
+    }
+    /**
+     * Clear the generated expression and allow editing prompt
+     */
+    clearGeneratedExpression() {
+        this.GeneratedExpression = '';
+        this.cdr.detectChanges();
+    }
+    /**
+     * Get display label for field dropdown showing "Name (DisplayName)" format
+     * If DisplayName equals Name or is not set, just show Name
+     */
+    getFieldDisplayLabel(field) {
+        if (field.DisplayName && field.DisplayName !== field.Name) {
+            return `${field.Name} (${field.DisplayName})`;
+        }
+        return field.Name;
+    }
+    static ɵfac = function AggregateSetupDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || AggregateSetupDialogComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AggregateSetupDialogComponent, selectors: [["mj-aggregate-setup-dialog"]], inputs: { Entity: "Entity", Aggregate: "Aggregate", IsOpen: "IsOpen" }, outputs: { Close: "Close", Save: "Save" }, features: [i0.ɵɵNgOnChangesFeature], decls: 75, vars: 23, consts: [[1, "dialog-backdrop"], [1, "dialog-panel"], [1, "dialog-header"], [1, "header-title"], [1, "fa-solid", "fa-chart-simple"], ["title", "Close", 1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "mode-selector"], ["title", "Pick a column and function", 1, "mode-btn", 3, "click"], [1, "fa-solid", "fa-wand-sparkles"], ["title", "Write custom SQL expression", 1, "mode-btn", 3, "click"], [1, "fa-solid", "fa-code"], ["title", "Describe in natural language", 1, "mode-btn", 3, "click"], [1, "fa-solid", "fa-wand-magic-sparkles"], [1, "dialog-content"], [1, "mode-content", "simple-mode"], [1, "mode-content", "advanced-mode"], [1, "mode-content", "smart-mode"], [1, "config-section"], [1, "section-divider"], [1, "form-section"], [1, "form-label", "required"], ["type", "text", "placeholder", "e.g., Total Revenue, Average Order Value", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-label"], [1, "optional"], ["type", "text", "placeholder", "Brief explanation of what this shows", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "display-type-toggle"], [1, "display-type-btn", 3, "click"], [1, "fa-solid", "fa-id-card"], [1, "fa-solid", "fa-table-columns"], [1, "icon-selector"], [1, "selected-icon"], [1, "icon-grid"], [1, "icon-btn", 3, "active", "title"], [1, "dialog-footer"], [1, "footer-left"], [1, "footer-btn", "save-btn", "primary", 3, "click", "disabled"], [1, "fa-solid", "fa-check"], [1, "footer-btn", "cancel-btn", 3, "click"], [1, "validation-message"], [1, "dialog-backdrop", 3, "click"], [1, "mode-description"], [1, "fa-solid", "fa-info-circle"], [1, "function-grid"], [1, "function-btn", 3, "active", "title"], [1, "form-select", 3, "ngModelChange", "ngModel"], ["value", ""], [3, "value"], [1, "field-hint", "warning"], [1, "field-hint", "info"], [1, "expression-preview"], [1, "function-btn", 3, "click", "title"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "preview-label"], [1, "preview-code"], ["placeholder", "e.g., SUM(Amount * Quantity) or COUNT(CASE WHEN Status = 'Active' THEN 1 END)", "rows", "3", 1, "form-textarea", "code-input", 3, "ngModelChange", "ngModel"], [1, "field-hint"], [1, "fa-solid", "fa-lightbulb"], [1, "form-label", "examples-label"], [1, "example-chips"], [1, "example-chip", 3, "click"], [1, "smart-input-container"], ["placeholder", "e.g., 'Total revenue from completed orders' or 'Average order value for premium customers'", "rows", "3", 1, "form-textarea", "smart-input", 3, "ngModelChange", "ngModel", "disabled"], [1, "generate-btn", 3, "disabled"], [1, "generated-section"], [1, "smart-tips"], [1, "tips-header"], [1, "tips-list"], [1, "generate-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "generated-header"], ["title", "Edit prompt", 1, "clear-generated-btn", 3, "click"], [1, "fa-solid", "fa-pen"], [1, "generated-code"], [1, "generated-info"], ["title", "Remove icon", 1, "clear-icon-btn", 3, "click"], [1, "icon-btn", 3, "click", "title"], [1, "fa-solid", "fa-exclamation-circle"]], template: function AggregateSetupDialogComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, AggregateSetupDialogComponent_Conditional_0_Template, 1, 0, "div", 0);
+            i0.ɵɵelementStart(1, "div", 1)(2, "div", 2)(3, "div", 3);
+            i0.ɵɵelement(4, "i", 4);
+            i0.ɵɵelementStart(5, "span");
+            i0.ɵɵtext(6);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(7, "button", 5);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_7_listener() { return ctx.onClose(); });
+            i0.ɵɵelement(8, "i", 6);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(9, "div", 7)(10, "button", 8);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_10_listener() { return ctx.setMode("simple"); });
+            i0.ɵɵelement(11, "i", 9);
+            i0.ɵɵelementStart(12, "span");
+            i0.ɵɵtext(13, "Simple");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(14, "button", 10);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_14_listener() { return ctx.setMode("advanced"); });
+            i0.ɵɵelement(15, "i", 11);
+            i0.ɵɵelementStart(16, "span");
+            i0.ɵɵtext(17, "Advanced");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(18, "button", 12);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_18_listener() { return ctx.setMode("smart"); });
+            i0.ɵɵelement(19, "i", 13);
+            i0.ɵɵelementStart(20, "span");
+            i0.ɵɵtext(21, "Smart");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(22, "div", 14);
+            i0.ɵɵtemplate(23, AggregateSetupDialogComponent_Conditional_23_Template, 22, 4, "div", 15)(24, AggregateSetupDialogComponent_Conditional_24_Template, 25, 1, "div", 16)(25, AggregateSetupDialogComponent_Conditional_25_Template, 24, 4, "div", 17);
+            i0.ɵɵelementStart(26, "div", 18)(27, "div", 19)(28, "span");
+            i0.ɵɵtext(29, "Display Options");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(30, "div", 20)(31, "label", 21);
+            i0.ɵɵtext(32, "Label");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(33, "input", 22);
+            i0.ɵɵtwoWayListener("ngModelChange", function AggregateSetupDialogComponent_Template_input_ngModelChange_33_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Label, $event) || (ctx.Label = $event); return $event; });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(34, "div", 20)(35, "label", 23);
+            i0.ɵɵtext(36, "Description ");
+            i0.ɵɵelementStart(37, "span", 24);
+            i0.ɵɵtext(38, "(optional)");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(39, "input", 25);
+            i0.ɵɵtwoWayListener("ngModelChange", function AggregateSetupDialogComponent_Template_input_ngModelChange_39_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Description, $event) || (ctx.Description = $event); return $event; });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(40, "div", 20)(41, "label", 23);
+            i0.ɵɵtext(42, "Display As");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(43, "div", 26)(44, "button", 27);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_44_listener() { return ctx.DisplayType = "card"; });
+            i0.ɵɵelement(45, "i", 28);
+            i0.ɵɵelementStart(46, "span");
+            i0.ɵɵtext(47, "Card");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(48, "small");
+            i0.ɵɵtext(49, "Shows in summary panel");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(50, "button", 27);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_50_listener() { return ctx.DisplayType = "column"; });
+            i0.ɵɵelement(51, "i", 29);
+            i0.ɵɵelementStart(52, "span");
+            i0.ɵɵtext(53, "Column Footer");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(54, "small");
+            i0.ɵɵtext(55, "Shows at bottom of grid");
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵelementStart(56, "div", 20)(57, "label", 23);
+            i0.ɵɵtext(58, "Icon ");
+            i0.ɵɵelementStart(59, "span", 24);
+            i0.ɵɵtext(60, "(optional)");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(61, "div", 30);
+            i0.ɵɵtemplate(62, AggregateSetupDialogComponent_Conditional_62_Template, 4, 2, "div", 31);
+            i0.ɵɵelementStart(63, "div", 32);
+            i0.ɵɵrepeaterCreate(64, AggregateSetupDialogComponent_For_65_Template, 2, 5, "button", 33, i0.ɵɵrepeaterTrackByIdentity);
+            i0.ɵɵelementEnd()()()()();
+            i0.ɵɵelementStart(66, "div", 34)(67, "div", 35)(68, "button", 36);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_68_listener() { return ctx.onSave(); });
+            i0.ɵɵelement(69, "i", 37);
+            i0.ɵɵelementStart(70, "span");
+            i0.ɵɵtext(71);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(72, "button", 38);
+            i0.ɵɵlistener("click", function AggregateSetupDialogComponent_Template_button_click_72_listener() { return ctx.onClose(); });
+            i0.ɵɵtext(73, " Cancel ");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(74, AggregateSetupDialogComponent_Conditional_74_Template, 4, 1, "div", 39);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵconditional(ctx.IsOpen ? 0 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("open", ctx.IsOpen);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.Aggregate ? "Edit Aggregate" : "Add Aggregate");
+            i0.ɵɵadvance(4);
+            i0.ɵɵclassProp("active", ctx.Mode === "simple");
+            i0.ɵɵadvance(4);
+            i0.ɵɵclassProp("active", ctx.Mode === "advanced");
+            i0.ɵɵadvance(4);
+            i0.ɵɵclassProp("active", ctx.Mode === "smart");
+            i0.ɵɵadvance(5);
+            i0.ɵɵconditional(ctx.Mode === "simple" ? 23 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.Mode === "advanced" ? 24 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.Mode === "smart" ? 25 : -1);
+            i0.ɵɵadvance(8);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.Label);
+            i0.ɵɵadvance(6);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.Description);
+            i0.ɵɵadvance(5);
+            i0.ɵɵclassProp("active", ctx.DisplayType === "card");
+            i0.ɵɵadvance(6);
+            i0.ɵɵclassProp("active", ctx.DisplayType === "column");
+            i0.ɵɵadvance(12);
+            i0.ɵɵconditional(ctx.Icon ? 62 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵrepeater(ctx.CommonIcons);
+            i0.ɵɵadvance(4);
+            i0.ɵɵproperty("disabled", !ctx.IsValid);
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate1("", ctx.Aggregate ? "Update" : "Add", " Aggregate");
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.ValidationMessage ? 74 : -1);
+        } }, dependencies: [i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.NgModel], styles: ["\n\n.dialog-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.4);\n  z-index: 2000;\n  animation: _ngcontent-%COMP%_fadeIn 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n\n\n.dialog-panel[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) scale(0.95);\n  width: 520px;\n  max-width: calc(100vw - 40px);\n  max-height: calc(100vh - 60px);\n  background: white;\n  border-radius: 16px;\n  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);\n  z-index: 2001;\n  display: flex;\n  flex-direction: column;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.dialog-panel.open[_ngcontent-%COMP%] {\n  opacity: 1;\n  pointer-events: auto;\n  transform: translate(-50%, -50%) scale(1);\n}\n\n\n\n.dialog-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 18px 24px;\n  border-bottom: 1px solid #e5e7eb;\n  background: #f8fafc;\n  border-radius: 16px 16px 0 0;\n}\n\n.header-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  font-size: 17px;\n  font-weight: 600;\n  color: #1f2937;\n}\n\n.header-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n  font-size: 18px;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 8px;\n  cursor: pointer;\n  color: #6b7280;\n  transition: all 0.15s ease;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n  background: #e5e7eb;\n  color: #374151;\n}\n\n\n\n.mode-selector[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  padding: 16px 24px;\n  background: #f8fafc;\n  border-bottom: 1px solid #e5e7eb;\n}\n\n.mode-btn[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 14px 16px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.mode-btn[_ngcontent-%COMP%]:hover {\n  border-color: #d1d5db;\n  background: #fafafa;\n}\n\n.mode-btn.active[_ngcontent-%COMP%] {\n  border-color: #3b82f6;\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n}\n\n.mode-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 18px;\n  color: #6b7280;\n}\n\n.mode-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n}\n\n.mode-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.mode-btn.active[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  color: #1d4ed8;\n}\n\n\n\n.dialog-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px 24px;\n}\n\n\n\n.mode-content[_ngcontent-%COMP%] {\n  margin-bottom: 20px;\n}\n\n.mode-description[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 12px 14px;\n  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);\n  border: 1px solid #bae6fd;\n  border-radius: 10px;\n  margin-bottom: 20px;\n  font-size: 13px;\n  color: #0369a1;\n  line-height: 1.5;\n}\n\n.mode-description[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #0284c7;\n  margin-top: 2px;\n  flex-shrink: 0;\n}\n\n\n\n.form-section[_ngcontent-%COMP%] {\n  margin-bottom: 18px;\n}\n\n.form-label[_ngcontent-%COMP%] {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 13px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.form-label.required[_ngcontent-%COMP%]::after {\n  content: ' *';\n  color: #dc2626;\n}\n\n.form-label[_ngcontent-%COMP%]   .optional[_ngcontent-%COMP%] {\n  font-weight: 400;\n  color: #9ca3af;\n}\n\n.form-label.examples-label[_ngcontent-%COMP%] {\n  color: #6b7280;\n}\n\n\n\n.form-input[_ngcontent-%COMP%], \n.form-select[_ngcontent-%COMP%], \n.form-textarea[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 10px 14px;\n  border: 1px solid #d1d5db;\n  border-radius: 8px;\n  font-size: 14px;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease;\n  background: white;\n}\n\n.form-input[_ngcontent-%COMP%]:focus, \n.form-select[_ngcontent-%COMP%]:focus, \n.form-textarea[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: #3b82f6;\n  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);\n}\n\n.form-textarea[_ngcontent-%COMP%] {\n  resize: vertical;\n  min-height: 80px;\n}\n\n.form-textarea.code-input[_ngcontent-%COMP%] {\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n}\n\n\n\n.function-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 8px;\n}\n\n.function-btn[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 14px 10px;\n  border: 2px solid #e5e7eb;\n  border-radius: 10px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.function-btn[_ngcontent-%COMP%]:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.function-btn.active[_ngcontent-%COMP%] {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.function-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 18px;\n  color: #6b7280;\n}\n\n.function-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n}\n\n.function-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 500;\n  color: #4b5563;\n}\n\n.function-btn.active[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  color: #1d4ed8;\n}\n\n\n\n.field-hint[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  margin-top: 8px;\n  padding: 10px 12px;\n  background: #f8fafc;\n  border-radius: 6px;\n  font-size: 12px;\n  color: #64748b;\n}\n\n.field-hint.warning[_ngcontent-%COMP%] {\n  background: #fffbeb;\n  color: #92400e;\n}\n\n.field-hint.warning[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #f59e0b;\n}\n\n.field-hint.info[_ngcontent-%COMP%] {\n  background: #eff6ff;\n  color: #1e40af;\n}\n\n.field-hint.info[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n}\n\n.field-hint[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #94a3b8;\n  margin-top: 1px;\n  flex-shrink: 0;\n}\n\n\n\n.expression-preview[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  padding: 14px;\n  background: #f8fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 10px;\n}\n\n.preview-label[_ngcontent-%COMP%] {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 12px;\n  font-weight: 500;\n  color: #64748b;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.preview-code[_ngcontent-%COMP%] {\n  display: block;\n  padding: 12px 14px;\n  background: white;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n  color: #1e293b;\n}\n\n\n\n.example-chips[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.example-chip[_ngcontent-%COMP%] {\n  padding: 8px 12px;\n  border: 1px solid #e5e7eb;\n  border-radius: 6px;\n  background: white;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 11px;\n  color: #4b5563;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.example-chip[_ngcontent-%COMP%]:hover {\n  border-color: #3b82f6;\n  background: #eff6ff;\n  color: #1d4ed8;\n}\n\n\n\n.smart-input-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.smart-input[_ngcontent-%COMP%] {\n  min-height: 100px;\n}\n\n.smart-input[_ngcontent-%COMP%]:disabled {\n  background: #f3f4f6;\n  color: #6b7280;\n}\n\n.generate-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);\n  border: none;\n  border-radius: 10px;\n  color: white;\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  align-self: flex-start;\n}\n\n.generate-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n  transform: translateY(-1px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.35);\n}\n\n.generate-btn[_ngcontent-%COMP%]:disabled {\n  opacity: 0.6;\n  cursor: not-allowed;\n  transform: none;\n}\n\n\n\n.generated-section[_ngcontent-%COMP%] {\n  margin-top: 16px;\n  padding: 16px;\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border: 1px solid #86efac;\n  border-radius: 10px;\n}\n\n.generated-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 10px;\n}\n\n.generated-header[_ngcontent-%COMP%]   .form-label[_ngcontent-%COMP%] {\n  margin-bottom: 0;\n  color: #166534;\n}\n\n.clear-generated-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: 1px solid #86efac;\n  border-radius: 6px;\n  background: white;\n  font-size: 12px;\n  font-weight: 500;\n  color: #166534;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.clear-generated-btn[_ngcontent-%COMP%]:hover {\n  background: #166534;\n  color: white;\n}\n\n.generated-code[_ngcontent-%COMP%] {\n  display: block;\n  padding: 12px 14px;\n  background: white;\n  border: 1px solid #86efac;\n  border-radius: 6px;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n  color: #14532d;\n  margin-bottom: 10px;\n}\n\n.generated-info[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  font-size: 12px;\n  color: #166534;\n}\n\n.generated-info[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-top: 1px;\n}\n\n\n\n.smart-tips[_ngcontent-%COMP%] {\n  margin-top: 20px;\n  padding: 14px;\n  background: #fffbeb;\n  border: 1px solid #fde68a;\n  border-radius: 10px;\n}\n\n.tips-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-bottom: 10px;\n  font-size: 13px;\n  font-weight: 600;\n  color: #92400e;\n}\n\n.tips-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #f59e0b;\n}\n\n.tips-list[_ngcontent-%COMP%] {\n  margin: 0;\n  padding-left: 20px;\n  font-size: 12px;\n  color: #78350f;\n  line-height: 1.6;\n}\n\n\n\n.config-section[_ngcontent-%COMP%] {\n  padding-top: 16px;\n}\n\n.section-divider[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  margin-bottom: 20px;\n}\n\n.section-divider[_ngcontent-%COMP%]::before, \n.section-divider[_ngcontent-%COMP%]::after {\n  content: '';\n  flex: 1;\n  height: 1px;\n  background: #e5e7eb;\n}\n\n.section-divider[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 600;\n  color: #9ca3af;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n\n\n.display-type-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n}\n\n.display-type-btn[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 16px 14px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.display-type-btn[_ngcontent-%COMP%]:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.display-type-btn.active[_ngcontent-%COMP%] {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.display-type-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 22px;\n  color: #6b7280;\n}\n\n.display-type-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n}\n\n.display-type-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.display-type-btn.active[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  color: #1d4ed8;\n}\n\n.display-type-btn[_ngcontent-%COMP%]   small[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: #9ca3af;\n}\n\n.display-type-btn.active[_ngcontent-%COMP%]   small[_ngcontent-%COMP%] {\n  color: #60a5fa;\n}\n\n\n\n.icon-selector[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.selected-icon[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  background: #eff6ff;\n  border: 1px solid #93c5fd;\n  border-radius: 8px;\n  width: fit-content;\n}\n\n.selected-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n  font-size: 20px;\n  color: #3b82f6;\n}\n\n.clear-icon-btn[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  border: none;\n  background: white;\n  border-radius: 50%;\n  cursor: pointer;\n  color: #9ca3af;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  transition: all 0.15s ease;\n}\n\n.clear-icon-btn[_ngcontent-%COMP%]:hover {\n  background: #dc2626;\n  color: white;\n}\n\n.icon-grid[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.icon-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  background: white;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.15s ease;\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.icon-btn.active[_ngcontent-%COMP%] {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.icon-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n  color: #6b7280;\n}\n\n.icon-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #3b82f6;\n}\n\n\n\n.dialog-footer[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 18px 24px;\n  border-top: 1px solid #e5e7eb;\n  background: #f8fafc;\n  border-radius: 0 0 16px 16px;\n}\n\n.footer-left[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 10px;\n}\n\n.footer-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 11px 18px;\n  border: 1px solid #d1d5db;\n  border-radius: 10px;\n  background: white;\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.footer-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #f3f4f6;\n  border-color: #9ca3af;\n}\n\n.footer-btn[_ngcontent-%COMP%]:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.footer-btn.primary[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);\n  border-color: #3b82f6;\n  color: white;\n}\n\n.footer-btn.primary[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);\n  border-color: #2563eb;\n  transform: translateY(-1px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.35);\n}\n\n\n\n.validation-message[_ngcontent-%COMP%] {\n  position: absolute;\n  bottom: 80px;\n  left: 24px;\n  right: 24px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 14px;\n  background: #fef2f2;\n  border: 1px solid #fecaca;\n  border-radius: 8px;\n  font-size: 13px;\n  color: #dc2626;\n}\n\n.validation-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n}\n\n\n\n@media (max-width: 600px) {\n  .dialog-panel[_ngcontent-%COMP%] {\n    width: calc(100vw - 24px);\n    max-height: calc(100vh - 40px);\n    border-radius: 12px;\n  }\n\n  .dialog-header[_ngcontent-%COMP%], \n   .dialog-footer[_ngcontent-%COMP%] {\n    border-radius: 0;\n  }\n\n  .dialog-header[_ngcontent-%COMP%] {\n    border-radius: 12px 12px 0 0;\n  }\n\n  .dialog-footer[_ngcontent-%COMP%] {\n    border-radius: 0 0 12px 12px;\n  }\n\n  .mode-btn[_ngcontent-%COMP%] {\n    padding: 10px 8px;\n  }\n\n  .mode-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 11px;\n  }\n\n  .function-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .display-type-toggle[_ngcontent-%COMP%] {\n    flex-direction: column;\n  }\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AggregateSetupDialogComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-aggregate-setup-dialog', template: "<!-- Dialog Backdrop -->\n@if (IsOpen) {\n  <div class=\"dialog-backdrop\" (click)=\"onClose()\"></div>\n}\n\n<!-- Dialog Panel -->\n<div class=\"dialog-panel\" [class.open]=\"IsOpen\">\n  <!-- Header -->\n  <div class=\"dialog-header\">\n    <div class=\"header-title\">\n      <i class=\"fa-solid fa-chart-simple\"></i>\n      <span>{{ Aggregate ? 'Edit Aggregate' : 'Add Aggregate' }}</span>\n    </div>\n    <button class=\"close-btn\" (click)=\"onClose()\" title=\"Close\">\n      <i class=\"fa-solid fa-times\"></i>\n    </button>\n  </div>\n\n  <!-- Mode Selector -->\n  <div class=\"mode-selector\">\n    <button\n      class=\"mode-btn\"\n      [class.active]=\"Mode === 'simple'\"\n      (click)=\"setMode('simple')\"\n      title=\"Pick a column and function\">\n      <i class=\"fa-solid fa-wand-sparkles\"></i>\n      <span>Simple</span>\n    </button>\n    <button\n      class=\"mode-btn\"\n      [class.active]=\"Mode === 'advanced'\"\n      (click)=\"setMode('advanced')\"\n      title=\"Write custom SQL expression\">\n      <i class=\"fa-solid fa-code\"></i>\n      <span>Advanced</span>\n    </button>\n    <button\n      class=\"mode-btn\"\n      [class.active]=\"Mode === 'smart'\"\n      (click)=\"setMode('smart')\"\n      title=\"Describe in natural language\">\n      <i class=\"fa-solid fa-wand-magic-sparkles\"></i>\n      <span>Smart</span>\n    </button>\n  </div>\n\n  <!-- Content -->\n  <div class=\"dialog-content\">\n    <!-- Simple Mode -->\n    @if (Mode === 'simple') {\n      <div class=\"mode-content simple-mode\">\n        <div class=\"mode-description\">\n          <i class=\"fa-solid fa-info-circle\"></i>\n          <span>Select a column and an aggregate function to calculate</span>\n        </div>\n\n        <!-- Function Selection -->\n        <div class=\"form-section\">\n          <label class=\"form-label\">Function</label>\n          <div class=\"function-grid\">\n            @for (func of AggregateFunctions; track func.value) {\n              <button\n                class=\"function-btn\"\n                [class.active]=\"SelectedFunction === func.value\"\n                (click)=\"selectFunction(func.value)\"\n                [title]=\"func.label\">\n                <i [class]=\"func.icon\"></i>\n                <span>{{ func.label }}</span>\n              </button>\n            }\n          </div>\n        </div>\n\n        <!-- Column Selection -->\n        <div class=\"form-section\">\n          <label class=\"form-label\">Column</label>\n          <select\n            class=\"form-select\"\n            [(ngModel)]=\"SelectedColumn\"\n            (ngModelChange)=\"onColumnSelected($event)\">\n            <option value=\"\">Select a column...</option>\n            @for (field of AvailableFields; track field.ID) {\n              <option [value]=\"field.Name\">{{ getFieldDisplayLabel(field) }}</option>\n            }\n          </select>\n          @if (SelectedFunction !== 'COUNT' && SelectedFunction !== 'COUNT_DISTINCT' && NumericFields.length === 0) {\n            <div class=\"field-hint warning\">\n              <i class=\"fa-solid fa-exclamation-triangle\"></i>\n              <span>No numeric fields available. Use COUNT or switch to Advanced mode.</span>\n            </div>\n          }\n          @if (SelectedFunction === 'COUNT' && !SelectedColumn) {\n            <div class=\"field-hint info\">\n              <i class=\"fa-solid fa-info-circle\"></i>\n              <span>No column selected - will count all records (COUNT(*))</span>\n            </div>\n          }\n        </div>\n\n        <!-- Preview -->\n        @if (SelectedFunction && (SelectedColumn || SelectedFunction === 'COUNT')) {\n          <div class=\"expression-preview\">\n            <label class=\"preview-label\">Expression Preview</label>\n            <code class=\"preview-code\">{{\n              !SelectedColumn && SelectedFunction === 'COUNT' ? 'COUNT(*)' :\n              SelectedFunction === 'COUNT_DISTINCT' ? 'COUNT(DISTINCT ' + SelectedColumn + ')' :\n              SelectedFunction + '(' + SelectedColumn + ')'\n            }}</code>\n          </div>\n        }\n      </div>\n    }\n\n    <!-- Advanced Mode -->\n    @if (Mode === 'advanced') {\n      <div class=\"mode-content advanced-mode\">\n        <div class=\"mode-description\">\n          <i class=\"fa-solid fa-info-circle\"></i>\n          <span>Write a custom SQL aggregate expression. Use field names as they appear in the database.</span>\n        </div>\n\n        <div class=\"form-section\">\n          <label class=\"form-label\">SQL Expression</label>\n          <textarea\n            class=\"form-textarea code-input\"\n            [(ngModel)]=\"Expression\"\n            placeholder=\"e.g., SUM(Amount * Quantity) or COUNT(CASE WHEN Status = 'Active' THEN 1 END)\"\n            rows=\"3\"\n          ></textarea>\n          <div class=\"field-hint\">\n            <i class=\"fa-solid fa-lightbulb\"></i>\n            <span>Tip: Use brackets for column names with spaces, e.g., [Total Amount]</span>\n          </div>\n        </div>\n\n        <!-- Quick Examples -->\n        <div class=\"form-section\">\n          <label class=\"form-label examples-label\">Quick Examples</label>\n          <div class=\"example-chips\">\n            <button class=\"example-chip\" (click)=\"Expression = 'SUM(Amount)'\">\n              SUM(Amount)\n            </button>\n            <button class=\"example-chip\" (click)=\"Expression = 'AVG(Price * Quantity)'\">\n              AVG(Price * Quantity)\n            </button>\n            <button class=\"example-chip\" (click)=\"Expression = 'COUNT(CASE WHEN Status = \\'Active\\' THEN 1 END)'\">\n              COUNT with condition\n            </button>\n            <button class=\"example-chip\" (click)=\"Expression = 'SUM(CASE WHEN Type = \\'Credit\\' THEN Amount ELSE -Amount END)'\">\n              Conditional SUM\n            </button>\n          </div>\n        </div>\n      </div>\n    }\n\n    <!-- Smart Mode -->\n    @if (Mode === 'smart') {\n      <div class=\"mode-content smart-mode\">\n        <div class=\"mode-description\">\n          <i class=\"fa-solid fa-wand-magic-sparkles\"></i>\n          <span>Describe what you want to calculate in plain English. AI will generate the expression.</span>\n        </div>\n\n        <div class=\"form-section\">\n          <label class=\"form-label\">What would you like to calculate?</label>\n          <div class=\"smart-input-container\">\n            <textarea\n              class=\"form-textarea smart-input\"\n              [(ngModel)]=\"SmartPrompt\"\n              [disabled]=\"!!GeneratedExpression\"\n              placeholder=\"e.g., 'Total revenue from completed orders' or 'Average order value for premium customers'\"\n              rows=\"3\"\n            ></textarea>\n            @if (!GeneratedExpression) {\n              <button\n                class=\"generate-btn\"\n                [disabled]=\"!SmartPrompt.trim() || IsGenerating\"\n                (click)=\"onGenerateFromPrompt()\">\n                @if (IsGenerating) {\n                  <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                  <span>Generating...</span>\n                } @else {\n                  <i class=\"fa-solid fa-wand-magic-sparkles\"></i>\n                  <span>Generate</span>\n                }\n              </button>\n            }\n          </div>\n        </div>\n\n        <!-- Generated Expression -->\n        @if (GeneratedExpression) {\n          <div class=\"generated-section\">\n            <div class=\"generated-header\">\n              <label class=\"form-label\">Generated Expression</label>\n              <button class=\"clear-generated-btn\" (click)=\"clearGeneratedExpression()\" title=\"Edit prompt\">\n                <i class=\"fa-solid fa-pen\"></i>\n                <span>Edit Prompt</span>\n              </button>\n            </div>\n            <code class=\"generated-code\">{{ GeneratedExpression }}</code>\n            <div class=\"generated-info\">\n              <i class=\"fa-solid fa-info-circle\"></i>\n              <span>This expression was generated from your description. Clear it to edit the prompt.</span>\n            </div>\n          </div>\n        }\n\n        <!-- Smart Mode Tips -->\n        <div class=\"smart-tips\">\n          <div class=\"tips-header\">\n            <i class=\"fa-solid fa-lightbulb\"></i>\n            <span>Tips for better results:</span>\n          </div>\n          <ul class=\"tips-list\">\n            <li>Be specific about which fields to use</li>\n            <li>Mention any conditions or filters</li>\n            <li>Specify the type of calculation (sum, average, count, etc.)</li>\n          </ul>\n        </div>\n      </div>\n    }\n\n    <!-- Common Configuration -->\n    <div class=\"config-section\">\n      <div class=\"section-divider\">\n        <span>Display Options</span>\n      </div>\n\n      <!-- Label -->\n      <div class=\"form-section\">\n        <label class=\"form-label required\">Label</label>\n        <input\n          type=\"text\"\n          class=\"form-input\"\n          [(ngModel)]=\"Label\"\n          placeholder=\"e.g., Total Revenue, Average Order Value\"\n        />\n      </div>\n\n      <!-- Description (optional) -->\n      <div class=\"form-section\">\n        <label class=\"form-label\">Description <span class=\"optional\">(optional)</span></label>\n        <input\n          type=\"text\"\n          class=\"form-input\"\n          [(ngModel)]=\"Description\"\n          placeholder=\"Brief explanation of what this shows\"\n        />\n      </div>\n\n      <!-- Display Type -->\n      <div class=\"form-section\">\n        <label class=\"form-label\">Display As</label>\n        <div class=\"display-type-toggle\">\n          <button\n            class=\"display-type-btn\"\n            [class.active]=\"DisplayType === 'card'\"\n            (click)=\"DisplayType = 'card'\">\n            <i class=\"fa-solid fa-id-card\"></i>\n            <span>Card</span>\n            <small>Shows in summary panel</small>\n          </button>\n          <button\n            class=\"display-type-btn\"\n            [class.active]=\"DisplayType === 'column'\"\n            (click)=\"DisplayType = 'column'\">\n            <i class=\"fa-solid fa-table-columns\"></i>\n            <span>Column Footer</span>\n            <small>Shows at bottom of grid</small>\n          </button>\n        </div>\n      </div>\n\n      <!-- Icon Selection -->\n      <div class=\"form-section\">\n        <label class=\"form-label\">Icon <span class=\"optional\">(optional)</span></label>\n        <div class=\"icon-selector\">\n          @if (Icon) {\n            <div class=\"selected-icon\">\n              <i [class]=\"Icon\"></i>\n              <button class=\"clear-icon-btn\" (click)=\"clearIcon()\" title=\"Remove icon\">\n                <i class=\"fa-solid fa-times\"></i>\n              </button>\n            </div>\n          }\n          <div class=\"icon-grid\">\n            @for (icon of CommonIcons; track icon) {\n              <button\n                class=\"icon-btn\"\n                [class.active]=\"Icon === icon\"\n                (click)=\"selectIcon(icon)\"\n                [title]=\"icon\">\n                <i [class]=\"icon\"></i>\n              </button>\n            }\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Footer -->\n  <div class=\"dialog-footer\">\n    <div class=\"footer-left\">\n      <button\n        class=\"footer-btn save-btn primary\"\n        [disabled]=\"!IsValid\"\n        (click)=\"onSave()\">\n        <i class=\"fa-solid fa-check\"></i>\n        <span>{{ Aggregate ? 'Update' : 'Add' }} Aggregate</span>\n      </button>\n    </div>\n    <button class=\"footer-btn cancel-btn\" (click)=\"onClose()\">\n      Cancel\n    </button>\n  </div>\n\n  <!-- Validation Message -->\n  @if (ValidationMessage) {\n    <div class=\"validation-message\">\n      <i class=\"fa-solid fa-exclamation-circle\"></i>\n      <span>{{ ValidationMessage }}</span>\n    </div>\n  }\n</div>\n", styles: ["/* Dialog Backdrop */\n.dialog-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.4);\n  z-index: 2000;\n  animation: fadeIn 0.2s ease;\n}\n\n@keyframes fadeIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n/* Dialog Panel */\n.dialog-panel {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) scale(0.95);\n  width: 520px;\n  max-width: calc(100vw - 40px);\n  max-height: calc(100vh - 60px);\n  background: white;\n  border-radius: 16px;\n  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);\n  z-index: 2001;\n  display: flex;\n  flex-direction: column;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.dialog-panel.open {\n  opacity: 1;\n  pointer-events: auto;\n  transform: translate(-50%, -50%) scale(1);\n}\n\n/* Dialog Header */\n.dialog-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 18px 24px;\n  border-bottom: 1px solid #e5e7eb;\n  background: #f8fafc;\n  border-radius: 16px 16px 0 0;\n}\n\n.header-title {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  font-size: 17px;\n  font-weight: 600;\n  color: #1f2937;\n}\n\n.header-title i {\n  color: #3b82f6;\n  font-size: 18px;\n}\n\n.close-btn {\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 8px;\n  cursor: pointer;\n  color: #6b7280;\n  transition: all 0.15s ease;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.close-btn:hover {\n  background: #e5e7eb;\n  color: #374151;\n}\n\n/* Mode Selector */\n.mode-selector {\n  display: flex;\n  gap: 8px;\n  padding: 16px 24px;\n  background: #f8fafc;\n  border-bottom: 1px solid #e5e7eb;\n}\n\n.mode-btn {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 14px 16px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.mode-btn:hover {\n  border-color: #d1d5db;\n  background: #fafafa;\n}\n\n.mode-btn.active {\n  border-color: #3b82f6;\n  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);\n}\n\n.mode-btn i {\n  font-size: 18px;\n  color: #6b7280;\n}\n\n.mode-btn.active i {\n  color: #3b82f6;\n}\n\n.mode-btn span {\n  font-size: 13px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.mode-btn.active span {\n  color: #1d4ed8;\n}\n\n/* Dialog Content */\n.dialog-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 20px 24px;\n}\n\n/* Mode Content */\n.mode-content {\n  margin-bottom: 20px;\n}\n\n.mode-description {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 12px 14px;\n  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);\n  border: 1px solid #bae6fd;\n  border-radius: 10px;\n  margin-bottom: 20px;\n  font-size: 13px;\n  color: #0369a1;\n  line-height: 1.5;\n}\n\n.mode-description i {\n  color: #0284c7;\n  margin-top: 2px;\n  flex-shrink: 0;\n}\n\n/* Form Sections */\n.form-section {\n  margin-bottom: 18px;\n}\n\n.form-label {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 13px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.form-label.required::after {\n  content: ' *';\n  color: #dc2626;\n}\n\n.form-label .optional {\n  font-weight: 400;\n  color: #9ca3af;\n}\n\n.form-label.examples-label {\n  color: #6b7280;\n}\n\n/* Form Inputs */\n.form-input,\n.form-select,\n.form-textarea {\n  width: 100%;\n  padding: 10px 14px;\n  border: 1px solid #d1d5db;\n  border-radius: 8px;\n  font-size: 14px;\n  transition: border-color 0.15s ease, box-shadow 0.15s ease;\n  background: white;\n}\n\n.form-input:focus,\n.form-select:focus,\n.form-textarea:focus {\n  outline: none;\n  border-color: #3b82f6;\n  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);\n}\n\n.form-textarea {\n  resize: vertical;\n  min-height: 80px;\n}\n\n.form-textarea.code-input {\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n}\n\n/* Function Grid */\n.function-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 8px;\n}\n\n.function-btn {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 14px 10px;\n  border: 2px solid #e5e7eb;\n  border-radius: 10px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.function-btn:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.function-btn.active {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.function-btn i {\n  font-size: 18px;\n  color: #6b7280;\n}\n\n.function-btn.active i {\n  color: #3b82f6;\n}\n\n.function-btn span {\n  font-size: 12px;\n  font-weight: 500;\n  color: #4b5563;\n}\n\n.function-btn.active span {\n  color: #1d4ed8;\n}\n\n/* Field Hint */\n.field-hint {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  margin-top: 8px;\n  padding: 10px 12px;\n  background: #f8fafc;\n  border-radius: 6px;\n  font-size: 12px;\n  color: #64748b;\n}\n\n.field-hint.warning {\n  background: #fffbeb;\n  color: #92400e;\n}\n\n.field-hint.warning i {\n  color: #f59e0b;\n}\n\n.field-hint.info {\n  background: #eff6ff;\n  color: #1e40af;\n}\n\n.field-hint.info i {\n  color: #3b82f6;\n}\n\n.field-hint i {\n  color: #94a3b8;\n  margin-top: 1px;\n  flex-shrink: 0;\n}\n\n/* Expression Preview */\n.expression-preview {\n  margin-top: 16px;\n  padding: 14px;\n  background: #f8fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 10px;\n}\n\n.preview-label {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 12px;\n  font-weight: 500;\n  color: #64748b;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.preview-code {\n  display: block;\n  padding: 12px 14px;\n  background: white;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n  color: #1e293b;\n}\n\n/* Example Chips */\n.example-chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.example-chip {\n  padding: 8px 12px;\n  border: 1px solid #e5e7eb;\n  border-radius: 6px;\n  background: white;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 11px;\n  color: #4b5563;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.example-chip:hover {\n  border-color: #3b82f6;\n  background: #eff6ff;\n  color: #1d4ed8;\n}\n\n/* Smart Mode Input */\n.smart-input-container {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.smart-input {\n  min-height: 100px;\n}\n\n.smart-input:disabled {\n  background: #f3f4f6;\n  color: #6b7280;\n}\n\n.generate-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 12px 20px;\n  background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);\n  border: none;\n  border-radius: 10px;\n  color: white;\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  align-self: flex-start;\n}\n\n.generate-btn:hover:not(:disabled) {\n  transform: translateY(-1px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.35);\n}\n\n.generate-btn:disabled {\n  opacity: 0.6;\n  cursor: not-allowed;\n  transform: none;\n}\n\n/* Generated Section */\n.generated-section {\n  margin-top: 16px;\n  padding: 16px;\n  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);\n  border: 1px solid #86efac;\n  border-radius: 10px;\n}\n\n.generated-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 10px;\n}\n\n.generated-header .form-label {\n  margin-bottom: 0;\n  color: #166534;\n}\n\n.clear-generated-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: 1px solid #86efac;\n  border-radius: 6px;\n  background: white;\n  font-size: 12px;\n  font-weight: 500;\n  color: #166534;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.clear-generated-btn:hover {\n  background: #166534;\n  color: white;\n}\n\n.generated-code {\n  display: block;\n  padding: 12px 14px;\n  background: white;\n  border: 1px solid #86efac;\n  border-radius: 6px;\n  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;\n  font-size: 13px;\n  color: #14532d;\n  margin-bottom: 10px;\n}\n\n.generated-info {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  font-size: 12px;\n  color: #166534;\n}\n\n.generated-info i {\n  margin-top: 1px;\n}\n\n/* Smart Tips */\n.smart-tips {\n  margin-top: 20px;\n  padding: 14px;\n  background: #fffbeb;\n  border: 1px solid #fde68a;\n  border-radius: 10px;\n}\n\n.tips-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin-bottom: 10px;\n  font-size: 13px;\n  font-weight: 600;\n  color: #92400e;\n}\n\n.tips-header i {\n  color: #f59e0b;\n}\n\n.tips-list {\n  margin: 0;\n  padding-left: 20px;\n  font-size: 12px;\n  color: #78350f;\n  line-height: 1.6;\n}\n\n/* Config Section */\n.config-section {\n  padding-top: 16px;\n}\n\n.section-divider {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  margin-bottom: 20px;\n}\n\n.section-divider::before,\n.section-divider::after {\n  content: '';\n  flex: 1;\n  height: 1px;\n  background: #e5e7eb;\n}\n\n.section-divider span {\n  font-size: 12px;\n  font-weight: 600;\n  color: #9ca3af;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n/* Display Type Toggle */\n.display-type-toggle {\n  display: flex;\n  gap: 12px;\n}\n\n.display-type-btn {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  padding: 16px 14px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.display-type-btn:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.display-type-btn.active {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.display-type-btn i {\n  font-size: 22px;\n  color: #6b7280;\n}\n\n.display-type-btn.active i {\n  color: #3b82f6;\n}\n\n.display-type-btn span {\n  font-size: 14px;\n  font-weight: 600;\n  color: #374151;\n}\n\n.display-type-btn.active span {\n  color: #1d4ed8;\n}\n\n.display-type-btn small {\n  font-size: 11px;\n  color: #9ca3af;\n}\n\n.display-type-btn.active small {\n  color: #60a5fa;\n}\n\n/* Icon Selector */\n.icon-selector {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.selected-icon {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  background: #eff6ff;\n  border: 1px solid #93c5fd;\n  border-radius: 8px;\n  width: fit-content;\n}\n\n.selected-icon i:first-child {\n  font-size: 20px;\n  color: #3b82f6;\n}\n\n.clear-icon-btn {\n  width: 24px;\n  height: 24px;\n  border: none;\n  background: white;\n  border-radius: 50%;\n  cursor: pointer;\n  color: #9ca3af;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  transition: all 0.15s ease;\n}\n\n.clear-icon-btn:hover {\n  background: #dc2626;\n  color: white;\n}\n\n.icon-grid {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.icon-btn {\n  width: 40px;\n  height: 40px;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  background: white;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.15s ease;\n}\n\n.icon-btn:hover {\n  border-color: #d1d5db;\n  background: #f9fafb;\n}\n\n.icon-btn.active {\n  border-color: #3b82f6;\n  background: #eff6ff;\n}\n\n.icon-btn i {\n  font-size: 16px;\n  color: #6b7280;\n}\n\n.icon-btn.active i {\n  color: #3b82f6;\n}\n\n/* Dialog Footer */\n.dialog-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 18px 24px;\n  border-top: 1px solid #e5e7eb;\n  background: #f8fafc;\n  border-radius: 0 0 16px 16px;\n}\n\n.footer-left {\n  display: flex;\n  gap: 10px;\n}\n\n.footer-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 11px 18px;\n  border: 1px solid #d1d5db;\n  border-radius: 10px;\n  background: white;\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.footer-btn:hover:not(:disabled) {\n  background: #f3f4f6;\n  border-color: #9ca3af;\n}\n\n.footer-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.footer-btn.primary {\n  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);\n  border-color: #3b82f6;\n  color: white;\n}\n\n.footer-btn.primary:hover:not(:disabled) {\n  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);\n  border-color: #2563eb;\n  transform: translateY(-1px);\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.35);\n}\n\n/* Validation Message */\n.validation-message {\n  position: absolute;\n  bottom: 80px;\n  left: 24px;\n  right: 24px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 14px;\n  background: #fef2f2;\n  border: 1px solid #fecaca;\n  border-radius: 8px;\n  font-size: 13px;\n  color: #dc2626;\n}\n\n.validation-message i {\n  flex-shrink: 0;\n}\n\n/* Responsive */\n@media (max-width: 600px) {\n  .dialog-panel {\n    width: calc(100vw - 24px);\n    max-height: calc(100vh - 40px);\n    border-radius: 12px;\n  }\n\n  .dialog-header,\n  .dialog-footer {\n    border-radius: 0;\n  }\n\n  .dialog-header {\n    border-radius: 12px 12px 0 0;\n  }\n\n  .dialog-footer {\n    border-radius: 0 0 12px 12px;\n  }\n\n  .mode-btn {\n    padding: 10px 8px;\n  }\n\n  .mode-btn span {\n    font-size: 11px;\n  }\n\n  .function-grid {\n    grid-template-columns: repeat(2, 1fr);\n  }\n\n  .display-type-toggle {\n    flex-direction: column;\n  }\n}\n"] }]
+    }], () => [{ type: i0.ChangeDetectorRef }], { Entity: [{
+            type: Input
+        }], Aggregate: [{
+            type: Input
+        }], IsOpen: [{
+            type: Input
+        }], Close: [{
+            type: Output
+        }], Save: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AggregateSetupDialogComponent, { className: "AggregateSetupDialogComponent", filePath: "src/lib/aggregate-setup-dialog/aggregate-setup-dialog.component.ts", lineNumber: 55 }); })();
+//# sourceMappingURL=aggregate-setup-dialog.component.js.map