@eric-emg/symphiq-components 1.3.50 → 1.3.52

package/fesm2022/symphiq-components.mjs

@@ -43910,9 +43910,9 @@ class ProfileAnalysisModalComponent {
                 }
                 // Check if this is from a recommendation with full hierarchy context
                 if (metricsData.recommendationContext?.title && (metricsData.goalTitle || metricsData.objectiveTitle || metricsData.strategyTitle)) {
-                    // Find relevant navigation stack indices
-                    const goalDetailIdx = stack.findIndex((s) => s.type === 'goal-detail');
-                    const objectivesIdx = stack.findIndex((s) => s.type === 'goal-objectives');
+                    // Find relevant navigation stack indices (check both regular and unified dashboard types)
+                    const goalDetailIdx = stack.findIndex((s) => s.type === 'goal-detail' || s.type === 'unified-goal-detail');
+                    const objectivesIdx = stack.findIndex((s) => s.type === 'goal-objectives' || s.type === 'unified-goal-objectives');
                     const strategiesIdx = stack.findIndex((s) => s.type === 'objective-strategies');
                     const recommendationsIdx = stack.findIndex((s) => s.type === 'strategy-recommendations');
                     // Build full hierarchy with navigation: Goal > Objectives > Objective > Strategy > Recommendation > Related Metrics
@@ -44215,6 +44215,21 @@ class ProfileAnalysisModalComponent {
                 }, 0);
                 return;
             }
+            // Close ProfileAnalysisModalComponent when navigating to unified dashboard types
+            // These should be handled by UnifiedDashboardModalComponent
+            const unifiedDashboardOwnedTypes = ['unified-goal-detail', 'unified-goal-objectives', 'unified-goal-related-metrics'];
+            if (unifiedDashboardOwnedTypes.includes(state.type || '')) {
+                console.log('[ProfileAnalysisModal] Closing - unified dashboard type detected:', state.type);
+                this.isOpen.set(false);
+                setTimeout(() => {
+                    this.modalData.set(null);
+                    this.modalType.set(null);
+                    this.modalTitle.set('');
+                    this.navigationStack.set([]);
+                    this.currentCharts.set([]);
+                }, 0);
+                return;
+            }
             // Check if navigation originates from unified dashboard flow
             // If so, let UnifiedDashboardModalComponent handle objective-strategies and strategy-recommendations
             const unifiedDashboardTypes = ['objective-strategies', 'strategy-recommendations'];
@@ -44222,6 +44237,7 @@ class ProfileAnalysisModalComponent {
                 const isFromUnifiedFlow = state.previousState?.type?.startsWith('unified-goal-') ||
                     state.navigationStack?.some(s => s.type?.startsWith('unified-goal-'));
                 if (isFromUnifiedFlow) {
+                    console.log('[ProfileAnalysisModal] Closing - unified flow detected for:', state.type);
                     this.isOpen.set(false);
                     setTimeout(() => {
                         this.modalData.set(null);
@@ -44486,6 +44502,14 @@ class ProfileAnalysisModalComponent {
             }
             else if (state.type === 'metric' && state.data) {
                 const metric = state.data;
+                console.log('[ProfileAnalysisModal] Handling metric state:', {
+                    metricName: metric.metric,
+                    chartsFromState: state.charts?.length || 0,
+                    chartIds: state.charts?.map(c => c.performanceItemId),
+                    allChartsInput: this.allCharts()?.length || 0,
+                    navigationStackLength: state.navigationStack?.length || 0,
+                    navigationStackTypes: state.navigationStack?.map(s => s.type)
+                });
                 this.modalData.set(metric);
                 const formattedName = metric.metric ? this.metricFormatter.formatMetricName(metric.metric) : 'Metric Details';
                 this.modalTitle.set(formattedName);
@@ -101800,14 +101824,14 @@ function UnifiedTimelineComponent_Conditional_0_For_8_Conditional_11_Template(rf
 } }
 function UnifiedTimelineComponent_Conditional_0_For_8_Conditional_12_For_5_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 23);
+    i0.ɵɵelementStart(0, "div", 24);
     i0.ɵɵlistener("click", function UnifiedTimelineComponent_Conditional_0_For_8_Conditional_12_For_5_Template_div_click_0_listener() { const goal_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onGoalChipClick(goal_r5)); });
-    i0.ɵɵelementStart(1, "span", 24);
+    i0.ɵɵelementStart(1, "span", 25);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(3, "svg", 25);
-    i0.ɵɵelement(4, "path", 26);
+    i0.ɵɵelementStart(3, "svg", 26);
+    i0.ɵɵelement(4, "path", 27);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const goal_r5 = ctx.$implicit;
@@ -101820,8 +101844,8 @@ function UnifiedTimelineComponent_Conditional_0_For_8_Conditional_12_Template(rf
     i0.ɵɵelementStart(0, "div", 15)(1, "div", 17);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 18);
-    i0.ɵɵrepeaterCreate(4, UnifiedTimelineComponent_Conditional_0_For_8_Conditional_12_For_5_Template, 5, 2, "div", 22, _forTrack0$b);
+    i0.ɵɵelementStart(3, "div", 22);
+    i0.ɵɵrepeaterCreate(4, UnifiedTimelineComponent_Conditional_0_For_8_Conditional_12_For_5_Template, 5, 2, "div", 23, _forTrack0$b);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const phase_r3 = i0.ɵɵnextContext().$implicit;
@@ -101994,7 +102018,7 @@ class UnifiedTimelineComponent {
         this.goalClick.emit(goal);
     }
     static { this.ɵfac = function UnifiedTimelineComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || UnifiedTimelineComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedTimelineComponent, selectors: [["symphiq-unified-timeline"]], inputs: { timeline: [1, "timeline"], viewMode: [1, "viewMode"], goals: [1, "goals"] }, outputs: { goalClick: "goalClick" }, decls: 1, vars: 1, consts: [["id", "section-timeline", 1, "space-y-6", "scroll-mt-24"], [3, "viewMode", "sectionIcon"], ["title", "Implementation Timeline", 3, "icon", "viewMode"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "relative"], [1, "absolute", "left-6", "top-0", "bottom-0", "w-0.5", 3, "ngClass"], [1, "space-y-8"], [1, "relative", "pl-16", "group"], [1, "absolute", "left-4", "w-5", "h-5", "rounded-full", "border-4", "flex", "items-center", "justify-center", "transition-all", "duration-300", "group-hover:scale-125", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", 3, "ngClass"], [1, "rounded-xl", "p-5", "transition-all", "duration-300", 3, "ngClass"], [1, "flex", "items-start", "justify-between", "gap-4", "mb-3"], [1, "text-base", "font-semibold", 3, "ngClass"], [1, "px-2", "py-1", "text-xs", "font-semibold", "rounded-full", "flex-shrink-0", 3, "ngClass"], [1, "text-sm", "mb-4", 3, "ngClass"], [1, "mt-4"], [1, "absolute", "-left-[52px]", "top-0", "text-xs", "font-bold", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-2", 3, "ngClass"], [1, "space-y-2"], [1, "flex", "items-start", "gap-2", "text-sm", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", "mt-1.5", "flex-shrink-0", 3, "ngClass"], [1, "line-clamp-1"], [1, "goal-chip", "flex", "items-center", "justify-between", "gap-2", "px-3", "py-2", "rounded-lg", "cursor-pointer", 3, "ngClass"], [1, "goal-chip", "flex", "items-center", "justify-between", "gap-2", "px-3", "py-2", "rounded-lg", "cursor-pointer", 3, "click", "ngClass"], [1, "text-sm", "font-medium", "line-clamp-1"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "flex-shrink-0"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"]], template: function UnifiedTimelineComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UnifiedTimelineComponent, selectors: [["symphiq-unified-timeline"]], inputs: { timeline: [1, "timeline"], viewMode: [1, "viewMode"], goals: [1, "goals"] }, outputs: { goalClick: "goalClick" }, decls: 1, vars: 1, consts: [["id", "section-timeline", 1, "space-y-6", "scroll-mt-24"], [3, "viewMode", "sectionIcon"], ["title", "Implementation Timeline", 3, "icon", "viewMode"], [1, "rounded-2xl", "p-8", "shadow-xl", 3, "ngClass"], [1, "relative"], [1, "absolute", "left-6", "top-0", "bottom-0", "w-0.5", 3, "ngClass"], [1, "space-y-8"], [1, "relative", "pl-16", "group"], [1, "absolute", "left-4", "w-5", "h-5", "rounded-full", "border-4", "flex", "items-center", "justify-center", "transition-all", "duration-300", "group-hover:scale-125", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", 3, "ngClass"], [1, "rounded-xl", "p-5", "transition-all", "duration-300", 3, "ngClass"], [1, "flex", "items-start", "justify-between", "gap-4", "mb-3"], [1, "text-base", "font-semibold", 3, "ngClass"], [1, "px-2", "py-1", "text-xs", "font-semibold", "rounded-full", "flex-shrink-0", 3, "ngClass"], [1, "text-sm", "mb-4", 3, "ngClass"], [1, "mt-4"], [1, "absolute", "-left-[52px]", "top-0", "text-xs", "font-bold", "transition-all", "duration-300", "origin-right", "group-hover:scale-125", "group-hover:font-extrabold", 3, "ngClass"], [1, "text-xs", "font-semibold", "uppercase", "mb-2", 3, "ngClass"], [1, "space-y-2"], [1, "flex", "items-start", "gap-2", "text-sm", 3, "ngClass"], [1, "w-2", "h-2", "rounded-full", "mt-1.5", "flex-shrink-0", 3, "ngClass"], [1, "line-clamp-1"], [1, "space-y-3"], [1, "goal-chip", "flex", "items-center", "justify-between", "gap-2", "px-3", "py-2", "rounded-lg", "cursor-pointer", 3, "ngClass"], [1, "goal-chip", "flex", "items-center", "justify-between", "gap-2", "px-3", "py-2", "rounded-lg", "cursor-pointer", 3, "click", "ngClass"], [1, "text-sm", "font-medium", "line-clamp-1"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "flex-shrink-0"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"]], template: function UnifiedTimelineComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, UnifiedTimelineComponent_Conditional_0_Template, 9, 10, "section", 0);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.phases().length > 0 ? 0 : -1);
@@ -102071,7 +102095,7 @@ class UnifiedTimelineComponent {
                         <div [ngClass]="objectivesLabelClasses()" class="text-xs font-semibold uppercase mb-2">
                           Related Goals ({{ getGoalsForPhase(phase).length }})
                         </div>
-                        <div class="space-y-2">
+                        <div class="space-y-3">
                           @for (goal of getGoalsForPhase(phase); track goal.id) {
                             <div
                               [ngClass]="goalChipClasses()"
@@ -102087,7 +102111,7 @@ class UnifiedTimelineComponent {
                       </div>
                     }
 
-                    <div [ngClass]="phaseIndicatorClasses()" class="absolute -left-[52px] top-0 text-xs font-bold">
+                    <div [ngClass]="phaseIndicatorClasses()" class="absolute -left-[52px] top-0 text-xs font-bold transition-all duration-300 origin-right group-hover:scale-125 group-hover:font-extrabold">
                       Phase {{ idx + 1 }}
                     </div>
                   </div>
@@ -103163,7 +103187,7 @@ class SourceAnalysisTraceabilityComponent {
         }
     }
     static { this.ɵfac = function SourceAnalysisTraceabilityComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SourceAnalysisTraceabilityComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SourceAnalysisTraceabilityComponent, selectors: [["symphiq-source-analysis-traceability"]], inputs: { sourceAnalyses: [1, "sourceAnalyses"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], goal: [1, "goal"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick" }, decls: 1, vars: 1, consts: [[1, "p-5", "rounded-xl", 3, "ngClass"], [1, "text-sm", "font-semibold", "mb-4", "flex", "items-center", "gap-2", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"], [3, "score", "explanation", "viewMode"], [1, "grid", "grid-cols-1", "sm:grid-cols-2", "gap-3"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "ngClass"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "click", "ngClass"], [1, "absolute", "inset-0", "bg-black/10", "rounded-lg", "flex", "items-center", "justify-center"], [1, "absolute", "top-2", "right-2"], [1, "flex", "items-start", "gap-3"], [1, "w-8", "h-8", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "text-xs", "font-medium", "uppercase", "mb-0.5", 3, "ngClass"], [1, "text-sm", "font-medium", "truncate", 3, "ngClass"], [1, "text-xs", "mt-1", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-current", "border-t-transparent", "rounded-full", "animate-spin"], ["fill", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "text-green-500"], ["d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"]], template: function SourceAnalysisTraceabilityComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SourceAnalysisTraceabilityComponent, selectors: [["symphiq-source-analysis-traceability"]], inputs: { sourceAnalyses: [1, "sourceAnalyses"], loadedSourceAnalysisIds: [1, "loadedSourceAnalysisIds"], loadingSourceAnalysisId: [1, "loadingSourceAnalysisId"], viewMode: [1, "viewMode"], goal: [1, "goal"] }, outputs: { sourceAnalysisClick: "sourceAnalysisClick" }, decls: 1, vars: 1, consts: [[1, "p-5", "rounded-xl", "flex", "flex-col", "gap-4", 3, "ngClass"], [1, "text-sm", "font-semibold", "flex", "items-center", "gap-2", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"], [3, "score", "explanation", "viewMode"], [1, "grid", "grid-cols-1", "sm:grid-cols-2", "gap-3"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "ngClass"], ["type", "button", 1, "p-4", "rounded-lg", "text-left", "transition-all", "hover:scale-[1.02]", "relative", 3, "click", "ngClass"], [1, "absolute", "inset-0", "bg-black/10", "rounded-lg", "flex", "items-center", "justify-center"], [1, "absolute", "top-2", "right-2"], [1, "flex", "items-start", "gap-3"], [1, "w-8", "h-8", "rounded-lg", "flex", "items-center", "justify-center", "flex-shrink-0", 3, "ngClass"], [1, "flex-1", "min-w-0"], [1, "text-xs", "font-medium", "uppercase", "mb-0.5", 3, "ngClass"], [1, "text-sm", "font-medium", "truncate", 3, "ngClass"], [1, "text-xs", "mt-1", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-current", "border-t-transparent", "rounded-full", "animate-spin"], ["fill", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", "text-green-500"], ["d", "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"]], template: function SourceAnalysisTraceabilityComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, SourceAnalysisTraceabilityComponent_Conditional_0_Template, 9, 6, "div", 0);
         } if (rf & 2) {
             let tmp_0_0;
@@ -103179,8 +103203,8 @@ class SourceAnalysisTraceabilityComponent {
                 imports: [CommonModule, SynthesisConfidenceSectionComponent],
                 template: `
     @if ((sourceAnalyses()?.length ?? 0) > 0) {
-      <div [ngClass]="sectionCardClasses()" class="p-5 rounded-xl">
-        <h4 [ngClass]="sectionTitleClasses()" class="text-sm font-semibold mb-4 flex items-center gap-2">
+      <div [ngClass]="sectionCardClasses()" class="p-5 rounded-xl flex flex-col gap-4">
+        <h4 [ngClass]="sectionTitleClasses()" class="text-sm font-semibold flex items-center gap-2">
           <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"/>
           </svg>
@@ -103707,7 +103731,7 @@ function UnifiedDashboardModalComponent_Conditional_0_Conditional_23_Template(rf
     i0.ɵɵelement(0, "symphiq-strategy-recommendations-modal-content", 23);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("strategy", ctx_r1.recommendationsData().strategy)("viewMode", ctx_r1.viewMode());
+    i0.ɵɵproperty("strategy", ctx_r1.recommendationsData().strategy)("viewMode", ctx_r1.viewMode())("allMetrics", ctx_r1.allMetricsFromStack())("allCharts", ctx_r1.allChartsFromStack())("allInsights", ctx_r1.allInsightsFromStack())("goalTitle", ctx_r1.recommendationsData().goalTitle)("objectiveTitle", ctx_r1.recommendationsData().objectiveTitle);
 } }
 function UnifiedDashboardModalComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -103736,7 +103760,7 @@ function UnifiedDashboardModalComponent_Conditional_0_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(20, UnifiedDashboardModalComponent_Conditional_0_Conditional_20_Template, 1, 4, "symphiq-goal-objectives-modal-content", 20);
     i0.ɵɵconditionalCreate(21, UnifiedDashboardModalComponent_Conditional_0_Conditional_21_Template, 1, 3, "symphiq-unified-goal-related-metrics-modal-content", 21);
     i0.ɵɵconditionalCreate(22, UnifiedDashboardModalComponent_Conditional_0_Conditional_22_Template, 1, 2, "symphiq-objective-strategies-modal-content", 22);
-    i0.ɵɵconditionalCreate(23, UnifiedDashboardModalComponent_Conditional_0_Conditional_23_Template, 1, 2, "symphiq-strategy-recommendations-modal-content", 23);
+    i0.ɵɵconditionalCreate(23, UnifiedDashboardModalComponent_Conditional_0_Conditional_23_Template, 1, 7, "symphiq-strategy-recommendations-modal-content", 23);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     let tmp_15_0;
@@ -103838,6 +103862,66 @@ class UnifiedDashboardModalComponent {
         this.navigationStack = computed(() => {
             return this.currentModalState()?.navigationStack || [];
         }, ...(ngDevMode ? [{ debugName: "navigationStack" }] : []));
+        this.allMetricsFromStack = computed(() => {
+            const goalData = this.unifiedGoalData();
+            if (goalData?.allMetrics)
+                return goalData.allMetrics;
+            const objData = this.objectivesData();
+            if (objData?.allMetrics)
+                return objData.allMetrics;
+            const relatedData = this.relatedMetricsData();
+            if (relatedData?.contributingMetrics)
+                return relatedData.contributingMetrics;
+            const stack = this.navigationStack();
+            for (let i = stack.length - 1; i >= 0; i--) {
+                const state = stack[i];
+                if (state.type === 'unified-goal-detail' || state.type === 'unified-goal-objectives') {
+                    const data = state.data;
+                    if (data?.allMetrics)
+                        return data.allMetrics;
+                }
+            }
+            return [];
+        }, ...(ngDevMode ? [{ debugName: "allMetricsFromStack" }] : []));
+        this.allChartsFromStack = computed(() => {
+            const goalData = this.unifiedGoalData();
+            if (goalData?.allCharts)
+                return goalData.allCharts;
+            const objData = this.objectivesData();
+            if (objData?.allCharts)
+                return objData.allCharts;
+            const relatedData = this.relatedMetricsData();
+            if (relatedData?.allCharts)
+                return relatedData.allCharts;
+            const stack = this.navigationStack();
+            for (let i = stack.length - 1; i >= 0; i--) {
+                const state = stack[i];
+                if (state.type === 'unified-goal-detail' || state.type === 'unified-goal-objectives') {
+                    const data = state.data;
+                    if (data?.allCharts)
+                        return data.allCharts;
+                }
+            }
+            return [];
+        }, ...(ngDevMode ? [{ debugName: "allChartsFromStack" }] : []));
+        this.allInsightsFromStack = computed(() => {
+            const goalData = this.unifiedGoalData();
+            if (goalData?.allInsights)
+                return goalData.allInsights;
+            const objData = this.objectivesData();
+            if (objData?.allInsights)
+                return objData.allInsights;
+            const stack = this.navigationStack();
+            for (let i = stack.length - 1; i >= 0; i--) {
+                const state = stack[i];
+                if (state.type === 'unified-goal-detail' || state.type === 'unified-goal-objectives') {
+                    const data = state.data;
+                    if (data?.allInsights)
+                        return data.allInsights;
+                }
+            }
+            return [];
+        }, ...(ngDevMode ? [{ debugName: "allInsightsFromStack" }] : []));
         this.loadedSourceAnalysisIdsAsNumbers = computed(() => {
             const data = this.unifiedGoalData();
             if (!data?.loadedSourceAnalysisIds)
@@ -103888,7 +103972,26 @@ class UnifiedDashboardModalComponent {
                 clearTimeout(this.cleanupTimeoutId);
                 this.cleanupTimeoutId = null;
             }
-            if (state.type !== 'unified-goal-detail' && state.type !== 'unified-goal-objectives' && state.type !== 'unified-goal-related-metrics' && state.type !== 'objective-strategies' && state.type !== 'strategy-recommendations' && state.type !== null) {
+            const unifiedModalTypes = ['unified-goal-detail', 'unified-goal-objectives', 'unified-goal-related-metrics', 'objective-strategies', 'strategy-recommendations'];
+            const isUnifiedType = unifiedModalTypes.includes(state.type || '');
+            const stackableTypes = ['metrics-list', 'metric'];
+            const isStackableType = stackableTypes.includes(state.type || '');
+            if (!isUnifiedType && state.type !== null && !isStackableType) {
+                if (this.isOpen()) {
+                    console.log('[UnifiedDashboardModal] Closing - transitioning to non-unified type:', state.type);
+                    this.isOpen.set(false);
+                    this.cleanupTimeoutId = setTimeout(() => {
+                        this.modalType.set(null);
+                        this.modalData.set(null);
+                        this.modalTitle.set('');
+                        this.previousState.set(null);
+                        this.currentModalState.set(null);
+                        this.cleanupTimeoutId = null;
+                    }, 300);
+                }
+                return;
+            }
+            if (isStackableType) {
                 return;
             }
             this.previousState.set(state.previousState ?? null);
@@ -103956,6 +104059,14 @@ class UnifiedDashboardModalComponent {
             return;
         const contributingMetricNames = data.goal.contributingMetrics || [];
         const contributingMetrics = data.allMetrics.filter(m => m.metric && contributingMetricNames.includes(m.metric));
+        console.log('[UnifiedDashboardModal] onContributingMetricsClick:', {
+            goalTitle: data.goal.title,
+            contributingMetricNames,
+            contributingMetricsCount: contributingMetrics.length,
+            contributingMetricsPerformanceItemIds: contributingMetrics.map(m => m.performanceItemId),
+            allChartsCount: data.allCharts?.length || 0,
+            allChartsPerformanceItemIds: data.allCharts?.map(c => c.performanceItemId)
+        });
         this.modalService.navigateToUnifiedGoalRelatedMetrics(data.goal, contributingMetrics, data.allCharts, this.viewMode());
     }
     onShowObjectives() {
@@ -103968,6 +104079,14 @@ class UnifiedDashboardModalComponent {
         const data = this.relatedMetricsData();
         const allCharts = data?.allCharts || [];
         const metricCharts = allCharts.filter(chart => chart.performanceItemId === metric.performanceItemId);
+        console.log('[UnifiedDashboardModal] onRelatedMetricClick:', {
+            metricName: metric.metric,
+            metricPerformanceItemId: metric.performanceItemId,
+            allChartsCount: allCharts.length,
+            allChartsPerformanceItemIds: allCharts.map(c => c.performanceItemId),
+            filteredChartsCount: metricCharts.length,
+            currentModalState: this.currentModalState()?.type
+        });
         this.modalService.openMetricModal(metric, metricCharts, this.currentModalState() ?? undefined);
     }
     navigateToBreadcrumb(index) {
@@ -104021,7 +104140,7 @@ class UnifiedDashboardModalComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.modalContent = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.modalWrapper = _t.first);
-        } }, inputs: { viewMode: [1, "viewMode"] }, decls: 1, vars: 1, consts: [["modalWrapper", ""], ["modalContent", ""], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto", 3, "z-index", "visibility"], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto"], ["aria-hidden", "true", 1, "fixed", "inset-0", "backdrop-blur-sm", 3, "click", "ngClass"], [1, "relative", "w-full", "max-w-4xl", "rounded-2xl", "text-left", "overflow-hidden", "shadow-xl", "border", "backdrop-blur-xl", 3, "click", "ngClass"], [1, "px-6", "py-5", "border-b", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex-1", "min-w-0"], [1, "flex", "items-center", "gap-1.5", "mb-2", "text-xs"], [1, "flex", "items-center", "gap-2", "mb-2"], [1, "text-xl", "font-bold", "leading-tight", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "ml-4", "flex-shrink-0"], [3, "priority", "viewMode"], [3, "timeframe", "viewMode"], ["type", "button", 1, "transition-all", "rounded-lg", "p-1", "hover:scale-110", "active:scale-90", "cursor-pointer", "relative", "ml-4", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M6 18L18 6M6 6l12 12"], [1, "px-6", "py-8", "max-h-[80vh]", "overflow-y-auto", "backdrop-blur-sm", 3, "ngClass"], [3, "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "objectives", "goalTitle", "viewMode"], [3, "goal", "contributingMetrics", "viewMode"], [3, "objective", "viewMode"], [3, "strategy", "viewMode"], [1, "font-medium", 3, "ngClass"], ["type", "button", 1, "hover:underline", "cursor-pointer", "transition-colors", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3", "flex-shrink-0", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "sourceAnalysisClick", "metricClick", "contributingMetricsClick", "showObjectives", "close", "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "metricClick", "goal", "contributingMetrics", "viewMode"]], template: function UnifiedDashboardModalComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { viewMode: [1, "viewMode"] }, decls: 1, vars: 1, consts: [["modalWrapper", ""], ["modalContent", ""], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto", 3, "z-index", "visibility"], [1, "fixed", "inset-0", "flex", "items-center", "justify-center", "p-4", "overflow-y-auto"], ["aria-hidden", "true", 1, "fixed", "inset-0", "backdrop-blur-sm", 3, "click", "ngClass"], [1, "relative", "w-full", "max-w-4xl", "rounded-2xl", "text-left", "overflow-hidden", "shadow-xl", "border", "backdrop-blur-xl", 3, "click", "ngClass"], [1, "px-6", "py-5", "border-b", "backdrop-blur-sm", 3, "ngClass"], [1, "flex", "items-start", "justify-between"], [1, "flex-1", "min-w-0"], [1, "flex", "items-center", "gap-1.5", "mb-2", "text-xs"], [1, "flex", "items-center", "gap-2", "mb-2"], [1, "text-xl", "font-bold", "leading-tight", 3, "ngClass"], [1, "flex", "items-center", "gap-2", "ml-4", "flex-shrink-0"], [3, "priority", "viewMode"], [3, "timeframe", "viewMode"], ["type", "button", 1, "transition-all", "rounded-lg", "p-1", "hover:scale-110", "active:scale-90", "cursor-pointer", "relative", "ml-4", "flex-shrink-0", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M6 18L18 6M6 6l12 12"], [1, "px-6", "py-8", "max-h-[80vh]", "overflow-y-auto", "backdrop-blur-sm", 3, "ngClass"], [3, "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "objectives", "goalTitle", "viewMode"], [3, "goal", "contributingMetrics", "viewMode"], [3, "objective", "viewMode"], [3, "strategy", "viewMode", "allMetrics", "allCharts", "allInsights", "goalTitle", "objectiveTitle"], [1, "font-medium", 3, "ngClass"], ["type", "button", 1, "hover:underline", "cursor-pointer", "transition-colors", 3, "click", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3", "flex-shrink-0", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "text-xs", "font-semibold", "uppercase", "tracking-wider", 3, "ngClass"], [3, "sourceAnalysisClick", "metricClick", "contributingMetricsClick", "showObjectives", "close", "goal", "allMetrics", "allCharts", "loadedSourceAnalysisIds", "loadingSourceAnalysisId", "viewMode", "currentModalState"], [3, "metricClick", "goal", "contributingMetrics", "viewMode"]], template: function UnifiedDashboardModalComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, UnifiedDashboardModalComponent_Conditional_0_Template, 24, 27, "div", 2);
         } if (rf & 2) {
             i0.ɵɵconditional(ctx.isOpen() ? 0 : -1);
@@ -104198,6 +104317,11 @@ class UnifiedDashboardModalComponent {
               <symphiq-strategy-recommendations-modal-content
                 [strategy]="recommendationsData()!.strategy"
                 [viewMode]="viewMode()"
+                [allMetrics]="allMetricsFromStack()"
+                [allCharts]="allChartsFromStack()"
+                [allInsights]="allInsightsFromStack()"
+                [goalTitle]="recommendationsData()!.goalTitle"
+                [objectiveTitle]="recommendationsData()!.objectiveTitle"
               />
             }
           </div>
@@ -104213,7 +104337,7 @@ class UnifiedDashboardModalComponent {
             type: ViewChild,
             args: ['modalWrapper']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedDashboardModalComponent, { className: "UnifiedDashboardModalComponent", filePath: "lib/components/profile-analysis-unified-dashboard/modals/unified-dashboard-modal.component.ts", lineNumber: 195 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(UnifiedDashboardModalComponent, { className: "UnifiedDashboardModalComponent", filePath: "lib/components/profile-analysis-unified-dashboard/modals/unified-dashboard-modal.component.ts", lineNumber: 202 }); })();
 
 const _c0$7 = () => [];
 const _c1$3 = a0 => ({ name: "flag", source: a0 });