@eric-emg/symphiq-components 1.2.95 → 1.2.96

package/index.d.ts

@@ -1,11 +1,13 @@
 import * as _jebgem_model from '@jebgem/model';
-import { InsightBlockInterface, PerformanceMetricInterface, AiChartInterface, ViewModeEnum, BreakdownMetricInterface, UserInterface, FunnelAnalysisInterface, OverallAssessmentInterface } from '@jebgem/model';
+import { InsightBlockInterface, PerformanceMetricInterface, AiChartInterface, ProfileItemInterface, ViewModeEnum, ProfileAnalysisRecommendationActionStepInterface, MetricStatusEnum, TrendDirectionEnum, CompetitiveScoreEnum, ProfileSectionInterface, ProfileSubsectionInterface, ProfileInterface, BreakdownMetricInterface, UserInterface, FunnelAnalysisInterface, OverallAssessmentInterface, ProfileAnalysisRecommendationInterface, ProfileItemTypeEnum, IconObjectInterface as IconObjectInterface$1, NapkinVisualInterface, HierarchyDataInterface, ChartTypeEnum, IconSourceEnum } from '@jebgem/model';
 export * from '@jebgem/model';
 import * as _angular_core from '@angular/core';
-import { AfterViewInit, ElementRef, WritableSignal, OnInit, OnDestroy } from '@angular/core';
+import { AfterViewInit, ElementRef, WritableSignal, OnInit, OnDestroy, OnChanges, SimpleChanges, Renderer2, EventEmitter } from '@angular/core';
 import * as rxjs from 'rxjs';
-import * as _jebgem_model_lib_funnel_analysis_ai_chart_interface from '@jebgem/model/lib/funnel-analysis/ai-chart.interface';
-import { SafeHtml } from '@angular/platform-browser';
+import { Observable } from 'rxjs';
+import { HttpClient } from '@angular/common/http';
+import * as _angular_platform_browser from '@angular/platform-browser';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 
 interface FunnelMetricOrder {
     metric: string;
@@ -32,8 +34,13 @@ declare class FunnelOrderService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<FunnelOrderService>;
 }
 
+interface VisualizationData {
+    type: 'horizontal-bar' | 'circular-progress' | 'napkin-visual' | 'custom';
+    title: string;
+    data: unknown;
+}
 interface ModalState {
-    type: 'insight' | 'metric' | 'chart' | 'insights-list' | 'metrics-list' | 'recommendations-list' | 'competitive-analysis' | null;
+    type: 'insight' | 'metric' | 'chart' | 'insights-list' | 'metrics-list' | 'charts-list' | 'recommendations-list' | 'competitive-analysis' | 'competitive-gap' | 'visualization' | 'recommendation-action-steps' | null;
     data: InsightBlockInterface | InsightBlockInterface[] | PerformanceMetricInterface | PerformanceMetricInterface[] | AiChartInterface | {
         metrics: PerformanceMetricInterface[];
         insightContext?: {
@@ -42,6 +49,14 @@ interface ModalState {
             businessContext: string;
             priority: number;
         };
+    } | {
+        charts: AiChartInterface[];
+        insightContext?: {
+            title: string;
+            description: string;
+            businessContext: string;
+            priority: number;
+        };
     } | {
         recommendations: string[];
         insightContext: {
@@ -58,7 +73,14 @@ interface ModalState {
             competitiveAnalysis: string;
             priority: number;
         };
-    } | null;
+    } | {
+        item: ProfileItemInterface;
+        viewMode: ViewModeEnum;
+    } | {
+        title?: string;
+        actionSteps: ProfileAnalysisRecommendationActionStepInterface[];
+        viewMode: ViewModeEnum;
+    } | VisualizationData | null;
     charts: AiChartInterface[];
     previousState?: ModalState | null;
     expandedSection?: string;
@@ -76,6 +98,12 @@ declare class ModalService {
         businessContext: string;
         priority: number;
     }): void;
+    openChartsListModal(charts: AiChartInterface[], insightContext?: {
+        title: string;
+        description: string;
+        businessContext: string;
+        priority: number;
+    }): void;
     openRecommendationsListModal(recommendations: string[], insightContext: {
         title: string;
         description: string;
@@ -89,6 +117,9 @@ declare class ModalService {
         competitiveAnalysis: string;
         priority: number;
     }): void;
+    openVisualizationModal(visualization: VisualizationData, previousState?: ModalState): void;
+    openCompetitiveGapModal(item: ProfileItemInterface, viewMode: ViewModeEnum, previousState?: ModalState): void;
+    openRecommendationActionStepsModal(title: string | undefined, actionSteps: ProfileAnalysisRecommendationActionStepInterface[], viewMode: ViewModeEnum, previousState?: ModalState): void;
     goBack(previousState: ModalState): void;
     closeModal(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalService, never>;
@@ -153,7 +184,7 @@ interface MetricValueTooltipContent {
     };
 }
 interface StatusBadgeTooltipContent {
-    status: string;
+    status: MetricStatusEnum;
     pacingPercentage?: number;
     currentValue?: number;
     projectedValue?: number;
@@ -171,7 +202,7 @@ interface TrendIndicatorTooltipContent {
     currentValue: number;
     priorValue: number;
     trendPercent: number;
-    trendDirection: 'UP' | 'DOWN' | 'FLAT';
+    trendDirection: TrendDirectionEnum;
     isInverseMetric?: boolean;
     unit?: string;
     status?: string;
@@ -204,7 +235,7 @@ interface BreakdownRowTooltipContent {
 interface CompetitiveBenchmarkTooltipContent {
     industry: string;
     metricBenchmark: string;
-    competitiveScore: 'LEADING' | 'COMPETITIVE' | 'LAGGING';
+    competitiveScore: CompetitiveScoreEnum;
     description: string;
     keyOpportunities: string;
     metricName?: string;
@@ -224,7 +255,7 @@ interface NarrativeTooltipContent {
     narrative: string;
 }
 interface CompetitiveStatusTooltipContent {
-    status: 'LEADING' | 'COMPETITIVE' | 'LAGGING';
+    status: CompetitiveScoreEnum;
     statusDescription: string;
     metrics: Array<{
         name: string;
@@ -234,7 +265,7 @@ interface CompetitiveStatusTooltipContent {
             max: number;
         };
         unit: string;
-        status?: 'LEADING' | 'COMPETITIVE' | 'LAGGING';
+        status?: CompetitiveScoreEnum;
     }>;
 }
 interface FunnelStageCompetitiveTooltipContent {
@@ -272,9 +303,9 @@ interface FunnelStageCompetitiveTooltipContent {
 declare class TooltipDataService {
     private formatCache;
     private metricLookupCache;
-    extractMetricTooltipData(metric: PerformanceMetricInterface, chart?: any): MetricValueTooltipContent;
+    extractMetricTooltipData(metric: PerformanceMetricInterface, chart?: AiChartInterface): MetricValueTooltipContent;
     extractStatusTooltipData(metric: PerformanceMetricInterface): StatusBadgeTooltipContent;
-    extractTrendTooltipData(metric: PerformanceMetricInterface, chart?: any): TrendIndicatorTooltipContent;
+    extractTrendTooltipData(metric: PerformanceMetricInterface, chart?: AiChartInterface): TrendIndicatorTooltipContent;
     extractPriorityTooltipData(insight: InsightBlockInterface): PriorityBadgeTooltipContent;
     extractBreakdownRowTooltipData(metric: PerformanceMetricInterface): BreakdownRowTooltipContent;
     findMetricByName(name: string, metrics: PerformanceMetricInterface[]): PerformanceMetricInterface | undefined;
@@ -456,27 +487,154 @@ declare class MetricFormatterService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<MetricFormatterService>;
 }
 
+interface HeaderScrollConfig {
+    collapseThreshold?: number;
+    expandThreshold?: number;
+    stateChangeCooldown?: number;
+    debounceDelay?: number;
+}
+declare class HeaderScrollService {
+    private readonly DEFAULT_COLLAPSE_THRESHOLD;
+    private readonly DEFAULT_EXPAND_THRESHOLD;
+    private readonly DEFAULT_STATE_CHANGE_COOLDOWN;
+    private readonly DEFAULT_DEBOUNCE_DELAY;
+    isScrolled: _angular_core.WritableSignal<boolean>;
+    scrollProgress: _angular_core.WritableSignal<number>;
+    private scrollTimeout;
+    private lastStateChangeTime;
+    private isProgrammaticScroll;
+    private config;
+    configure(config: HeaderScrollConfig): void;
+    handleScroll(embedded?: boolean): void;
+    resetHeaderState(): void;
+    resetState(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HeaderScrollService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<HeaderScrollService>;
+}
+
+declare class IconService {
+    private http;
+    private sanitizer;
+    private cache;
+    constructor(http: HttpClient, sanitizer: DomSanitizer);
+    getIcon(name: string | undefined, size?: string): Observable<SafeHtml>;
+    private processSvg;
+    private getDefaultIcon;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<IconService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<IconService>;
+}
+
+type ShadowLevel = 'none' | 'sm' | 'md' | 'lg' | 'xl';
+interface ScrollDepthInfo {
+    scrollTop: number;
+    scrollHeight: number;
+    clientHeight: number;
+    scrollPercentage: number;
+    shadowLevel: ShadowLevel;
+}
+declare class ScrollDepthService {
+    private scrollDepthSubjects;
+    trackScrollDepth(element: HTMLElement | Window, id: string): Observable<ScrollDepthInfo>;
+    private calculateScrollInfo;
+    private calculateShadowLevel;
+    cleanup(id: string): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScrollDepthService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ScrollDepthService>;
+}
+
+interface NavigationState {
+    sourceElementId: string | null;
+    sourceScrollPosition: number;
+    sourceViewportCoords: {
+        x: number;
+        y: number;
+    } | null;
+    targetElementId: string | null;
+    isBackButtonVisible: boolean;
+    targetScrollPosition: number;
+}
+declare class NavigationStateService {
+    private navigationState;
+    getNavigationState(): _angular_core.Signal<NavigationState>;
+    setNavigationState(sourceElementId: string, sourceScrollPosition: number, sourceViewportCoords: {
+        x: number;
+        y: number;
+    }, targetElementId: string): void;
+    showBackButton(): void;
+    hideBackButton(): void;
+    clearNavigationState(): void;
+    hasNavigationState(): boolean;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NavigationStateService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<NavigationStateService>;
+}
+
+interface BusinessSearchResult {
+    id: string;
+    type: 'section' | 'subsection' | 'item';
+    itemType?: string;
+    title: string;
+    description: string;
+    score: number;
+    sectionId?: string;
+    sectionTitle?: string;
+    subsectionId?: string;
+    subsectionTitle?: string;
+    data: ProfileSectionInterface | ProfileSubsectionInterface | ProfileItemInterface;
+    matchedFields: string[];
+}
+declare class BusinessProfileSearchService {
+    private searchQuery;
+    private allSections;
+    private allSubsections;
+    private allItems;
+    isSearchOpen: _angular_core.WritableSignal<boolean>;
+    highlightedResultId: _angular_core.WritableSignal<string | null>;
+    activeSearchResult: _angular_core.WritableSignal<BusinessSearchResult | null>;
+    searchResults: _angular_core.Signal<BusinessSearchResult[]>;
+    hasResults: _angular_core.Signal<boolean>;
+    setSearchQuery(query: string): void;
+    getSearchQuery(): string;
+    setProfile(profile: ProfileInterface): void;
+    openSearch(): void;
+    closeSearch(): void;
+    highlightResult(id: string): void;
+    clearHighlight(): void;
+    setActiveResult(result: BusinessSearchResult | null): void;
+    clearActiveResult(): void;
+    private buildSectionDescription;
+    private buildSubsectionDescription;
+    private buildItemDescription;
+    private scoreItem;
+    private fuzzyMatch;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BusinessProfileSearchService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<BusinessProfileSearchService>;
+}
+
 declare class ModalComponent {
     isLightMode: _angular_core.InputSignal<boolean>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
     private metricNameCache;
     private allMetricsSignal;
     private modalStateSignal;
+    Math: Math;
+    private animatedMetricValues;
+    private animatedTrendValues;
+    private animationFrames;
     isOpen: _angular_core.Signal<boolean>;
-    modalType: _angular_core.Signal<"metric" | "insight" | "chart" | "insights-list" | "metrics-list" | "recommendations-list" | "competitive-analysis" | null>;
+    modalType: _angular_core.Signal<"insight" | "metric" | "chart" | "insights-list" | "metrics-list" | "charts-list" | "recommendations-list" | "competitive-analysis" | null>;
     charts: _angular_core.Signal<AiChartInterface[]>;
     modalKey: _angular_core.Signal<number>;
     insightData: _angular_core.Signal<InsightBlockInterface | null>;
     metricData: _angular_core.Signal<PerformanceMetricInterface | null>;
     chartData: _angular_core.Signal<AiChartInterface | null>;
     chartDescription: _angular_core.Signal<string>;
-    chartType: _angular_core.Signal<_jebgem_model_lib_funnel_analysis_ai_chart_interface.ChartTypeEnum | null>;
+    chartType: _angular_core.Signal<_jebgem_model.ChartTypeEnum | null>;
     chartLineData: _angular_core.Signal<AiChartInterface | null>;
     chartBarData: _angular_core.Signal<AiChartInterface | null>;
     chartPieData: _angular_core.Signal<AiChartInterface | null>;
     chartAreaData: _angular_core.Signal<AiChartInterface | null>;
     insightsListData: _angular_core.Signal<InsightBlockInterface[] | null>;
-    metricsListData: _angular_core.Signal<PerformanceMetricInterface | AiChartInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
+    metricsListData: _angular_core.Signal<AiChartInterface | PerformanceMetricInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
     metricsListMetrics: _angular_core.Signal<PerformanceMetricInterface[]>;
     metricsListInsightContext: _angular_core.Signal<{
         title: string;
@@ -484,7 +642,15 @@ declare class ModalComponent {
         businessContext: string;
         priority: number;
     } | null>;
-    recommendationsListData: _angular_core.Signal<PerformanceMetricInterface | AiChartInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
+    chartsListData: _angular_core.Signal<AiChartInterface | PerformanceMetricInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
+    chartsListCharts: _angular_core.Signal<AiChartInterface[]>;
+    chartsListInsightContext: _angular_core.Signal<{
+        title: string;
+        description: string;
+        businessContext: string;
+        priority: number;
+    } | null>;
+    recommendationsListData: _angular_core.Signal<AiChartInterface | PerformanceMetricInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
     recommendationsListRecommendations: _angular_core.Signal<string[]>;
     recommendationsListInsightContext: _angular_core.Signal<{
         title: string;
@@ -492,7 +658,7 @@ declare class ModalComponent {
         businessContext: string;
         priority: number;
     } | null>;
-    competitiveAnalysisData: _angular_core.Signal<PerformanceMetricInterface | AiChartInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
+    competitiveAnalysisData: _angular_core.Signal<AiChartInterface | PerformanceMetricInterface | InsightBlockInterface | (PerformanceMetricInterface | InsightBlockInterface)[] | null>;
     competitiveAnalysisContext: _angular_core.Signal<{
         title: string;
         description: string;
@@ -507,12 +673,12 @@ declare class ModalComponent {
     allCharts: _angular_core.Signal<AiChartInterface[]>;
     hasPreviousState: _angular_core.Signal<boolean>;
     currentModalState: _angular_core.Signal<{
-        type: "insight" | "metric" | "chart" | "insights-list" | "metrics-list" | "recommendations-list" | "competitive-analysis" | null;
+        type: "insight" | "metric" | "chart" | "insights-list" | "metrics-list" | "charts-list" | "recommendations-list" | "competitive-analysis" | null;
         data: InsightBlockInterface | PerformanceMetricInterface | AiChartInterface | (InsightBlockInterface | PerformanceMetricInterface)[] | null;
         charts: AiChartInterface[];
         openedAt: number;
         previousState: {
-            type: "insight" | "metric" | "chart" | "insights-list" | "metrics-list" | "recommendations-list" | "competitive-analysis";
+            type: "insight" | "metric" | "chart" | "insights-list" | "metrics-list" | "charts-list" | "recommendations-list" | "competitive-analysis";
             data: InsightBlockInterface | PerformanceMetricInterface | AiChartInterface | (InsightBlockInterface | PerformanceMetricInterface)[];
             charts: AiChartInterface[];
             previousState: null;
@@ -530,8 +696,17 @@ declare class ModalComponent {
     closeModal(): void;
     openInsightModal(insight: InsightBlockInterface): void;
     openMetricModalFromList(metric: PerformanceMetricInterface): void;
+    openChartModalFromList(chart: AiChartInterface): void;
     goBack(): void;
     formatMetricName(name: string): string;
+    formatMetricValue(metric: PerformanceMetricInterface): string;
+    getMetricTrendClass(metric: PerformanceMetricInterface): string;
+    animateMetricsList(metrics: PerformanceMetricInterface[]): void;
+    animateMetricValue(index: number, targetValue: number): void;
+    animateMetricTrend(index: number, targetTrend: number): void;
+    getAnimatedMetricValue(index: number): number;
+    getAnimatedTrendValue(index: number): number;
+    formatAnimatedMetricValue(metric: PerformanceMetricInterface, animatedValue: number): string;
     setMetricsAndInsights(metrics: PerformanceMetricInterface[], insights: InsightBlockInterface[], allCharts?: AiChartInterface[]): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent, "symphiq-funnel-analysis-modal", never, { "isLightMode": { "alias": "isLightMode"; "required": false; "isSignal": true; }; "viewMode": { "alias": "viewMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -590,21 +765,6 @@ declare class SearchService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<SearchService>;
 }
 
-interface GestureDetail {
-    type: string;
-    startX: number;
-    startY: number;
-    startTime: number;
-    currentX: number;
-    currentY: number;
-    velocityX: number;
-    velocityY: number;
-    deltaX: number;
-    deltaY: number;
-    currentTime: number;
-    event: UIEvent;
-    data?: any;
-}
 interface ScrollBaseDetail {
     isScrolling: boolean;
 }
@@ -626,6 +786,7 @@ declare class SymphiqFunnelAnalysisDashboardComponent implements AfterViewInit {
     private tooltipService;
     modalComponent?: ModalComponent;
     dashboardContainer?: ElementRef<HTMLElement>;
+    protected readonly ViewModeEnum: typeof ViewModeEnum;
     requestedByUser: _angular_core.InputSignal<UserInterface | undefined>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
     funnelAnalysis: _angular_core.InputSignal<FunnelAnalysisInterface | undefined>;
@@ -728,6 +889,7 @@ declare class SymphiqFunnelAnalysisDashboardComponent implements AfterViewInit {
     showPerformanceMetrics: _angular_core.Signal<boolean>;
     showPerformanceBreakdowns: _angular_core.Signal<boolean>;
     showCompetitiveIntelligence: _angular_core.Signal<boolean>;
+    tocSections: _angular_core.Signal<ProfileSectionInterface[]>;
     private dateFormatCache;
     constructor(funnelOrderService: FunnelOrderService, viewModeService: ViewModeService, searchService: SearchService, tooltipService: TooltipService);
     ngAfterViewInit(): void;
@@ -841,7 +1003,7 @@ declare class MetricCardComponent {
     competitiveScoreBadgeLightClass: _angular_core.Signal<string>;
     competitiveScoreBadgeDarkClass: _angular_core.Signal<string>;
     competitiveScoreBadgeClass: _angular_core.Signal<string>;
-    competitiveScoreTextClass: _angular_core.Signal<"text-emerald-600" | "text-blue-700" | "text-blue-400" | "" | "text-orange-600">;
+    competitiveScoreTextClass: _angular_core.Signal<"" | "text-blue-400" | "text-emerald-600" | "text-blue-700" | "text-orange-600">;
     competitiveComparisonDefaultClass: _angular_core.Signal<"text-slate-700" | "text-slate-300">;
     competitiveComparisonClass: _angular_core.Signal<"text-slate-700" | "text-slate-300" | "text-emerald-600 font-semibold" | "text-orange-600 font-semibold">;
     getCompetitiveScoreIcon(): string;
@@ -886,6 +1048,9 @@ declare class InsightCardComponent {
     descriptionClass: _angular_core.Signal<string>;
     metricButtonClass: _angular_core.Signal<string>;
     recommendationItemClass: _angular_core.Signal<string>;
+    recommendationsContainerLightClass: _angular_core.Signal<string>;
+    recommendationsContainerDarkClass: _angular_core.Signal<string>;
+    recommendationsContainerClass: _angular_core.Signal<string>;
     priorityBadgeLightClass: _angular_core.Signal<"w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-red-100/70 text-red-700 border-red-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-amber-100/70 text-amber-700 border-amber-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-blue-100/70 text-blue-700 border-blue-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-slate-100/70 text-slate-700 border-slate-400/60">;
     priorityBadgeDarkClass: _angular_core.Signal<"w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-red-500/20 text-red-400 border-red-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-amber-500/20 text-amber-400 border-amber-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-blue-500/20 text-blue-400 border-blue-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-slate-500/20 text-slate-400 border-slate-500/50">;
     priorityBadgeClass: _angular_core.Signal<"w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-red-100/70 text-red-700 border-red-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-amber-100/70 text-amber-700 border-amber-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-blue-100/70 text-blue-700 border-blue-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-slate-100/70 text-slate-700 border-slate-400/60" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-red-500/20 text-red-400 border-red-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-amber-500/20 text-amber-400 border-amber-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-blue-500/20 text-blue-400 border-blue-500/50" | "w-8 h-8 flex items-center justify-center rounded-full text-xs font-bold border-2 backdrop-blur-md bg-slate-500/20 text-slate-400 border-slate-500/50">;
@@ -904,7 +1069,7 @@ declare class InsightCardComponent {
     formatMetricName(name: string): string;
     openMetricModal(metricName: string): void;
     openMetricsModal(): void;
-    openRecommendationsModal(): void;
+    openChartsModal(): void;
     openCompetitiveAnalysisModal(): void;
     openChartModal(chart: AiChartInterface): void;
     handleHeaderClick(event: Event): void;
@@ -1342,11 +1507,9 @@ declare class SymphiqFunnelAnalysisPreviewComponent {
     insightsCount: _angular_core.Signal<any>;
     revenueMetric: _angular_core.Signal<PerformanceMetricInterface | undefined>;
     topMetrics: _angular_core.Signal<PerformanceMetricInterface[]>;
-    statusLabel: _angular_core.Signal<any>;
-    statusIcon: _angular_core.Signal<"↑" | "→" | "⚠" | "•">;
     formattedRevenueValue: _angular_core.Signal<string>;
     formattedRevenueTrend: _angular_core.Signal<string>;
-    revenueStatusIcon: _angular_core.Signal<"↑" | "→" | "⚠" | "•">;
+    revenueStatusIcon: _angular_core.Signal<"⚠" | "↑" | "→" | "•">;
     hasCompetitiveData: _angular_core.Signal<boolean>;
     hasOverallCompetitiveBenchmark: _angular_core.Signal<boolean>;
     overallCompetitiveDescription: _angular_core.Signal<any>;
@@ -1387,7 +1550,7 @@ declare class SymphiqFunnelAnalysisPreviewComponent {
     competitiveTooltip: _angular_core.Signal<{
         industry: any;
         metricBenchmark: string;
-        competitiveScore: "LAGGING" | "LEADING" | "COMPETITIVE";
+        competitiveScore: "LAGGING" | "COMPETITIVE" | "LEADING";
         description: string;
         keyOpportunities: string;
     }>;
@@ -1428,7 +1591,7 @@ declare class SymphiqFunnelAnalysisPreviewComponent {
     buttonClass: _angular_core.Signal<string>;
     competitiveBadgeClass: _angular_core.Signal<string>;
     shouldPulseCompetitiveBadge: _angular_core.Signal<boolean>;
-    overallCompetitiveStatusBadgeClass: _angular_core.Signal<"border-2 bg-gradient-to-r from-emerald-500/30 to-emerald-500/20 text-emerald-400 border-emerald-500/40 shadow-lg shadow-emerald-500/20" | "border-2 bg-gradient-to-r from-blue-500/30 to-blue-500/20 text-blue-400 border-blue-500/40 shadow-lg shadow-blue-500/20" | "border-2 bg-gradient-to-r from-orange-500/30 to-orange-500/20 text-orange-400 border-orange-500/40 shadow-lg shadow-orange-500/20" | "border-2 bg-gradient-to-r from-slate-500/20 to-slate-500/10 text-slate-400 border-slate-500/30 shadow-lg shadow-slate-500/20" | "border-2 bg-gradient-to-br from-emerald-100/90 to-emerald-50/90 text-emerald-700 border-emerald-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-blue-100/90 to-blue-50/90 text-blue-700 border-blue-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-orange-100/90 to-orange-50/90 text-orange-700 border-orange-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-slate-100/90 to-slate-50/90 text-slate-700 border-slate-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]">;
+    overallCompetitiveStatusBadgeClass: _angular_core.Signal<"border-2 bg-gradient-to-br from-emerald-100/90 to-emerald-50/90 text-emerald-700 border-emerald-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-blue-100/90 to-blue-50/90 text-blue-700 border-blue-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-orange-100/90 to-orange-50/90 text-orange-700 border-orange-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-br from-slate-100/90 to-slate-50/90 text-slate-700 border-slate-200/50 shadow-[2px_2px_4px_rgba(163,163,163,0.25),-2px_-2px_4px_rgba(255,255,255,0.75)]" | "border-2 bg-gradient-to-r from-emerald-500/30 to-emerald-500/20 text-emerald-400 border-emerald-500/40 shadow-lg shadow-emerald-500/20" | "border-2 bg-gradient-to-r from-blue-500/30 to-blue-500/20 text-blue-400 border-blue-500/40 shadow-lg shadow-blue-500/20" | "border-2 bg-gradient-to-r from-orange-500/30 to-orange-500/20 text-orange-400 border-orange-500/40 shadow-lg shadow-orange-500/20" | "border-2 bg-gradient-to-r from-slate-500/20 to-slate-500/10 text-slate-400 border-slate-500/30 shadow-lg shadow-slate-500/20">;
     shouldPulseOverallCompetitive: _angular_core.Signal<boolean>;
     statusIconClass: _angular_core.Signal<string>;
     insightsCardClass: _angular_core.Signal<string>;
@@ -1440,7 +1603,7 @@ declare class SymphiqFunnelAnalysisPreviewComponent {
     getMetricLabel(metric: PerformanceMetricInterface): string;
     formatMetricValue(metric: PerformanceMetricInterface): string;
     formatTrend(metric: PerformanceMetricInterface): string;
-    getMetricTooltip(metric: PerformanceMetricInterface): any;
+    getMetricTooltip(metric: PerformanceMetricInterface): MetricValueTooltipContent;
     private formatCurrency;
     private formatPercent;
     private getGradeExplanation;
@@ -1451,6 +1614,493 @@ declare class SymphiqFunnelAnalysisPreviewComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SymphiqFunnelAnalysisPreviewComponent, "symphiq-funnel-analysis-preview", never, { "analysisInput": { "alias": "funnelAnalysis"; "required": false; "isSignal": true; }; "viewMode": { "alias": "viewMode"; "required": false; "isSignal": true; }; "useSampleData": { "alias": "useSampleData"; "required": false; "isSignal": true; }; "scrollElement": { "alias": "scrollElement"; "required": false; "isSignal": true; }; }, { "onViewAnalysis": "onViewAnalysis"; }, never, never, true, never>;
 }
 
+declare class ProfileItemLookupService {
+    private profileData;
+    setProfile(profile: ProfileInterface | undefined): void;
+    findItemById(id: string): ProfileItemInterface | undefined;
+    findItemsByIds(ids: string[]): ProfileItemInterface[];
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProfileItemLookupService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ProfileItemLookupService>;
+}
+
+declare class ProfileContextService {
+    private contextIndex;
+    indexProfile(sections: any[], recommendations?: ProfileAnalysisRecommendationInterface[]): void;
+    getRegions(): ProfileItemInterface[];
+    getSeasons(): ProfileItemInterface[];
+    getPriceTiers(): ProfileItemInterface[];
+    getCustomerSegments(): ProfileItemInterface[];
+    getProductCategories(): ProfileItemInterface[];
+    getFocusAreas(): ProfileItemInterface[];
+    getItemById(id: string): ProfileItemInterface | undefined;
+    getItemsByIds(ids: string[]): ProfileItemInterface[];
+    getCompetitors(): ProfileItemInterface[];
+    getRecommendationById(id: string): ProfileAnalysisRecommendationInterface | undefined;
+    getCompetitorsByIds(ids: string[]): ProfileItemInterface[];
+    getRecommendationsByProfileItemIds(itemIds: string[]): ProfileAnalysisRecommendationInterface[];
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProfileContextService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ProfileContextService>;
+}
+
+declare class SymphiqBusinessAnalysisDashboardComponent implements OnInit, AfterViewInit, OnDestroy {
+    requestedByUser?: {
+        firstName: string;
+        lastName: string;
+    };
+    viewMode: ViewModeEnum;
+    embedded: boolean;
+    scrollEvent?: Event;
+    scrollElement?: HTMLElement;
+    isLoading: boolean;
+    useSampleData: boolean;
+    profile?: ProfileInterface;
+    protected headerScrollService: HeaderScrollService;
+    protected lookupService: ProfileItemLookupService;
+    protected navigationService: NavigationStateService;
+    protected profileContextService: ProfileContextService;
+    protected searchService: BusinessProfileSearchService;
+    protected currentProfile: _angular_core.WritableSignal<ProfileInterface | undefined>;
+    protected scrollProgress: _angular_core.Signal<number>;
+    protected isLightMode: _angular_core.Signal<boolean>;
+    protected isCompactView: _angular_core.WritableSignal<boolean>;
+    protected currentSectionTitle: _angular_core.WritableSignal<string>;
+    protected currentSubsectionTitle: _angular_core.WritableSignal<string>;
+    protected sectionTitleFading: _angular_core.WritableSignal<boolean>;
+    protected subsectionTitleFading: _angular_core.WritableSignal<boolean>;
+    protected selectedSearchIndex: _angular_core.WritableSignal<number>;
+    protected sections: _angular_core.Signal<ProfileSectionInterface[]>;
+    private subsectionObserver?;
+    private sectionUpdateTimeout?;
+    private subsectionUpdateTimeout?;
+    private lastSectionTitle;
+    private lastSubsectionTitle;
+    private scrollToTargetHandler?;
+    private lastScrollY;
+    private scrollDirection;
+    private scrollDirectionHandler?;
+    protected sectionHasContent(section: ProfileSectionInterface): boolean;
+    protected subsectionHasContent(subsection: ProfileSubsectionInterface): boolean;
+    constructor();
+    onScroll(): void;
+    protected toggleExpandedView(): void;
+    handleKeyDown(event: KeyboardEvent): void;
+    protected openSearch(): void;
+    protected closeSearch(): void;
+    protected onSearchChange(query: string): void;
+    protected onSearchResultSelected(result: BusinessSearchResult): void;
+    private scrollToSearchResult;
+    private highlightAndPulseItem;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    protected getContainerClasses(): string;
+    protected getBackgroundClasses(): string;
+    protected getMeshGradientClasses(): string;
+    protected getTopoPatternClasses(): string;
+    protected getOrbClasses(index: number): string;
+    protected getHeaderClasses(): string;
+    protected getMainTitleClasses(): string;
+    protected getSubtitleClasses(): string;
+    protected getLoadingOverlayClasses(): string;
+    protected getSpinnerClasses(): string;
+    protected trackBySectionId(index: number, section: ProfileSectionInterface): string | number;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SymphiqBusinessAnalysisDashboardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SymphiqBusinessAnalysisDashboardComponent, "symphiq-business-analysis-dashboard", never, { "requestedByUser": { "alias": "requestedByUser"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "embedded": { "alias": "embedded"; "required": false; }; "scrollEvent": { "alias": "scrollEvent"; "required": false; }; "scrollElement": { "alias": "scrollElement"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "useSampleData": { "alias": "useSampleData"; "required": false; }; "profile": { "alias": "profile"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ProfileSectionComponent {
+    private sectionSignal;
+    set section(value: ProfileSectionInterface | undefined);
+    get section(): ProfileSectionInterface | null;
+    viewMode: ViewModeEnum;
+    forceExpanded: boolean;
+    protected visibleSubsections: _angular_core.Signal<ProfileSubsectionInterface[]>;
+    protected subsectionHasContent(subsection: ProfileSubsectionInterface): boolean;
+    protected getContainerClasses(): string;
+    protected getIconContainerClasses(): string;
+    protected getTitleClasses(): string;
+    protected getDividerClasses(): string;
+    protected trackBySubsectionId(index: number, subsection: ProfileSubsectionInterface): string | number;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProfileSectionComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProfileSectionComponent, "symphiq-profile-section", never, { "section": { "alias": "section"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ProfileSubsectionComponent {
+    subsection?: ProfileSubsectionInterface;
+    viewMode: ViewModeEnum;
+    parentSectionTitle?: string;
+    subsectionIndex: number;
+    forceExpanded: boolean;
+    private sanitizer;
+    private profileContextService;
+    protected ProfileItemTypeEnum: typeof ProfileItemTypeEnum;
+    protected sortedItems: _angular_core.Signal<ProfileItemInterface[]>;
+    protected formatContentWithLineBreaks(content: string): SafeHtml;
+    protected getContainerClasses(): string;
+    protected getIconClasses(): string;
+    protected getTitleClasses(): string;
+    protected getContentClasses(): string;
+    protected getVisualContainerClasses(): string;
+    protected getDisplayContent(): string | null;
+    protected trackByItemId(index: number, item: ProfileItemInterface): string | number;
+    protected getCompetitiveBenchmark(): any;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProfileSubsectionComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProfileSubsectionComponent, "symphiq-profile-subsection", never, { "subsection": { "alias": "subsection"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "parentSectionTitle": { "alias": "parentSectionTitle"; "required": false; }; "subsectionIndex": { "alias": "subsectionIndex"; "required": false; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ProfileItemCardComponent {
+    item?: ProfileItemInterface;
+    viewMode: ViewModeEnum;
+    subsectionId?: string;
+    forceExpanded: boolean;
+    animationIndex: number;
+    isLoading: boolean;
+    protected isRecommendation(): boolean;
+    protected getCardClasses(): string;
+    protected getIconClasses(): string;
+    protected getLabelClasses(): string;
+    protected getValueClasses(): string;
+    protected getItemIcon(): IconObjectInterface$1 | undefined;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProfileItemCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProfileItemCardComponent, "symphiq-profile-item-card", never, { "item": { "alias": "item"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "subsectionId": { "alias": "subsectionId"; "required": false; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; }; "animationIndex": { "alias": "animationIndex"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class NapkinVisualPlaceholderComponent implements OnInit, OnChanges {
+    visual?: NapkinVisualInterface;
+    viewMode: ViewModeEnum;
+    private sanitizer;
+    private modalService;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    protected hasSvgData(): boolean;
+    protected getSvgDataForViewMode(): string | undefined;
+    protected getSanitizedSvg(): SafeHtml;
+    protected getSvgContainerClasses(): string;
+    protected getContainerClasses(): string;
+    protected getIconContainerClasses(): string;
+    protected getTitleClasses(): string;
+    protected getSubtitleClasses(): string;
+    protected getBadgeClasses(): string;
+    protected getStyleLabel(styleId?: string): string;
+    protected getExpandIconClasses(): string;
+    protected openModal(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NapkinVisualPlaceholderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NapkinVisualPlaceholderComponent, "symphiq-napkin-visual-placeholder", never, { "visual": { "alias": "visual"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class HierarchyDisplayComponent {
+    hierarchyData?: HierarchyDataInterface;
+    viewMode: ViewModeEnum;
+    protected getNodeClasses(level: number): string;
+    protected getNodeIconClasses(level: number): string;
+    protected getNodeLabelClasses(): string;
+    protected getNodeTextClasses(): string;
+    protected getConnectorClasses(): string;
+    protected getCompetitiveMetricsClasses(): string;
+    protected getCompetitiveMetricsTitleClasses(): string;
+    protected hasCompetitiveMetrics(): boolean;
+    protected getIndustryMarketShare(): number | undefined;
+    protected getCompetitorOverlap(): number | undefined;
+    protected getMarketShareType(share: number): 'advantage' | 'parity' | 'disadvantage' | 'opportunity' | 'threat';
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HierarchyDisplayComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<HierarchyDisplayComponent, "symphiq-hierarchy-display", never, { "hierarchyData": { "alias": "hierarchyData"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SectionNavigationComponent implements OnInit {
+    sections: ProfileSectionInterface[];
+    viewMode: ViewModeEnum;
+    embedded: boolean;
+    protected activeSection: _angular_core.WritableSignal<number>;
+    ngOnInit(): void;
+    protected getNavClasses(): string;
+    protected getDotClasses(index: number): string;
+    protected getDotInnerClasses(index: number): string;
+    protected scrollToSection(sectionId: string): void;
+    protected trackBySectionId(index: number, section: ProfileSectionInterface): string | number;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SectionNavigationComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SectionNavigationComponent, "symphiq-section-navigation", never, { "sections": { "alias": "sections"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "embedded": { "alias": "embedded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class FloatingTocComponent implements OnInit, OnDestroy {
+    sections: ProfileSectionInterface[];
+    viewMode: ViewModeEnum;
+    embedded: boolean;
+    protected isHovered: _angular_core.WritableSignal<boolean>;
+    protected isPinned: _angular_core.WritableSignal<boolean>;
+    protected activeSection: _angular_core.WritableSignal<string>;
+    protected activeSubsection: _angular_core.WritableSignal<string>;
+    protected expandedSections: _angular_core.WritableSignal<Set<string>>;
+    private readonly HEADER_OFFSET;
+    protected tocSections: _angular_core.Signal<{
+        id: string;
+        title: string;
+        icon: _jebgem_model.IconObjectInterface | undefined;
+        subsections: {
+            id: string;
+            title: string;
+            parentId: string;
+        }[];
+    }[]>;
+    private observer?;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private setupIntersectionObserver;
+    protected onMouseEnter(): void;
+    protected onMouseLeave(): void;
+    protected togglePinned(): void;
+    protected isSectionExpanded(sectionId: string): boolean;
+    protected scrollToSection(sectionId: string): void;
+    protected scrollToSubsection(subsectionId: string): void;
+    protected scrollToTop(): void;
+    protected getOuterContainerClasses(): string;
+    protected getInnerContainerClasses(): string;
+    protected getCollapsedIconClasses(): string;
+    protected getExpandedContentClasses(): string;
+    protected getBorderClasses(): string;
+    protected getHeaderIconClasses(): string;
+    protected getHeaderTextClasses(): string;
+    protected getPinButtonClasses(): string;
+    protected getScrollbarClasses(): string;
+    protected getSectionButtonClasses(sectionId: string): string;
+    protected getSectionIconClasses(sectionId: string): string;
+    protected getActiveIndicatorClasses(): string;
+    protected getSubsectionButtonClasses(subsectionId: string): string;
+    protected getActiveSubIndicatorClasses(): string;
+    protected getBackToTopButtonClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FloatingTocComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FloatingTocComponent, "symphiq-floating-toc", never, { "sections": { "alias": "sections"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "embedded": { "alias": "embedded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class FloatingBackButtonComponent implements OnInit, OnDestroy {
+    viewMode: ViewModeEnum;
+    embedded: boolean;
+    private navigationService;
+    private readonly HEADER_OFFSET;
+    protected navigationState: _angular_core.Signal<NavigationState>;
+    protected isVisible: _angular_core.Signal<boolean>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    protected navigateBack(): void;
+    protected close(): void;
+    protected getOuterContainerClasses(): string;
+    protected getInnerContainerClasses(): string;
+    protected getBackButtonClasses(): string;
+    protected getCloseButtonClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FloatingBackButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FloatingBackButtonComponent, "symphiq-floating-back-button", never, { "viewMode": { "alias": "viewMode"; "required": false; }; "embedded": { "alias": "embedded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class BusinessAnalysisModalComponent implements OnInit {
+    isLightMode: _angular_core.InputSignal<boolean>;
+    private modalService;
+    private sanitizer;
+    isOpen: _angular_core.WritableSignal<boolean>;
+    modalType: _angular_core.WritableSignal<string | null>;
+    modalTitle: _angular_core.WritableSignal<string>;
+    visualizationData: _angular_core.WritableSignal<VisualizationData | null>;
+    competitiveGapData: _angular_core.WritableSignal<{
+        item: ProfileItemInterface;
+        viewMode: ViewModeEnum;
+    } | null>;
+    recommendationActionStepsData: _angular_core.WritableSignal<{
+        title?: string;
+        actionSteps: ProfileAnalysisRecommendationActionStepInterface[];
+        viewMode: ViewModeEnum;
+    } | null>;
+    visualizationType: _angular_core.Signal<"horizontal-bar" | "circular-progress" | "napkin-visual" | "custom" | null>;
+    horizontalBarData: _angular_core.Signal<{
+        percentage: number;
+        label: string;
+        value: string;
+        gradient?: string;
+    }[] | null>;
+    circularProgressData: _angular_core.Signal<{
+        percentage: number;
+        progressColor?: string;
+        backgroundColor?: string;
+    } | null>;
+    napkinVisualData: _angular_core.Signal<{
+        svgData: string;
+        viewMode?: string;
+        styleId?: string;
+    } | null>;
+    competitiveGapItem: _angular_core.Signal<ProfileItemInterface | undefined>;
+    constructor();
+    ngOnInit(): void;
+    getSanitizedSvg(): SafeHtml;
+    closeModal(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BusinessAnalysisModalComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BusinessAnalysisModalComponent, "symphiq-business-analysis-modal", never, { "isLightMode": { "alias": "isLightMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class HorizontalBarComponent implements OnInit, OnDestroy {
+    percentage: number;
+    label: string;
+    value: string;
+    height: number;
+    showLabel: boolean;
+    gradient: string;
+    isDark: boolean;
+    animationDuration: number;
+    animationDelay: number;
+    private elementRef;
+    private observer?;
+    private animationFrame?;
+    private hasAnimated;
+    protected animatedPercentage: _angular_core.WritableSignal<number>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private setupObserver;
+    private animateProgress;
+    protected animatedDisplayValue(): string;
+    get backgroundClasses(): string;
+    get barClasses(): string;
+    get labelClasses(): string;
+    get valueClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HorizontalBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<HorizontalBarComponent, "symphiq-horizontal-bar", never, { "percentage": { "alias": "percentage"; "required": false; }; "label": { "alias": "label"; "required": false; }; "value": { "alias": "value"; "required": false; }; "height": { "alias": "height"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "gradient": { "alias": "gradient"; "required": false; }; "isDark": { "alias": "isDark"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "animationDelay": { "alias": "animationDelay"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class CircularProgressComponent implements OnInit, OnDestroy {
+    percentage: number;
+    size: number;
+    strokeWidth: number;
+    progressColor: string;
+    backgroundColor: string;
+    showPercentage: boolean;
+    textClasses: string;
+    strokeLinecap: 'butt' | 'round' | 'square';
+    animationDuration: number;
+    animationDelay: number;
+    private elementRef;
+    private observer?;
+    private animationFrame?;
+    private hasAnimated;
+    protected animatedPercentage: _angular_core.WritableSignal<number>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private setupObserver;
+    private animateProgress;
+    get radius(): number;
+    get circumference(): number;
+    protected animatedOffset(): number;
+    protected animatedDisplayValue(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CircularProgressComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CircularProgressComponent, "symphiq-circular-progress", never, { "percentage": { "alias": "percentage"; "required": false; }; "size": { "alias": "size"; "required": false; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; }; "progressColor": { "alias": "progressColor"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "showPercentage": { "alias": "showPercentage"; "required": false; }; "textClasses": { "alias": "textClasses"; "required": false; }; "strokeLinecap": { "alias": "strokeLinecap"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "animationDelay": { "alias": "animationDelay"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+type VisualizationType = 'horizontal-bar' | 'circular-progress' | 'custom';
+declare class VisualizationContainerComponent {
+    isLightMode: _angular_core.InputSignal<boolean>;
+    visualizationType: _angular_core.InputSignal<VisualizationType>;
+    visualizationData: _angular_core.InputSignal<unknown>;
+    disableInteraction: _angular_core.InputSignal<boolean>;
+    visualizationClick: _angular_core.OutputEmitterRef<{
+        type: VisualizationType;
+        data: unknown;
+    }>;
+    containerClass: _angular_core.Signal<"" | "cursor-pointer">;
+    iconClass: _angular_core.Signal<"text-slate-400 group-hover:text-blue-500" | "text-slate-500 group-hover:text-blue-400">;
+    onExpandClick(event: Event): void;
+    onVisualizationClick(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<VisualizationContainerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<VisualizationContainerComponent, "symphiq-visualization-container", never, { "isLightMode": { "alias": "isLightMode"; "required": false; "isSignal": true; }; "visualizationType": { "alias": "visualizationType"; "required": false; "isSignal": true; }; "visualizationData": { "alias": "visualizationData"; "required": false; "isSignal": true; }; "disableInteraction": { "alias": "disableInteraction"; "required": false; "isSignal": true; }; }, { "visualizationClick": "visualizationClick"; }, never, ["*"], true, never>;
+}
+
+declare class ScrollProgressBarComponent {
+    set progress(value: number);
+    isLightMode: boolean;
+    embedded: boolean;
+    protected scrollProgress: _angular_core.WritableSignal<number>;
+    protected getContainerClasses(): string;
+    protected getGradientClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScrollProgressBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ScrollProgressBarComponent, "symphiq-scroll-progress-bar", never, { "progress": { "alias": "progress"; "required": false; }; "isLightMode": { "alias": "isLightMode"; "required": false; }; "embedded": { "alias": "embedded"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+interface IconObjectInterface {
+    name?: string;
+    source?: 'HEROICONS' | string;
+}
+declare class SymphiqIconComponent {
+    private iconService;
+    set icon(value: IconObjectInterface | undefined);
+    set size(value: string);
+    set customClass(value: string);
+    private iconSignal;
+    private sizeSignal;
+    private customClassSignal;
+    protected containerClass: _angular_core.Signal<string>;
+    private iconRequest$;
+    protected iconHtml: _angular_core.Signal<"" | _angular_platform_browser.SafeHtml>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SymphiqIconComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SymphiqIconComponent, "symphiq-icon", never, { "icon": { "alias": "icon"; "required": false; }; "size": { "alias": "size"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SectionDividerComponent {
+    viewMode: ViewModeEnum;
+    animationDelay: string;
+    private subsectionsSignal;
+    set subsections(value: ProfileSubsectionInterface[] | undefined);
+    protected displayIcons: _angular_core.Signal<_jebgem_model.IconObjectInterface[]>;
+    protected isLightMode(): boolean;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SectionDividerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SectionDividerComponent, "symphiq-section-divider", never, { "viewMode": { "alias": "viewMode"; "required": false; }; "animationDelay": { "alias": "animationDelay"; "required": false; }; "subsections": { "alias": "subsections"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SearchButtonComponent {
+    isLightMode: _angular_core.InputSignal<boolean>;
+    minimized: _angular_core.InputSignal<boolean>;
+    title: _angular_core.InputSignal<string>;
+    searchClick: _angular_core.OutputEmitterRef<void>;
+    buttonClass: _angular_core.Signal<"bg-slate-100 text-slate-700 hover:bg-slate-200 hover:text-slate-900" | "bg-slate-800 text-slate-300 hover:bg-slate-700 hover:text-white">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SearchButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchButtonComponent, "symphiq-search-button", never, { "isLightMode": { "alias": "isLightMode"; "required": false; "isSignal": true; }; "minimized": { "alias": "minimized"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; }, { "searchClick": "searchClick"; }, never, never, true, never>;
+}
+
+declare class SearchModalComponent {
+    searchInput?: ElementRef<HTMLInputElement>;
+    isLightMode: _angular_core.InputSignal<boolean>;
+    isOpen: _angular_core.InputSignal<boolean>;
+    searchQuery: _angular_core.InputSignal<string>;
+    results: _angular_core.InputSignal<BusinessSearchResult[]>;
+    hasResults: _angular_core.InputSignal<boolean>;
+    selectedIndex: _angular_core.InputSignal<number>;
+    placeholder: _angular_core.InputSignal<string>;
+    searchChange: _angular_core.OutputEmitterRef<string>;
+    resultSelected: _angular_core.OutputEmitterRef<BusinessSearchResult>;
+    close: _angular_core.OutputEmitterRef<void>;
+    constructor();
+    onSearchChange(query: string): void;
+    clearSearch(): void;
+    closeModal(): void;
+    selectResult(result: BusinessSearchResult): void;
+    getResultClass(index: number): string;
+    getTypeIconBgClass(type: string): string;
+    getTypeIconClass(type: string): string;
+    getTypeBadgeText(result: BusinessSearchResult): string;
+    containerClass: _angular_core.Signal<"bg-white border border-slate-200" | "bg-slate-800 border border-slate-700">;
+    inputClass: _angular_core.Signal<"bg-white text-slate-900 placeholder-slate-400" | "bg-slate-800 text-white placeholder-slate-500">;
+    iconClass: _angular_core.Signal<"text-slate-400" | "text-slate-500">;
+    clearButtonClass: _angular_core.Signal<"bg-slate-100 text-slate-600 hover:bg-slate-200" | "bg-slate-700 text-slate-300 hover:bg-slate-600">;
+    closeButtonClass: _angular_core.Signal<"text-slate-400 hover:text-slate-600 hover:bg-slate-100" | "text-slate-500 hover:text-slate-300 hover:bg-slate-700">;
+    resultsContainerClass: _angular_core.Signal<"border-slate-200" | "border-slate-700">;
+    resultTitleClass: _angular_core.Signal<"text-slate-900" | "text-white">;
+    resultDescClass: _angular_core.Signal<"text-slate-600" | "text-slate-400">;
+    breadcrumbClass: _angular_core.Signal<string>;
+    typeBadgeClass: _angular_core.Signal<"bg-slate-100 text-slate-600" | "bg-slate-700 text-slate-300">;
+    arrowClass: _angular_core.Signal<"text-slate-400" | "text-slate-500">;
+    emptyStateClass: _angular_core.Signal<"border-slate-200" | "border-slate-700">;
+    emptyIconClass: _angular_core.Signal<"text-slate-600" | "text-slate-300">;
+    emptyTitleClass: _angular_core.Signal<"text-slate-900" | "text-white">;
+    emptyDescClass: _angular_core.Signal<"text-slate-600" | "text-slate-400">;
+    shortcutsClass: _angular_core.Signal<"bg-slate-900/50 border-slate-700" | "bg-slate-50 border-slate-200">;
+    kbdClass: _angular_core.Signal<"bg-white border border-slate-300 text-slate-700 shadow-sm" | "bg-slate-700 border border-slate-600 text-slate-300">;
+    shortcutTextClass: _angular_core.Signal<"text-slate-600" | "text-slate-400">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SearchModalComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchModalComponent, "symphiq-search-modal", never, { "isLightMode": { "alias": "isLightMode"; "required": false; "isSignal": true; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "searchQuery": { "alias": "searchQuery"; "required": false; "isSignal": true; }; "results": { "alias": "results"; "required": false; "isSignal": true; }; "hasResults": { "alias": "hasResults"; "required": false; "isSignal": true; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, { "searchChange": "searchChange"; "resultSelected": "resultSelected"; "close": "close"; }, never, never, true, never>;
+}
+
 declare class ChartContainerComponent {
     chart: _angular_core.InputSignal<AiChartInterface>;
     isLightMode: _angular_core.InputSignal<boolean>;
@@ -1460,12 +2110,13 @@ declare class ChartContainerComponent {
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
     chartClick: _angular_core.OutputEmitterRef<AiChartInterface>;
     isExpanded: _angular_core.WritableSignal<boolean>;
+    protected ChartTypeEnum: typeof ChartTypeEnum;
     containerClass: _angular_core.Signal<"bg-white border-slate-200 hover:border-blue-300 hover:shadow-blue-100/50" | "bg-slate-800 border-slate-700 hover:border-slate-600 hover:shadow-slate-900/50">;
     headerClass: _angular_core.Signal<"border-slate-200" | "border-slate-700">;
     titleClass: _angular_core.Signal<"text-slate-900" | "text-white">;
     descriptionClass: _angular_core.Signal<"text-slate-600" | "text-slate-400">;
     iconClass: _angular_core.Signal<"text-slate-400 group-hover:text-blue-500" | "text-slate-500 group-hover:text-blue-400">;
-    chartIconClass: _angular_core.Signal<"bg-blue-100 text-blue-600" | "bg-blue-500/20 text-blue-400">;
+    chartIconClass: _angular_core.Signal<"bg-blue-500/20 text-blue-400" | "bg-blue-100 text-blue-600">;
     expandButtonClass: _angular_core.Signal<"bg-blue-100 text-blue-600 hover:bg-blue-200" | "bg-blue-500/20 text-blue-400 hover:bg-blue-500/30">;
     closeButtonClass: _angular_core.Signal<"bg-slate-100 text-slate-600 hover:bg-slate-200" | "bg-slate-700/50 text-slate-400 hover:bg-slate-600/50">;
     isCollapsible: _angular_core.Signal<boolean>;
@@ -1482,7 +2133,7 @@ declare class LineChartComponent implements OnInit, AfterViewInit, OnDestroy {
     chart: _angular_core.InputSignal<AiChartInterface>;
     showAxisLabels: _angular_core.InputSignal<boolean>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
-    chartHeight: _angular_core.Signal<"500px" | "133px">;
+    chartHeight: _angular_core.Signal<"133px" | "500px">;
     cursorColor: _angular_core.Signal<9741240 | 16777215>;
     tooltipTextColor: _angular_core.Signal<0 | 16777215>;
     chartHash: _angular_core.Signal<string>;
@@ -1525,7 +2176,7 @@ declare class BarChartComponent implements OnInit, AfterViewInit, OnDestroy {
     chart: _angular_core.InputSignal<AiChartInterface>;
     showAxisLabels: _angular_core.InputSignal<boolean>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
-    chartHeight: _angular_core.Signal<"500px" | "175px">;
+    chartHeight: _angular_core.Signal<"175px" | "500px">;
     cursorColor: _angular_core.Signal<9741240 | 16777215>;
     tooltipTextColor: _angular_core.Signal<0 | 16777215>;
     chartHash: _angular_core.Signal<string>;
@@ -1561,7 +2212,7 @@ declare class PieChartComponent implements OnInit, AfterViewInit, OnDestroy {
     chart: _angular_core.InputSignal<AiChartInterface>;
     showAxisLabels: _angular_core.InputSignal<boolean>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
-    chartHeight: _angular_core.Signal<"500px" | "200px">;
+    chartHeight: _angular_core.Signal<"200px" | "500px">;
     chartHash: _angular_core.Signal<string>;
     chartDiv: ElementRef;
     private root?;
@@ -1596,7 +2247,7 @@ declare class AreaChartComponent implements OnInit, AfterViewInit, OnDestroy {
     chart: _angular_core.InputSignal<AiChartInterface>;
     showAxisLabels: _angular_core.InputSignal<boolean>;
     viewMode: _angular_core.InputSignal<ViewModeEnum>;
-    chartHeight: _angular_core.Signal<"500px" | "133px">;
+    chartHeight: _angular_core.Signal<"133px" | "500px">;
     cursorColor: _angular_core.Signal<9741240 | 16777215>;
     chartHash: _angular_core.Signal<string>;
     chartDiv: ElementRef;
@@ -1630,6 +2281,7 @@ declare class AreaChartComponent implements OnInit, AfterViewInit, OnDestroy {
 declare class TooltipContainerComponent {
     isLightMode: _angular_core.WritableSignal<boolean>;
     private tooltipService;
+    private navigationService;
     private elementRef;
     private renderer;
     private tooltipStateSignal;
@@ -1661,6 +2313,7 @@ declare class TooltipContainerComponent {
     containerClass: _angular_core.Signal<"" | "-translate-x-1/2">;
     contentClass: _angular_core.Signal<"bg-white/95 border-slate-300 text-slate-900" | "bg-slate-800/95 border-slate-600 text-white">;
     textClass: _angular_core.Signal<"text-slate-700" | "text-slate-200">;
+    viewMoreButtonClass: _angular_core.Signal<"bg-blue-50 text-blue-700 border border-blue-200 hover:bg-blue-200 hover:border-blue-400 hover:text-blue-800 active:bg-blue-300" | "bg-blue-500/10 text-blue-400 border border-blue-500/20 hover:bg-blue-500/30 hover:border-blue-500/40 hover:text-blue-300 active:bg-blue-500/40">;
     transformStyle: _angular_core.Signal<"none" | "translateX(-192px)">;
     constructor();
     onTooltipMouseEnter(): void;
@@ -1668,6 +2321,7 @@ declare class TooltipContainerComponent {
     private calculateLeft;
     private calculateTop;
     private findTransformedAncestor;
+    scrollToTarget(targetId: string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TooltipContainerComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TooltipContainerComponent, "symphiq-tooltip-container", never, {}, {}, never, never, true, never>;
 }
@@ -1689,7 +2343,6 @@ declare class TooltipDirective implements OnDestroy {
     onMouseEnter(event: MouseEvent): void;
     onMouseMove(event: MouseEvent): void;
     onMouseLeave(): void;
-    onMouseEnterAgain(): void;
     onFocus(): void;
     onBlur(): void;
     private scheduleShow;
@@ -1701,8 +2354,266 @@ declare class TooltipDirective implements OnDestroy {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TooltipDirective, "[libSymphiqTooltip]", never, { "symphiqTooltip": { "alias": "libSymphiqTooltip"; "required": false; "isSignal": true; }; "tooltipType": { "alias": "tooltipType"; "required": false; "isSignal": true; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; "isSignal": true; }; "tooltipDelay": { "alias": "tooltipDelay"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+declare class ShadowElevationDirective implements OnInit, OnDestroy {
+    private el;
+    private renderer;
+    private scrollDepthService;
+    private platformId;
+    scrollContainer?: HTMLElement | 'window';
+    shadowOffset: number;
+    private subscription?;
+    private containerId;
+    private currentShadowClass;
+    private currentBorderClass;
+    private currentBackgroundClass;
+    private intersectionObserver?;
+    private isVisible;
+    constructor(el: ElementRef<HTMLElement>, renderer: Renderer2, scrollDepthService: ScrollDepthService, platformId: Object);
+    ngOnInit(): void;
+    private setupIntersectionObserver;
+    private updateShadow;
+    private getShadowClasses;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ShadowElevationDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ShadowElevationDirective, "[symphiqShadowElevation]", never, { "scrollContainer": { "alias": "symphiqShadowElevation"; "required": false; }; "shadowOffset": { "alias": "shadowOffset"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+type AnimationType = 'fade-in' | 'slide-up' | 'slide-left' | 'slide-right' | 'zoom-in' | 'none';
+declare class ViewportAnimationDirective implements OnInit, OnDestroy {
+    private el;
+    private renderer;
+    symphiqViewportAnimation: AnimationType;
+    animationDelay: number;
+    animationDuration: number;
+    staggerIndex: number;
+    staggerDelay: number;
+    threshold: number;
+    rootMargin: string;
+    once: boolean;
+    private observer?;
+    private hasAnimated;
+    constructor(el: ElementRef, renderer: Renderer2);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    private setupInitialState;
+    private setupObserver;
+    private animateIn;
+    private animateOut;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ViewportAnimationDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ViewportAnimationDirective, "[symphiqViewportAnimation]", never, { "symphiqViewportAnimation": { "alias": "symphiqViewportAnimation"; "required": false; }; "animationDelay": { "alias": "animationDelay"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "staggerIndex": { "alias": "staggerIndex"; "required": false; }; "staggerDelay": { "alias": "staggerDelay"; "required": false; }; "threshold": { "alias": "threshold"; "required": false; }; "rootMargin": { "alias": "rootMargin"; "required": false; }; "once": { "alias": "once"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+type BadgeType = 'primary' | 'success' | 'warning' | 'info' | 'premium' | 'default' | 'danger' | 'neutral';
+
+declare class FocusAreaDetailCardComponent {
+    item?: ProfileItemInterface;
+    viewMode: ViewModeEnum;
+    set forceExpanded(value: boolean);
+    animationIndex: number;
+    protected IconSourceEnum: typeof IconSourceEnum;
+    protected isExpanded: _angular_core.WritableSignal<boolean>;
+    private _forceExpanded;
+    private _hasAnimated;
+    private modalService;
+    private profileContextService;
+    protected isDark: _angular_core.Signal<boolean>;
+    protected isActuallyExpanded: _angular_core.Signal<boolean>;
+    protected forceExpandedValue: _angular_core.Signal<boolean>;
+    protected shouldAnimateExpand: _angular_core.Signal<boolean>;
+    protected iconSize: _angular_core.Signal<"w-6 h-6" | "w-7 h-7">;
+    protected relatedRecommendations: _angular_core.Signal<_jebgem_model.ProfileAnalysisRecommendationInterface[]>;
+    protected statusLabel: _angular_core.Signal<string>;
+    protected statusBadgeType: _angular_core.Signal<BadgeType>;
+    protected statusIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected insightsIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected recommendationsIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected relatedIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected cardClasses: _angular_core.Signal<string>;
+    protected iconClasses: _angular_core.Signal<string>;
+    protected labelClasses: _angular_core.Signal<string>;
+    protected descriptionClasses: _angular_core.Signal<"text-sm text-slate-400 mt-1 leading-relaxed" | "text-sm text-slate-600 mt-1 leading-relaxed">;
+    protected metaLabelClasses: _angular_core.Signal<"text-xs font-medium text-slate-400 uppercase tracking-wide" | "text-xs font-medium text-slate-600 uppercase tracking-wide">;
+    protected toolChipClasses: _angular_core.Signal<"px-2.5 py-1 rounded-md bg-emerald-500/10 text-emerald-300 text-xs border border-emerald-500/30" | "px-2.5 py-1 rounded-md bg-emerald-50 text-emerald-700 text-xs border border-emerald-200">;
+    protected expandedSectionClasses: _angular_core.Signal<"p-4 rounded-lg bg-slate-700/30 border border-slate-600/30" | "p-4 rounded-lg bg-slate-50 border border-slate-200">;
+    protected expandedIconClasses: _angular_core.Signal<"text-blue-400" | "text-blue-600">;
+    protected expandedTitleClasses: _angular_core.Signal<"text-sm font-semibold text-white" | "text-sm font-semibold text-slate-900">;
+    protected insightItemClasses: _angular_core.Signal<"text-sm text-slate-300 leading-relaxed flex" | "text-sm text-slate-600 leading-relaxed flex">;
+    protected expandButtonClasses: _angular_core.Signal<"text-sm font-medium text-blue-400" | "text-sm font-medium text-blue-600">;
+    protected chevronClasses: _angular_core.Signal<"text-blue-400" | "text-blue-600">;
+    protected toggleExpanded(): void;
+    protected openCompetitiveGapModal(): void;
+    onExpandItem(event: CustomEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FocusAreaDetailCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FocusAreaDetailCardComponent, "symphiq-focus-area-detail-card", never, { "item": { "alias": "item"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; }; "animationIndex": { "alias": "animationIndex"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+interface CompetitorContext {
+    geographic?: ProfileItemInterface[];
+    price?: ProfileItemInterface[];
+    seasonal?: ProfileItemInterface[];
+    audience?: ProfileItemInterface[];
+    product?: ProfileItemInterface[];
+    focusAreas?: ProfileItemInterface[];
+}
+
+declare class CompetitorAnalysisCardComponent {
+    item?: ProfileItemInterface;
+    viewMode: ViewModeEnum;
+    set forceExpanded(value: boolean);
+    animationIndex: number;
+    protected IconSourceEnum: typeof IconSourceEnum;
+    protected isExpanded: _angular_core.WritableSignal<boolean>;
+    private _forceExpanded;
+    private _hasAnimated;
+    private modalService;
+    private profileContextService;
+    private navigationService;
+    protected isDark: _angular_core.Signal<boolean>;
+    protected isActuallyExpanded: _angular_core.Signal<boolean>;
+    protected forceExpandedValue: _angular_core.Signal<boolean>;
+    protected shouldAnimateExpand: _angular_core.Signal<boolean>;
+    protected iconSize: _angular_core.Signal<"w-6 h-6" | "w-7 h-7">;
+    protected hasCompanyInfo: _angular_core.Signal<boolean>;
+    protected competitorContext: _angular_core.Signal<CompetitorContext | undefined>;
+    protected hasAnyContext: _angular_core.Signal<boolean>;
+    protected threatLevelLabel: _angular_core.Signal<string>;
+    protected threatLevelBadgeType: _angular_core.Signal<BadgeType>;
+    protected threatLevelIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected getStrengthArea(strength: any): string;
+    protected getStrengthText(strength: any): string;
+    protected getWeaknessArea(weakness: any): string;
+    protected getWeaknessText(weakness: any): string;
+    protected websiteIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected strategyIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected strengthIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected weaknessIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected advantageIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected vulnerabilityIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected relatedIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected contextIcon: _angular_core.Signal<IconObjectInterface$1>;
+    protected cardClasses: _angular_core.Signal<string>;
+    protected iconClasses: _angular_core.Signal<string>;
+    protected labelClasses: _angular_core.Signal<string>;
+    protected descriptionClasses: _angular_core.Signal<"text-sm text-slate-400 mt-1 leading-relaxed" | "text-sm text-slate-600 mt-1 leading-relaxed">;
+    protected infoBoxClasses: _angular_core.Signal<"p-2.5 rounded-lg bg-slate-700/30 border border-slate-600/30" | "p-2.5 rounded-lg bg-slate-50 border border-slate-200">;
+    protected infoLabelClasses: _angular_core.Signal<"text-xs text-slate-400 mb-0.5" | "text-xs text-slate-600 mb-0.5">;
+    protected infoValueClasses: _angular_core.Signal<"text-sm font-semibold text-white" | "text-sm font-semibold text-slate-900">;
+    protected linkClasses: _angular_core.Signal<"text-sm text-blue-400 hover:text-blue-300 underline transition-colors" | "text-sm text-blue-600 hover:text-blue-700 underline transition-colors">;
+    protected listItemClasses: _angular_core.Signal<"text-sm text-slate-200 leading-relaxed flex items-start" | "text-sm text-slate-600 leading-relaxed flex items-start">;
+    protected expandedSectionClasses: _angular_core.Signal<"p-4 rounded-lg bg-slate-700/30 border border-slate-600/30" | "p-4 rounded-lg bg-slate-50 border border-slate-200">;
+    protected expandedIconClasses: _angular_core.Signal<"text-blue-400" | "text-blue-600">;
+    protected expandedTitleClasses: _angular_core.Signal<"text-sm font-semibold text-white" | "text-sm font-semibold text-slate-900">;
+    protected expandedTextClasses: _angular_core.Signal<"text-sm text-slate-300 leading-relaxed" | "text-sm text-slate-600 leading-relaxed">;
+    protected expandButtonClasses: _angular_core.Signal<"text-sm font-medium text-blue-400" | "text-sm font-medium text-blue-600">;
+    protected chevronClasses: _angular_core.Signal<"text-blue-400" | "text-blue-600">;
+    protected toggleExpanded(): void;
+    protected navigateToItem(item: ProfileItemInterface): void;
+    onExpandItem(event: CustomEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CompetitorAnalysisCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CompetitorAnalysisCardComponent, "symphiq-competitor-analysis-card", never, { "item": { "alias": "item"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "forceExpanded": { "alias": "forceExpanded"; "required": false; }; "animationIndex": { "alias": "animationIndex"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class OpportunityHighlightBannerComponent {
+    title: string;
+    message?: string;
+    isDark: boolean;
+    bannerClick: EventEmitter<void>;
+    protected iconSource: IconSourceEnum;
+    protected bannerClasses: _angular_core.Signal<"bg-gradient-to-r from-amber-500/10 to-orange-500/10 border-l-amber-500 border-r border-t border-b border-amber-500/30" | "bg-gradient-to-r from-amber-50 to-orange-50 border-l-amber-500 border-r border-t border-b border-amber-200">;
+    protected iconContainerClasses: _angular_core.Signal<"bg-amber-500/20 text-amber-400" | "bg-amber-100 text-amber-600">;
+    protected titleClasses: _angular_core.Signal<"text-amber-300" | "text-amber-900">;
+    protected badgeClasses: _angular_core.Signal<"bg-amber-500/30 text-amber-300" | "bg-amber-200 text-amber-800">;
+    protected messageClasses: _angular_core.Signal<"text-amber-700" | "text-amber-400/90">;
+    protected chevronClasses: _angular_core.Signal<"text-amber-600" | "text-amber-400">;
+    handleClick(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<OpportunityHighlightBannerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<OpportunityHighlightBannerComponent, "symphiq-opportunity-highlight-banner", never, { "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; }; "isDark": { "alias": "isDark"; "required": false; }; }, { "bannerClick": "bannerClick"; }, never, never, true, never>;
+}
+
+declare class SkeletonCardBaseComponent {
+    viewMode: ViewModeEnum;
+    protected getCardClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonCardBaseComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonCardBaseComponent, "symphiq-skeleton-card-base", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+declare class SkeletonBarComponent {
+    viewMode: ViewModeEnum;
+    width: string;
+    height: string;
+    protected getClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonBarComponent, "symphiq-skeleton-bar", never, { "viewMode": { "alias": "viewMode"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; }, {}, never, never, true, never>;
+}
+declare class SkeletonCircleComponent {
+    viewMode: ViewModeEnum;
+    size: string;
+    protected getClasses(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonCircleComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonCircleComponent, "symphiq-skeleton-circle", never, { "viewMode": { "alias": "viewMode"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SkeletonCustomerSegmentCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonCustomerSegmentCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonCustomerSegmentCardComponent, "symphiq-skeleton-customer-segment-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SkeletonProductCategoryCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonProductCategoryCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonProductCategoryCardComponent, "symphiq-skeleton-product-category-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SkeletonGenericCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonGenericCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonGenericCardComponent, "symphiq-skeleton-generic-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+declare class SkeletonRegionCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonRegionCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonRegionCardComponent, "symphiq-skeleton-region-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+declare class SkeletonSeasonCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonSeasonCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonSeasonCardComponent, "symphiq-skeleton-season-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+declare class SkeletonPriceTierCardComponent {
+    viewMode: ViewModeEnum;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonPriceTierCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonPriceTierCardComponent, "symphiq-skeleton-price-tier-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SkeletonFocusAreaCardComponent {
+    viewMode: ViewModeEnum;
+    protected isDark: _angular_core.Signal<boolean>;
+    protected iconSkeletonClasses: _angular_core.Signal<"w-12 h-12 bg-slate-700" | "w-12 h-12 bg-slate-200">;
+    protected titleSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    protected textSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    protected badgeSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonFocusAreaCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonFocusAreaCardComponent, "symphiq-skeleton-focus-area-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SkeletonCompetitorCardComponent {
+    viewMode: ViewModeEnum;
+    protected isDark: _angular_core.Signal<boolean>;
+    protected iconSkeletonClasses: _angular_core.Signal<"w-12 h-12 bg-slate-700" | "w-12 h-12 bg-slate-200">;
+    protected titleSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    protected textSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    protected boxSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    protected badgeSkeletonClasses: _angular_core.Signal<"bg-slate-200" | "bg-slate-700">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonCompetitorCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonCompetitorCardComponent, "symphiq-skeleton-competitor-card", never, { "viewMode": { "alias": "viewMode"; "required": false; }; }, {}, never, never, true, never>;
+}
+
 declare const FUNNEL_ANALYSIS: FunnelAnalysisInterface;
 
+declare const BUSINESS_PROFILE: ProfileInterface;
+declare const RCC_BUSINESS_PROFILE: ProfileInterface;
+declare const HAMMETON_BUSINESS_PROFILE: ProfileInterface;
+
 /**
  * Shared Theme Color Utilities
  *
@@ -1812,6 +2723,23 @@ declare function getStatusDotClasses(status: string, viewMode: ViewModeEnum): st
  */
 declare function getTrendClasses(trendPercent: number, viewMode: ViewModeEnum): string;
 
-export { AreaChartComponent, BarChartComponent, BreakdownSectionComponent, ChartContainerComponent, ChartThemeService, CompetitivePositioningSummaryComponent, FUNNEL_ANALYSIS, FunnelOrderService, InsightCardComponent, LineChartComponent, MetricCardComponent, MetricFormatterService, MobileBottomNavComponent, MobileFABComponent, ModalComponent, ModalService, OverallAssessmentComponent, PieChartComponent, SkeletonLoaderComponent, SymphiqFunnelAnalysisDashboardComponent, SymphiqFunnelAnalysisPreviewComponent, TooltipContainerComponent, TooltipDataService, TooltipDirective, TooltipService, ViewModeService, getBadgeLabelClasses, getButtonClasses, getCompetitiveBadgeClasses, getContainerClasses, getFooterClasses, getGradeBadgeClasses, getHeaderClasses, getInsightsBadgeClasses, getInsightsCardClasses, getMetricLabelClasses, getMetricMiniCardClasses, getMetricValueClasses, getNarrativeTextClasses, getRevenueCardClasses, getRevenueIconClasses, getStatusBadgeClasses, getStatusDotClasses, getStatusIconClasses, getStatusSummaryClasses, getSubtitleClasses, getTitleClasses, getTrendClasses, getTrendIconClasses, getTrendValueClasses, isLightMode };
-export type { ChartThemeColors, FunnelMetricOrder, GestureDetail, LayoutMode, Metric, ModalState, NavSection, ScrollBaseCustomEvent, ScrollBaseDetail, ScrollCustomEvent, ScrollDetail, SemanticColors, ThemeColorContext, ThemeMode, TooltipPosition, TooltipState, TooltipType, ViewMode, ViewportBounds };
+/**
+ * Utility for generating consistent colors for dynamic category badges
+ */
+interface CategoryColorPalette {
+    light: string;
+    dark: string;
+}
+/**
+ * Gets a consistent color palette for a given category
+ * Same category will always return the same color
+ */
+declare function getCategoryColor(category: string): CategoryColorPalette;
+/**
+ * Gets the appropriate color classes for a category badge
+ */
+declare function getCategoryBadgeClasses(category: string, isDark: boolean): string;
+
+export { AreaChartComponent, BUSINESS_PROFILE, BarChartComponent, BreakdownSectionComponent, BusinessAnalysisModalComponent, BusinessProfileSearchService, ChartContainerComponent, ChartThemeService, CircularProgressComponent, CompetitivePositioningSummaryComponent, CompetitorAnalysisCardComponent, FUNNEL_ANALYSIS, FloatingBackButtonComponent, FloatingTocComponent, FocusAreaDetailCardComponent, FunnelOrderService, HAMMETON_BUSINESS_PROFILE, HeaderScrollService, HierarchyDisplayComponent, HorizontalBarComponent, IconService, InsightCardComponent, LineChartComponent, MetricCardComponent, MetricFormatterService, MobileBottomNavComponent, MobileFABComponent, ModalComponent, ModalService, NapkinVisualPlaceholderComponent, NavigationStateService, OpportunityHighlightBannerComponent, OverallAssessmentComponent, PieChartComponent, ProfileItemCardComponent, ProfileSectionComponent, ProfileSubsectionComponent, RCC_BUSINESS_PROFILE, ScrollDepthService, ScrollProgressBarComponent, SearchButtonComponent, SearchModalComponent, SectionDividerComponent, SectionNavigationComponent, ShadowElevationDirective, SkeletonBarComponent, SkeletonCardBaseComponent, SkeletonCircleComponent, SkeletonCompetitorCardComponent, SkeletonCustomerSegmentCardComponent, SkeletonFocusAreaCardComponent, SkeletonGenericCardComponent, SkeletonLoaderComponent, SkeletonPriceTierCardComponent, SkeletonProductCategoryCardComponent, SkeletonRegionCardComponent, SkeletonSeasonCardComponent, SymphiqBusinessAnalysisDashboardComponent, SymphiqFunnelAnalysisDashboardComponent, SymphiqFunnelAnalysisPreviewComponent, SymphiqIconComponent, TooltipContainerComponent, TooltipDataService, TooltipDirective, TooltipService, ViewModeService, ViewportAnimationDirective, VisualizationContainerComponent, getBadgeLabelClasses, getButtonClasses, getCategoryBadgeClasses, getCategoryColor, getCompetitiveBadgeClasses, getContainerClasses, getFooterClasses, getGradeBadgeClasses, getHeaderClasses, getInsightsBadgeClasses, getInsightsCardClasses, getMetricLabelClasses, getMetricMiniCardClasses, getMetricValueClasses, getNarrativeTextClasses, getRevenueCardClasses, getRevenueIconClasses, getStatusBadgeClasses, getStatusDotClasses, getStatusIconClasses, getStatusSummaryClasses, getSubtitleClasses, getTitleClasses, getTrendClasses, getTrendIconClasses, getTrendValueClasses, isLightMode };
+export type { AnimationType, BusinessSearchResult, CategoryColorPalette, ChartThemeColors, FunnelMetricOrder, HeaderScrollConfig, LayoutMode, Metric, ModalState, NavSection, NavigationState, ScrollBaseCustomEvent, ScrollBaseDetail, ScrollCustomEvent, ScrollDepthInfo, ScrollDetail, SemanticColors, ShadowLevel, ThemeColorContext, ThemeMode, TooltipPosition, TooltipState, TooltipType, ViewMode, ViewportBounds, VisualizationData, VisualizationType };
 //# sourceMappingURL=index.d.ts.map