@eric-emg/symphiq-components 1.2.543 → 1.2.545

package/fesm2022/symphiq-components.mjs

@@ -70099,6 +70099,7 @@ class MetricExecutiveSummaryComponent {
             : 'bg-blue-100 text-blue-800', ...(ngDevMode ? [{ debugName: "numberBadgeClasses" }] : []));
         this.quickWinTextClasses = computed(() => this.isDark() ? 'text-slate-100' : 'text-slate-900', ...(ngDevMode ? [{ debugName: "quickWinTextClasses" }] : []));
         this.metaTextClasses = computed(() => this.isDark() ? 'text-slate-400' : 'text-slate-600', ...(ngDevMode ? [{ debugName: "metaTextClasses" }] : []));
+        console.log('[MetricExecutiveSummary] Component constructed - button should be clickable!');
     }
     handleViewMetricDetailsClick() {
         console.log('[MetricExecutiveSummary] View Metric Details button clicked!');
@@ -70575,7 +70576,7 @@ class MetricExecutiveSummaryComponent {
     </section>
   `
             }]
-    }], null, { viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], summary: [{ type: i0.Input, args: [{ isSignal: true, alias: "summary", required: true }] }], metricName: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricName", required: false }] }], allGoals: [{ type: i0.Input, args: [{ isSignal: true, alias: "allGoals", required: false }] }], topPrioritiesClick: [{ type: i0.Output, args: ["topPrioritiesClick"] }], priorityDetailClick: [{ type: i0.Output, args: ["priorityDetailClick"] }], viewMetricDetailsClick: [{ type: i0.Output, args: ["viewMetricDetailsClick"] }] }); })();
+    }], () => [], { viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], summary: [{ type: i0.Input, args: [{ isSignal: true, alias: "summary", required: true }] }], metricName: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricName", required: false }] }], allGoals: [{ type: i0.Input, args: [{ isSignal: true, alias: "allGoals", required: false }] }], topPrioritiesClick: [{ type: i0.Output, args: ["topPrioritiesClick"] }], priorityDetailClick: [{ type: i0.Output, args: ["priorityDetailClick"] }], viewMetricDetailsClick: [{ type: i0.Output, args: ["viewMetricDetailsClick"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MetricExecutiveSummaryComponent, { className: "MetricExecutiveSummaryComponent", filePath: "lib/components/profile-analysis-shop-dashboard/metric-executive-summary.component.ts", lineNumber: 314 }); })();
 
 const _c0$t = a0 => ({ name: "chevron-right", source: a0 });
@@ -77794,8 +77795,35 @@ class ProfileSectionContentComponent {
                 normalizedName.includes(m.metric?.toUpperCase() || ''));
         }
         if (metric) {
-            this.modalService.openMetricModal(metric, this.allCharts());
+            const charts = this.chartsForMetric(metric);
+            this.modalService.openMetricModal(metric, charts);
+        }
+    }
+    chartsForMetric(metric) {
+        const metricId = metric.performanceItemId;
+        const metricName = metric.metric;
+        if (!metricId && !metricName) {
+            return [];
+        }
+        const allChartsArr = this.allCharts();
+        const matchingCharts = [];
+        const metricNameLower = metricName?.toLowerCase() || '';
+        const metricNameNormalized = metricNameLower.replace(/\s+/g, '_');
+        for (const chart of allChartsArr) {
+            const chartId = chart.performanceItemId || '';
+            const chartIdLower = chartId.toLowerCase();
+            if (metricId) {
+                const prefix = metricId + '_';
+                if (chartId === metricId || chartId.startsWith(prefix)) {
+                    matchingCharts.push(chart);
+                    continue;
+                }
+            }
+            if (metricName && chartIdLower.includes(metricNameNormalized)) {
+                matchingCharts.push(chart);
+            }
         }
+        return matchingCharts;
     }
     getEffortBadgeClasses(effort) {
         if (!effort)
@@ -85741,7 +85769,7 @@ function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_7_Template(
 function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "symphiq-metric-executive-summary", 32);
-    i0.ɵɵlistener("topPrioritiesClick", function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template_symphiq_metric_executive_summary_topPrioritiesClick_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleMetricTopPrioritiesClick()); })("priorityDetailClick", function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template_symphiq_metric_executive_summary_priorityDetailClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleMetricPriorityDetailClick($event)); });
+    i0.ɵɵlistener("topPrioritiesClick", function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template_symphiq_metric_executive_summary_topPrioritiesClick_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleMetricTopPrioritiesClick()); })("priorityDetailClick", function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template_symphiq_metric_executive_summary_priorityDetailClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleMetricPriorityDetailClick($event)); })("viewMetricDetailsClick", function CollapsibleAnalysisSectionGroupComponent_For_23_Conditional_13_Template_symphiq_metric_executive_summary_viewMetricDetailsClick_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.handleViewMetricDetailsClick()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext(2);
@@ -86039,6 +86067,41 @@ class CollapsibleAnalysisSectionGroupComponent {
             this.modalService.navigateToTopPriorityDetail(event.priority, event.index, this.viewMode(), this.metricName(), totalCount);
         }
     }
+    handleViewMetricDetailsClick() {
+        console.log('[CollapsibleAnalysisSectionGroup] handleViewMetricDetailsClick called');
+        const metricKey = this.metricExecutiveSummary()?.metric;
+        console.log('[CollapsibleAnalysisSectionGroup] metricKey:', metricKey);
+        if (!metricKey) {
+            console.log('[CollapsibleAnalysisSectionGroup] No metricKey found');
+            return;
+        }
+        const allMetrics = this.allMetrics();
+        const metric = allMetrics.find(m => m.metric === metricKey);
+        console.log('[CollapsibleAnalysisSectionGroup] Found metric:', !!metric);
+        if (metric) {
+            const allCharts = this.allCharts();
+            const metricCharts = allCharts.filter(chart => {
+                const chartId = chart.performanceItemId?.toLowerCase() || '';
+                const metricId = metricKey.toLowerCase();
+                return chartId.includes(metricId) || chartId.startsWith(metricId);
+            });
+            console.log('[CollapsibleAnalysisSectionGroup] Opening modal with metric and', metricCharts.length, 'charts');
+            this.modalService.openMetricModal(metric, metricCharts);
+        }
+        else {
+            const summary = this.metricExecutiveSummary();
+            if (summary) {
+                const constructedMetric = {
+                    metric: metricKey,
+                    currentValue: typeof summary.currentValue === 'string' ? parseFloat(summary.currentValue) || 0 : (summary.currentValue ?? 0),
+                    targetValue: typeof summary.targetValue === 'string' ? parseFloat(summary.targetValue) || 0 : (summary.targetValue ?? 0),
+                    description: summary.gradeRationale
+                };
+                console.log('[CollapsibleAnalysisSectionGroup] Opening modal with constructed metric');
+                this.modalService.openMetricModal(constructedMetric, []);
+            }
+        }
+    }
     formatDescription(description) {
         if (!description)
             return description;
@@ -86057,7 +86120,7 @@ class CollapsibleAnalysisSectionGroupComponent {
         });
     }
     static { this.ɵfac = function CollapsibleAnalysisSectionGroupComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CollapsibleAnalysisSectionGroupComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CollapsibleAnalysisSectionGroupComponent, selectors: [["symphiq-collapsible-analysis-section-group"]], inputs: { sections: [1, "sections"], viewMode: [1, "viewMode"], executiveSummary: [1, "executiveSummary"], focusAreaExecutiveSummary: [1, "focusAreaExecutiveSummary"], metricExecutiveSummary: [1, "metricExecutiveSummary"], metricName: [1, "metricName"], allGoals: [1, "allGoals"], allMetrics: [1, "allMetrics"], allCharts: [1, "allCharts"], allInsights: [1, "allInsights"], businessProfile: [1, "businessProfile"] }, decls: 24, vars: 12, consts: [[1, "rounded-2xl", "border", "shadow-lg", "overflow-hidden", 3, "ngClass"], [1, "px-6", "py-5", "border-b", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "flex", "items-center", "gap-3"], [1, "p-2.5", "rounded-lg", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "text-sm", "mt-0.5", 3, "ngClass"], [1, "p-6", 3, "ngClass"], [1, "mb-6", "p-4", "rounded-xl", "border", "flex", "items-start", "gap-3", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "mt-0.5", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "flex-1"], [1, "font-semibold", "text-sm", "mb-1", 3, "ngClass"], [1, "text-sm", "leading-relaxed", 3, "ngClass"], [1, "space-y-3"], [1, "rounded-xl", "border", "overflow-hidden", "transition-all", "duration-200", 3, "id", "ngClass"], ["type", "button", 1, "cursor-pointer", "w-full", "px-5", "py-4", "flex", "items-center", "justify-between", "gap-4", "text-left", "transition-colors", "duration-200", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-3", "flex-1", "min-w-0"], [1, "p-2", "rounded-lg", "flex-shrink-0", "transition-colors", "duration-200", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "font-semibold", "transition-colors", "duration-200", 3, "ngClass"], [1, "text-sm", "mt-0.5", "line-clamp-1", "transition-colors", "duration-200", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "transition-transform", "duration-200", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], [1, "grid", "transition-[grid-template-rows]", "duration-300", "ease-in-out"], [1, "overflow-hidden"], [1, "border-t", "p-6", 3, "ngClass"], [3, "viewMode", "summary", "metricName", "allGoals"], [3, "viewMode", "summary", "allGoals"], ["size", "w-4 h-4", 3, "icon"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMode", "summary", "metricName", "allGoals"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMode", "summary", "allGoals"], [1, "mb-6"], [3, "section", "viewMode", "sectionIndex", "executiveSummary", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], [1, "relative"], [1, "text-sm", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "clear-both"], [1, "mb-6", "lg:float-left", "lg:mr-6", "lg:mb-4", "lg:max-w-[50%]"], [1, "mb-6", "lg:float-right", "lg:ml-6", "lg:mb-4", "lg:max-w-[50%]"], [3, "visual", "viewMode"]], template: function CollapsibleAnalysisSectionGroupComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CollapsibleAnalysisSectionGroupComponent, selectors: [["symphiq-collapsible-analysis-section-group"]], inputs: { sections: [1, "sections"], viewMode: [1, "viewMode"], executiveSummary: [1, "executiveSummary"], focusAreaExecutiveSummary: [1, "focusAreaExecutiveSummary"], metricExecutiveSummary: [1, "metricExecutiveSummary"], metricName: [1, "metricName"], allGoals: [1, "allGoals"], allMetrics: [1, "allMetrics"], allCharts: [1, "allCharts"], allInsights: [1, "allInsights"], businessProfile: [1, "businessProfile"] }, decls: 24, vars: 12, consts: [[1, "rounded-2xl", "border", "shadow-lg", "overflow-hidden", 3, "ngClass"], [1, "px-6", "py-5", "border-b", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "flex", "items-center", "gap-3"], [1, "p-2.5", "rounded-lg", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "text-sm", "mt-0.5", 3, "ngClass"], [1, "p-6", 3, "ngClass"], [1, "mb-6", "p-4", "rounded-xl", "border", "flex", "items-start", "gap-3", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "mt-0.5", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "flex-1"], [1, "font-semibold", "text-sm", "mb-1", 3, "ngClass"], [1, "text-sm", "leading-relaxed", 3, "ngClass"], [1, "space-y-3"], [1, "rounded-xl", "border", "overflow-hidden", "transition-all", "duration-200", 3, "id", "ngClass"], ["type", "button", 1, "cursor-pointer", "w-full", "px-5", "py-4", "flex", "items-center", "justify-between", "gap-4", "text-left", "transition-colors", "duration-200", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-3", "flex-1", "min-w-0"], [1, "p-2", "rounded-lg", "flex-shrink-0", "transition-colors", "duration-200", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "font-semibold", "transition-colors", "duration-200", 3, "ngClass"], [1, "text-sm", "mt-0.5", "line-clamp-1", "transition-colors", "duration-200", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-5", "h-5", "flex-shrink-0", "transition-transform", "duration-200", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], [1, "grid", "transition-[grid-template-rows]", "duration-300", "ease-in-out"], [1, "overflow-hidden"], [1, "border-t", "p-6", 3, "ngClass"], [3, "viewMode", "summary", "metricName", "allGoals"], [3, "viewMode", "summary", "allGoals"], ["size", "w-4 h-4", 3, "icon"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMetricDetailsClick", "viewMode", "summary", "metricName", "allGoals"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMode", "summary", "allGoals"], [1, "mb-6"], [3, "section", "viewMode", "sectionIndex", "executiveSummary", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], [1, "relative"], [1, "text-sm", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "clear-both"], [1, "mb-6", "lg:float-left", "lg:mr-6", "lg:mb-4", "lg:max-w-[50%]"], [1, "mb-6", "lg:float-right", "lg:ml-6", "lg:mb-4", "lg:max-w-[50%]"], [3, "visual", "viewMode"]], template: function CollapsibleAnalysisSectionGroupComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "div", 3)(4, "div", 4);
             i0.ɵɵnamespaceSVG();
             i0.ɵɵelementStart(5, "svg", 5);
@@ -86207,6 +86270,7 @@ class CollapsibleAnalysisSectionGroupComponent {
                         [allGoals]="allGoals()"
                         (topPrioritiesClick)="handleMetricTopPrioritiesClick()"
                         (priorityDetailClick)="handleMetricPriorityDetailClick($event)"
+                        (viewMetricDetailsClick)="handleViewMetricDetailsClick()"
                       />
                     } @else if (section.id === 'focus-area-executive-summary' && focusAreaExecutiveSummary()) {
                       <symphiq-focus-area-executive-summary
@@ -86275,7 +86339,7 @@ class CollapsibleAnalysisSectionGroupComponent {
   `
             }]
     }], null, { sections: [{ type: i0.Input, args: [{ isSignal: true, alias: "sections", required: false }] }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], executiveSummary: [{ type: i0.Input, args: [{ isSignal: true, alias: "executiveSummary", required: false }] }], focusAreaExecutiveSummary: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusAreaExecutiveSummary", required: false }] }], metricExecutiveSummary: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricExecutiveSummary", required: false }] }], metricName: [{ type: i0.Input, args: [{ isSignal: true, alias: "metricName", required: false }] }], allGoals: [{ type: i0.Input, args: [{ isSignal: true, alias: "allGoals", required: false }] }], allMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "allMetrics", required: false }] }], allCharts: [{ type: i0.Input, args: [{ isSignal: true, alias: "allCharts", required: false }] }], allInsights: [{ type: i0.Input, args: [{ isSignal: true, alias: "allInsights", required: false }] }], businessProfile: [{ type: i0.Input, args: [{ isSignal: true, alias: "businessProfile", required: false }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CollapsibleAnalysisSectionGroupComponent, { className: "CollapsibleAnalysisSectionGroupComponent", filePath: "lib/components/profile-analysis-shop-dashboard/cards/collapsible-analysis-section-group.component.ts", lineNumber: 172 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CollapsibleAnalysisSectionGroupComponent, { className: "CollapsibleAnalysisSectionGroupComponent", filePath: "lib/components/profile-analysis-shop-dashboard/cards/collapsible-analysis-section-group.component.ts", lineNumber: 173 }); })();
 
 const _forTrack0$g = ($index, $item) => $item.code;
 function BillingCurrencySelectorCardComponent_For_15_Template(rf, ctx) { if (rf & 1) {
@@ -92889,7 +92953,7 @@ function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional
 function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r12 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "symphiq-metric-executive-summary", 92);
-    i0.ɵɵlistener("topPrioritiesClick", function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template_symphiq_metric_executive_summary_topPrioritiesClick_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleMetricTopPrioritiesClick()); })("priorityDetailClick", function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template_symphiq_metric_executive_summary_priorityDetailClick_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleMetricPriorityDetailClick($event)); });
+    i0.ɵɵlistener("topPrioritiesClick", function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template_symphiq_metric_executive_summary_topPrioritiesClick_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleMetricTopPrioritiesClick()); })("priorityDetailClick", function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template_symphiq_metric_executive_summary_priorityDetailClick_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleMetricPriorityDetailClick($event)); })("viewMetricDetailsClick", function SymphiqProfileShopAnalysisDashboardComponent_Conditional_10_Conditional_1_Template_symphiq_metric_executive_summary_viewMetricDetailsClick_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleMetricViewDetailsClick()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -93752,6 +93816,66 @@ class SymphiqProfileShopAnalysisDashboardComponent {
             this.modalService.navigateToTopPriorityDetail(priority, index, this.viewMode(), metricName, totalCount);
         }
     }
+    handleMetricViewDetailsClick() {
+        console.log('[ShopDashboard.ViewMetricDetails] Handler called');
+        const summary = this.metricExecutiveSummary();
+        const metricKey = summary?.metric || this.metricName();
+        console.log('[ShopDashboard.ViewMetricDetails] metricKey:', metricKey);
+        if (!metricKey) {
+            console.log('[ShopDashboard.ViewMetricDetails] No metricKey found, returning early');
+            return;
+        }
+        const allMetricsArr = this.allMetrics();
+        console.log('[ShopDashboard.ViewMetricDetails] allMetrics count:', allMetricsArr.length);
+        const metric = allMetricsArr.find(m => m.metric === metricKey);
+        console.log('[ShopDashboard.ViewMetricDetails] Found metric:', metric?.metric);
+        if (metric) {
+            const charts = this.chartsForMetric(metric);
+            console.log('[ShopDashboard.ViewMetricDetails] Filtered charts count:', charts.length);
+            this.modalService.openMetricModal(metric, charts);
+        }
+        else if (summary) {
+            const constructedMetric = {
+                metric: metricKey,
+                currentValue: typeof summary.currentValue === 'string' ? parseFloat(summary.currentValue) || 0 : (summary.currentValue ?? 0),
+                targetValue: typeof summary.targetValue === 'string' ? parseFloat(summary.targetValue) || 0 : (summary.targetValue ?? 0),
+                description: summary.gradeRationale
+            };
+            console.log('[ShopDashboard.ViewMetricDetails] Using constructed metric');
+            const charts = this.chartsForMetric(constructedMetric);
+            console.log('[ShopDashboard.ViewMetricDetails] Filtered charts count:', charts.length);
+            this.modalService.openMetricModal(constructedMetric, charts);
+        }
+    }
+    chartsForMetric(metric) {
+        const metricId = metric.performanceItemId;
+        const metricName = metric.metric;
+        console.log('[ShopDashboard.chartsForMetric] Called with metric:', metricName, 'performanceItemId:', metricId);
+        if (!metricId && !metricName) {
+            return [];
+        }
+        const allChartsArr = this.allCharts();
+        console.log('[ShopDashboard.chartsForMetric] Total allCharts:', allChartsArr.length);
+        const matchingCharts = [];
+        const metricNameLower = metricName?.toLowerCase() || '';
+        const metricNameNormalized = metricNameLower.replace(/\s+/g, '_');
+        for (const chart of allChartsArr) {
+            const chartId = chart.performanceItemId || '';
+            const chartIdLower = chartId.toLowerCase();
+            if (metricId) {
+                const prefix = metricId + '_';
+                if (chartId === metricId || chartId.startsWith(prefix)) {
+                    matchingCharts.push(chart);
+                    continue;
+                }
+            }
+            if (metricName && chartIdLower.includes(metricNameNormalized)) {
+                matchingCharts.push(chart);
+            }
+        }
+        console.log('[ShopDashboard.chartsForMetric] Matching charts count:', matchingCharts.length);
+        return matchingCharts;
+    }
     getCurrentModalState() {
         return {
             type: this.modalType(),
@@ -94094,7 +94218,7 @@ class SymphiqProfileShopAnalysisDashboardComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.planSelectionContainer = _t.first);
         } }, hostBindings: function SymphiqProfileShopAnalysisDashboardComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("scroll", function SymphiqProfileShopAnalysisDashboardComponent_scroll_HostBindingHandler($event) { return ctx.onWindowScroll($event); }, i0.ɵɵresolveWindow);
-        } }, inputs: { viewMode: [1, "viewMode"], requestedByUser: [1, "requestedByUser"], createdDate: [1, "createdDate"], embedded: [1, "embedded"], profileAnalysis: [1, "profileAnalysis"], profile: [1, "profile"], funnelAnalysis: [1, "funnelAnalysis"], focusAreaDetails: [1, "focusAreaDetails"], account: [1, "account"], profileShop: [1, "profileShop"], profileShopQuestions: [1, "profileShopQuestions"], profileAnswers: [1, "profileAnswers"], profileAnswerHistories: [1, "profileAnswerHistories"], itemStatusProfileShop: [1, "itemStatusProfileShop"], itemStatusProfileAnalysis: [1, "itemStatusProfileAnalysis"], planCardInfos: [1, "planCardInfos"], isOnboarded: [1, "isOnboarded"], scrollEvent: [1, "scrollEvent"], scrollElement: [1, "scrollElement"], users: [1, "users"], isLoading: [1, "isLoading"], forDemo: [1, "forDemo"], currentUser: [1, "currentUser"], maxAccessibleStepId: [1, "maxAccessibleStepId"], isMarkingAsReviewed: [1, "isMarkingAsReviewed"] }, outputs: { stepClick: "stepClick", nextStepClick: "nextStepClick", currencySelectionClick: "currencySelectionClick", editCurrencyClick: "editCurrencyClick", periodUnitChanged: "periodUnitChanged", planSelected: "planSelected", checkoutPlanClick: "checkoutPlanClick", answerShopProfileQuestions: "answerShopProfileQuestions", continueShopProfileQuestions: "continueShopProfileQuestions", profileQuestionAnswerSave: "profileQuestionAnswerSave", shopProfileAdminAnswerAction: "shopProfileAdminAnswerAction", markAsReviewedClick: "markAsReviewedClick" }, features: [i0.ɵɵNgOnChangesFeature], decls: 31, vars: 58, consts: [["shopProfileStatusCard", ""], ["planSelectionContainer", ""], [1, "relative", 3, "ngClass"], [1, "animated-bubbles", 2, "position", "fixed", "top", "0", "left", "0", "right", "0", "bottom", "0", "width", "100vw", "height", "100vh", "z-index", "1", "pointer-events", "none"], [1, "h-full", "transition-all", "duration-200", "ease-out", 3, "ngClass"], [1, "relative", "z-[51]"], [3, "searchClick", "viewModeClick", "title", "subtitle", "currentSection", "viewMode", "viewModeLabel", "isLoading", "requestedByUser", "createdDate", "showControls"], [3, "viewMode", "currentStepId", "showNextStepAction", "forDemo", "maxAccessibleStepId"], [1, "relative", "z-10", "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-12", "space-y-12"], [3, "sections", "viewMode", "embedded", "scrollElement"], [3, "close", "isOpen", "isLightMode"], [3, "close", "modeSelected", "isOpen", "currentMode", "viewMode"], [3, "isLightMode", "allMetrics", "allInsights", "allBusinessInsights", "allCharts"], [3, "goal", "viewMode", "isInModal", "allMetrics", "allCharts", "allInsights", "currentModalState", "businessProfile"], [3, "goal", "viewMode"], [3, "objective", "goalTitle", "viewMode"], [3, "strategy", "objectiveTitle", "goalTitle", "viewMode", "expandedRecommendationId", "allMetrics", "allCharts", "allInsights", "allBusinessInsights", "currentModalState"], [3, "category", "viewMode", "scrollToSection"], [3, "strength", "viewMode", "allFunnelStrengths", "currentModalState"], [3, "gap", "viewMode", "allGoals", "allWeaknesses", "currentModalState"], [3, "opportunity", "viewMode", "allStrengths", "currentModalState"], [3, "isLightMode", "viewMode", "allMetrics", "allInsights", "allCharts"], [3, "isLightMode"], [3, "viewMode", "isEnabled", "isLoading"], [3, "viewMode", "totalQuestions", "answeredQuestions", "buttonConfig"], [1, "fixed", "bottom-0", "left-0", "right-0", "z-50", "border-t", "backdrop-blur-lg", 3, "ngClass"], [3, "markAsReviewedClick", "viewMode", "reviewStatus", "selfContentStatus", "isMarkingAsReviewed"], [3, "nextStepClick", "stepClick", "viewMode", "currentStepId", "showNextStepAction", "forDemo", "maxAccessibleStepId"], [1, "mb-12"], [3, "viewMode", "businessName", "isOnboarded"], [3, "viewMode", "metricName", "isOnboarded"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "flex-col", "items-center", "justify-center", "space-y-4"], ["size", "large", 3, "viewMode"], [1, "text-center"], [1, "text-lg", "font-semibold", "mb-1", 3, "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "mb-8"], [3, "startCategoryQuestions", "answerSave", "adminAnswerAction", "viewMode", "totalQuestions", "answeredQuestions", "questions", "profileAnswers", "profileAnswerHistories", "users", "config", "groupConfig", "currentUser"], [1, "rounded-2xl", "border", "shadow-lg", "overflow-hidden", 3, "ngClass"], ["title", "Generating Your Shop Profile", "subtitle", "We're analyzing your data to create shop specific questions and answers. They will appear when ready.", 3, "itemStatus", "viewMode"], [3, "goals", "viewMode"], ["subtitle", "We're analyzing your data to create your personalized analysis. It will appear when ready.", 3, "itemStatus", "viewMode", "title"], [3, "viewMoreClick", "goals", "viewMode"], [3, "viewMode", "selectedCurrency"], [3, "currencySelected", "selectionChanged", "viewMode", "isLoading", "initialCurrency"], [3, "viewMode"], [1, "mb-32"], [3, "periodUnitChanged", "planSelected", "editCurrency", "checkout", "viewMode", "selectedCurrency", "planCardInfos", "isLoading", "selectedPeriodUnit"], [3, "editCurrency", "viewMode", "selectedCurrency"], [3, "sections", "viewMode", "executiveSummary", "metricExecutiveSummary", "metricName", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], ["id", "section-executive-summary", 1, "space-y-6", "scroll-mt-24"], [3, "viewMode", "summary", "metricName", "allGoals"], [1, "space-y-8"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "space-y-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1"], [1, "text-2xl", "font-bold", "mb-3", 3, "ngClass"], [1, "text-lg", "leading-relaxed", 3, "ngClass"], [3, "grade", "gradeRationale", "viewMode"], [1, "rounded-xl", "p-6", 3, "ngClass"], [1, "grid", "grid-cols-1", "md:grid-cols-3", "gap-4"], ["type", "button", 1, "p-4", "rounded-xl", "text-left", "transition-all", "duration-200", "hover:scale-[1.02]", "active:scale-[0.98]", "group", "cursor-pointer", 3, "click", "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", "mb-2", 3, "ngClass"], [1, "flex", "items-center", "gap-1.5", "text-xs", "font-medium"], [3, "ngClass"], ["size", "w-4 h-4", 1, "transition-transform", "group-hover:translate-x-1", 3, "icon", "ngClass"], ["size", "w-4 h-4", 1, "transition-transform", "group-hover:translate-y-1", "animate-bounce", 3, "icon", "ngClass"], ["id", "quick-wins-section", 1, "space-y-4", "scroll-mt-24"], [1, "text-lg", "font-semibold", "mb-3", 3, "ngClass"], [1, "relative"], [1, "mb-6", "lg:float-left", "lg:mr-6", "lg:mb-4", "lg:max-w-[66%]"], [1, "text-sm", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "clear-both"], [3, "visual", "viewMode"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "grid", "grid-cols-1", "lg:grid-cols-2", "gap-6"], [1, "rounded-xl", "p-6", "transition-all", "duration-300", 3, "ngClass"], [1, "space-y-4"], [1, "flex", "items-start", "gap-3"], [1, "flex-shrink-0", "w-8", "h-8", "rounded-full", "flex", "items-center", "justify-center", "text-sm", "font-bold", 3, "ngClass"], [1, "font-semibold", "leading-tight", "flex-1", 3, "ngClass"], [1, "flex", "flex-wrap", "gap-2"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "text-sm", 3, "ngClass"], [1, "space-y-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "relatedGoalIds", "allGoals", "viewMode"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMode", "summary", "metricName", "allGoals"], [3, "viewMode", "sectionIcon"], [1, "rounded-xl", "p-8", "scroll-mt-24", 3, "id", "ngClass"], [1, "flex", "items-start", "gap-3", "mb-6"], [1, "flex-shrink-0", "w-12", "h-12", "rounded-xl", "flex", "items-center", "justify-center", 3, "ngClass"], [1, "text-2xl", "font-bold", 3, "ngClass"], [1, "mb-6", "flex", "flex-col", "lg:flex-row", "gap-6", "items-start", 3, "lg:flex-row-reverse"], [3, "section", "executiveSummary", "viewMode", "sectionIndex", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], ["size", "w-6 h-6", 3, "icon"], [1, "mb-6", "flex", "flex-col", "lg:flex-row", "gap-6", "items-start"], [1, "w-full", "lg:w-2/3"], [1, "w-full", 3, "lg:w-1/3", "lg:w-full"], [1, "w-full"], [3, "continueClick", "viewMode", "isEnabled", "isLoading"], [3, "continueClick", "viewMode", "totalQuestions", "answeredQuestions", "buttonConfig"], [1, "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-4"], [1, "flex", "items-center", "gap-4"], [1, "px-6", "py-4", "rounded-xl", "font-semibold", "text-lg", "transition-all", "duration-300", "cursor-pointer", 3, "click", "ngClass"], [1, "flex-1", "px-6", "py-4", "rounded-xl", "font-semibold", "text-lg", "transition-all", "duration-300", "flex", "items-center", "justify-center", "gap-3", "shadow-2xl", 3, "click", "disabled", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "transition-transform", "duration-200"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7l5 5m0 0l-5 5m5-5H6"]], template: function SymphiqProfileShopAnalysisDashboardComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { viewMode: [1, "viewMode"], requestedByUser: [1, "requestedByUser"], createdDate: [1, "createdDate"], embedded: [1, "embedded"], profileAnalysis: [1, "profileAnalysis"], profile: [1, "profile"], funnelAnalysis: [1, "funnelAnalysis"], focusAreaDetails: [1, "focusAreaDetails"], account: [1, "account"], profileShop: [1, "profileShop"], profileShopQuestions: [1, "profileShopQuestions"], profileAnswers: [1, "profileAnswers"], profileAnswerHistories: [1, "profileAnswerHistories"], itemStatusProfileShop: [1, "itemStatusProfileShop"], itemStatusProfileAnalysis: [1, "itemStatusProfileAnalysis"], planCardInfos: [1, "planCardInfos"], isOnboarded: [1, "isOnboarded"], scrollEvent: [1, "scrollEvent"], scrollElement: [1, "scrollElement"], users: [1, "users"], isLoading: [1, "isLoading"], forDemo: [1, "forDemo"], currentUser: [1, "currentUser"], maxAccessibleStepId: [1, "maxAccessibleStepId"], isMarkingAsReviewed: [1, "isMarkingAsReviewed"] }, outputs: { stepClick: "stepClick", nextStepClick: "nextStepClick", currencySelectionClick: "currencySelectionClick", editCurrencyClick: "editCurrencyClick", periodUnitChanged: "periodUnitChanged", planSelected: "planSelected", checkoutPlanClick: "checkoutPlanClick", answerShopProfileQuestions: "answerShopProfileQuestions", continueShopProfileQuestions: "continueShopProfileQuestions", profileQuestionAnswerSave: "profileQuestionAnswerSave", shopProfileAdminAnswerAction: "shopProfileAdminAnswerAction", markAsReviewedClick: "markAsReviewedClick" }, features: [i0.ɵɵNgOnChangesFeature], decls: 31, vars: 58, consts: [["shopProfileStatusCard", ""], ["planSelectionContainer", ""], [1, "relative", 3, "ngClass"], [1, "animated-bubbles", 2, "position", "fixed", "top", "0", "left", "0", "right", "0", "bottom", "0", "width", "100vw", "height", "100vh", "z-index", "1", "pointer-events", "none"], [1, "h-full", "transition-all", "duration-200", "ease-out", 3, "ngClass"], [1, "relative", "z-[51]"], [3, "searchClick", "viewModeClick", "title", "subtitle", "currentSection", "viewMode", "viewModeLabel", "isLoading", "requestedByUser", "createdDate", "showControls"], [3, "viewMode", "currentStepId", "showNextStepAction", "forDemo", "maxAccessibleStepId"], [1, "relative", "z-10", "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-12", "space-y-12"], [3, "sections", "viewMode", "embedded", "scrollElement"], [3, "close", "isOpen", "isLightMode"], [3, "close", "modeSelected", "isOpen", "currentMode", "viewMode"], [3, "isLightMode", "allMetrics", "allInsights", "allBusinessInsights", "allCharts"], [3, "goal", "viewMode", "isInModal", "allMetrics", "allCharts", "allInsights", "currentModalState", "businessProfile"], [3, "goal", "viewMode"], [3, "objective", "goalTitle", "viewMode"], [3, "strategy", "objectiveTitle", "goalTitle", "viewMode", "expandedRecommendationId", "allMetrics", "allCharts", "allInsights", "allBusinessInsights", "currentModalState"], [3, "category", "viewMode", "scrollToSection"], [3, "strength", "viewMode", "allFunnelStrengths", "currentModalState"], [3, "gap", "viewMode", "allGoals", "allWeaknesses", "currentModalState"], [3, "opportunity", "viewMode", "allStrengths", "currentModalState"], [3, "isLightMode", "viewMode", "allMetrics", "allInsights", "allCharts"], [3, "isLightMode"], [3, "viewMode", "isEnabled", "isLoading"], [3, "viewMode", "totalQuestions", "answeredQuestions", "buttonConfig"], [1, "fixed", "bottom-0", "left-0", "right-0", "z-50", "border-t", "backdrop-blur-lg", 3, "ngClass"], [3, "markAsReviewedClick", "viewMode", "reviewStatus", "selfContentStatus", "isMarkingAsReviewed"], [3, "nextStepClick", "stepClick", "viewMode", "currentStepId", "showNextStepAction", "forDemo", "maxAccessibleStepId"], [1, "mb-12"], [3, "viewMode", "businessName", "isOnboarded"], [3, "viewMode", "metricName", "isOnboarded"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "flex-col", "items-center", "justify-center", "space-y-4"], ["size", "large", 3, "viewMode"], [1, "text-center"], [1, "text-lg", "font-semibold", "mb-1", 3, "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "mb-8"], [3, "startCategoryQuestions", "answerSave", "adminAnswerAction", "viewMode", "totalQuestions", "answeredQuestions", "questions", "profileAnswers", "profileAnswerHistories", "users", "config", "groupConfig", "currentUser"], [1, "rounded-2xl", "border", "shadow-lg", "overflow-hidden", 3, "ngClass"], ["title", "Generating Your Shop Profile", "subtitle", "We're analyzing your data to create shop specific questions and answers. They will appear when ready.", 3, "itemStatus", "viewMode"], [3, "goals", "viewMode"], ["subtitle", "We're analyzing your data to create your personalized analysis. It will appear when ready.", 3, "itemStatus", "viewMode", "title"], [3, "viewMoreClick", "goals", "viewMode"], [3, "viewMode", "selectedCurrency"], [3, "currencySelected", "selectionChanged", "viewMode", "isLoading", "initialCurrency"], [3, "viewMode"], [1, "mb-32"], [3, "periodUnitChanged", "planSelected", "editCurrency", "checkout", "viewMode", "selectedCurrency", "planCardInfos", "isLoading", "selectedPeriodUnit"], [3, "editCurrency", "viewMode", "selectedCurrency"], [3, "sections", "viewMode", "executiveSummary", "metricExecutiveSummary", "metricName", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], ["id", "section-executive-summary", 1, "space-y-6", "scroll-mt-24"], [3, "viewMode", "summary", "metricName", "allGoals"], [1, "space-y-8"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "space-y-6"], [1, "flex", "items-start", "justify-between", "gap-4"], [1, "flex-1"], [1, "text-2xl", "font-bold", "mb-3", 3, "ngClass"], [1, "text-lg", "leading-relaxed", 3, "ngClass"], [3, "grade", "gradeRationale", "viewMode"], [1, "rounded-xl", "p-6", 3, "ngClass"], [1, "grid", "grid-cols-1", "md:grid-cols-3", "gap-4"], ["type", "button", 1, "p-4", "rounded-xl", "text-left", "transition-all", "duration-200", "hover:scale-[1.02]", "active:scale-[0.98]", "group", "cursor-pointer", 3, "click", "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", "mb-2", 3, "ngClass"], [1, "flex", "items-center", "gap-1.5", "text-xs", "font-medium"], [3, "ngClass"], ["size", "w-4 h-4", 1, "transition-transform", "group-hover:translate-x-1", 3, "icon", "ngClass"], ["size", "w-4 h-4", 1, "transition-transform", "group-hover:translate-y-1", "animate-bounce", 3, "icon", "ngClass"], ["id", "quick-wins-section", 1, "space-y-4", "scroll-mt-24"], [1, "text-lg", "font-semibold", "mb-3", 3, "ngClass"], [1, "relative"], [1, "mb-6", "lg:float-left", "lg:mr-6", "lg:mb-4", "lg:max-w-[66%]"], [1, "text-sm", "leading-relaxed", "whitespace-pre-line", 3, "ngClass"], [1, "clear-both"], [3, "visual", "viewMode"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "grid", "grid-cols-1", "lg:grid-cols-2", "gap-6"], [1, "rounded-xl", "p-6", "transition-all", "duration-300", 3, "ngClass"], [1, "space-y-4"], [1, "flex", "items-start", "gap-3"], [1, "flex-shrink-0", "w-8", "h-8", "rounded-full", "flex", "items-center", "justify-center", "text-sm", "font-bold", 3, "ngClass"], [1, "font-semibold", "leading-tight", "flex-1", 3, "ngClass"], [1, "flex", "flex-wrap", "gap-2"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "text-sm", 3, "ngClass"], [1, "space-y-2"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "relatedGoalIds", "allGoals", "viewMode"], [3, "topPrioritiesClick", "priorityDetailClick", "viewMetricDetailsClick", "viewMode", "summary", "metricName", "allGoals"], [3, "viewMode", "sectionIcon"], [1, "rounded-xl", "p-8", "scroll-mt-24", 3, "id", "ngClass"], [1, "flex", "items-start", "gap-3", "mb-6"], [1, "flex-shrink-0", "w-12", "h-12", "rounded-xl", "flex", "items-center", "justify-center", 3, "ngClass"], [1, "text-2xl", "font-bold", 3, "ngClass"], [1, "mb-6", "flex", "flex-col", "lg:flex-row", "gap-6", "items-start", 3, "lg:flex-row-reverse"], [3, "section", "executiveSummary", "viewMode", "sectionIndex", "allGoals", "allMetrics", "allCharts", "allInsights", "businessProfile"], ["size", "w-6 h-6", 3, "icon"], [1, "mb-6", "flex", "flex-col", "lg:flex-row", "gap-6", "items-start"], [1, "w-full", "lg:w-2/3"], [1, "w-full", 3, "lg:w-1/3", "lg:w-full"], [1, "w-full"], [3, "continueClick", "viewMode", "isEnabled", "isLoading"], [3, "continueClick", "viewMode", "totalQuestions", "answeredQuestions", "buttonConfig"], [1, "max-w-7xl", "mx-auto", "px-4", "sm:px-6", "lg:px-8", "py-4"], [1, "flex", "items-center", "gap-4"], [1, "px-6", "py-4", "rounded-xl", "font-semibold", "text-lg", "transition-all", "duration-300", "cursor-pointer", 3, "click", "ngClass"], [1, "flex-1", "px-6", "py-4", "rounded-xl", "font-semibold", "text-lg", "transition-all", "duration-300", "flex", "items-center", "justify-center", "gap-3", "shadow-2xl", 3, "click", "disabled", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "transition-transform", "duration-200"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7l5 5m0 0l-5 5m5-5H6"]], template: function SymphiqProfileShopAnalysisDashboardComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
             i0.ɵɵelement(1, "div", 3);
             i0.ɵɵelementStart(2, "div");
@@ -94631,6 +94755,7 @@ class SymphiqProfileShopAnalysisDashboardComponent {
                   [allGoals]="allGoals()"
                   (topPrioritiesClick)="handleMetricTopPrioritiesClick()"
                   (priorityDetailClick)="handleMetricPriorityDetailClick($event)"
+                  (viewMetricDetailsClick)="handleMetricViewDetailsClick()"
               />
             }
 
@@ -94928,7 +95053,7 @@ class SymphiqProfileShopAnalysisDashboardComponent {
             type: HostListener,
             args: ['window:scroll', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqProfileShopAnalysisDashboardComponent, { className: "SymphiqProfileShopAnalysisDashboardComponent", filePath: "lib/components/profile-analysis-shop-dashboard/symphiq-profile-shop-analysis-dashboard.component.ts", lineNumber: 831 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqProfileShopAnalysisDashboardComponent, { className: "SymphiqProfileShopAnalysisDashboardComponent", filePath: "lib/components/profile-analysis-shop-dashboard/symphiq-profile-shop-analysis-dashboard.component.ts", lineNumber: 834 }); })();
 
 function ProfileAnalysisStatusSummaryComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 1)(1, "div", 3);
@@ -99331,7 +99456,7 @@ class SymphiqProfileMetricsAnalysesDashboardComponent {
             i0.ɵɵstyleProp("width", ctx.scrollProgress(), "%");
             i0.ɵɵproperty("ngClass", ctx.isLightMode() ? "bg-gradient-to-r from-blue-500 to-cyan-500" : "bg-gradient-to-r from-blue-400 to-cyan-400");
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("title", "Metric Analysis")("subtitle", "Provide context for funnel stage metrics and performance")("viewMode", ctx.viewMode())("showControls", false);
+            i0.ɵɵproperty("title", "Funnel Metrics")("subtitle", "Provide context for funnel stage metrics and performance")("viewMode", ctx.viewMode())("showControls", false);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.isSimplifiedView() ? 6 : -1);
             i0.ɵɵadvance(2);
@@ -99423,7 +99548,7 @@ class SymphiqProfileMetricsAnalysesDashboardComponent {
       <div class="relative z-[51]">
         <!-- Dashboard Header -->
         <symphiq-dashboard-header
-            [title]="'Metric Analysis'"
+            [title]="'Funnel Metrics'"
             [subtitle]="'Provide context for funnel stage metrics and performance'"
             [viewMode]="viewMode()"
             [showControls]="false"
@@ -100403,6 +100528,10 @@ class SymphiqProfileAnalysisMetricDashboardComponent {
         }
     }
     ngOnInit() {
+        console.log('[MetricDashboard] ngOnInit');
+        console.log('[MetricDashboard] isSimplifiedView:', this.isSimplifiedView());
+        console.log('[MetricDashboard] currentDisplayMode:', this.currentDisplayMode());
+        console.log('[MetricDashboard] metricExecutiveSummary:', !!this.metricExecutiveSummary());
         this.funnelAnalysisSignal.set(this.funnelAnalysis());
         const profileToUse = this.profile();
         if (profileToUse) {
@@ -100615,6 +100744,8 @@ class SymphiqProfileAnalysisMetricDashboardComponent {
         return null;
     }
     handleDisplayModeChange(mode) {
+        console.log('[MetricDashboard] handleDisplayModeChange:', mode);
+        console.log('[MetricDashboard] Will show MetricExecutiveSummary:', mode !== DisplayModeEnum.SIMPLIFIED);
         this.currentDisplayMode.set(mode);
         if (mode === DisplayModeEnum.EXPANDED) {
             this.viewModeService.setViewMode('expanded');