@eric-emg/symphiq-components 1.2.48 → 1.2.50

package/fesm2022/symphiq-components.mjs

@@ -21426,7 +21426,11 @@ class SymphiqFunnelAnalysisDashboardComponent {
         }, ...(ngDevMode ? [{ debugName: "chartsById" }] : []));
         // Pre-computed styling classes
         this.headerClass = computed(() => {
-            return 'bg-transparent transition-all duration-300';
+            const isLight = this.isLightMode();
+            const baseClasses = isLight
+                ? 'bg-white/90 backdrop-blur-sm'
+                : 'bg-slate-900/80 backdrop-blur-sm';
+            return `${baseClasses} transition-all duration-300`;
         }, ...(ngDevMode ? [{ debugName: "headerClass" }] : []));
         this.headerTitleClass = computed(() => this.isLightMode() ? 'text-slate-900' : 'text-white', ...(ngDevMode ? [{ debugName: "headerTitleClass" }] : []));
         this.headerSubtitleClass = computed(() => this.isLightMode() ? 'text-slate-600' : 'text-slate-400', ...(ngDevMode ? [{ debugName: "headerSubtitleClass" }] : []));
@@ -21600,26 +21604,39 @@ class SymphiqFunnelAnalysisDashboardComponent {
         // Handle scroll events from parent
         effect(() => {
             const scrollEvent = this.scrollEvent();
-            if (!scrollEvent || !this.embedded()) {
+            const isEmbedded = this.embedded();
+            console.log('[SCROLL v6] Effect triggered', {
+                hasScrollEvent: !!scrollEvent,
+                isEmbedded,
+                scrollEventType: scrollEvent?.type,
+                scrollEventDetail: scrollEvent?.detail
+            });
+            if (!scrollEvent) {
+                console.log('[SCROLL v6] No scroll event provided');
+                return;
+            }
+            if (!isEmbedded) {
+                console.log('[SCROLL v6] Not in embedded mode, ignoring scroll event');
                 return;
             }
             const detail = scrollEvent.detail;
             if (!detail) {
+                console.log('[SCROLL v6] No detail in scroll event');
                 return;
             }
             const scrollTop = detail.scrollTop || 0;
-            console.log('[SCROLL v6] Scroll event from parent', {
+            const scrollLeft = detail.scrollLeft || 0;
+            const isScrolling = detail.isScrolling;
+            console.log('[SCROLL v6] Processing scroll event', {
                 scrollTop,
-                currentState: this.isScrolled()
+                scrollLeft,
+                isScrolling,
+                currentHeaderState: this.isScrolled(),
+                isProgrammaticScroll: this.isProgrammaticScroll
             });
-            // Update scroll progress
-            const scrollHeight = detail.scrollHeight || 0;
-            const clientHeight = detail.clientHeight || 0;
-            const maxScroll = scrollHeight - clientHeight;
-            const progress = maxScroll > 0 ? (scrollTop / maxScroll) * 100 : 0;
-            this.scrollProgress.set(Math.min(100, Math.max(0, progress)));
             // Skip during programmatic scrolling
             if (this.isProgrammaticScroll) {
+                console.log('[SCROLL v6] Skipping - programmatic scroll in progress');
                 return;
             }
             // Simple threshold-based state changes with hysteresis
@@ -21627,13 +21644,21 @@ class SymphiqFunnelAnalysisDashboardComponent {
             const EXPAND_THRESHOLD = 30;
             const currentState = this.isScrolled();
             if (!currentState && scrollTop > COLLAPSE_THRESHOLD) {
-                console.log('[SCROLL v6] Collapsing header', { scrollTop });
+                console.log('[SCROLL v6] ✓ COLLAPSING HEADER', { scrollTop, threshold: COLLAPSE_THRESHOLD });
                 this.isScrolled.set(true);
             }
             else if (currentState && scrollTop < EXPAND_THRESHOLD) {
-                console.log('[SCROLL v6] Expanding header', { scrollTop });
+                console.log('[SCROLL v6] ✓ EXPANDING HEADER', { scrollTop, threshold: EXPAND_THRESHOLD });
                 this.isScrolled.set(false);
             }
+            else {
+                console.log('[SCROLL v6] No state change needed', {
+                    currentState: currentState ? 'collapsed' : 'expanded',
+                    scrollTop,
+                    collapseThreshold: COLLAPSE_THRESHOLD,
+                    expandThreshold: EXPAND_THRESHOLD
+                });
+            }
         });
         // Manage loading state with minimum display time
         effect(() => {
@@ -23270,7 +23295,7 @@ class SymphiqFunnelAnalysisDashboardComponent {
             type: HostListener,
             args: ['window:scroll', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqFunnelAnalysisDashboardComponent, { className: "SymphiqFunnelAnalysisDashboardComponent", filePath: "lib/components/funnel-analysis-dashboard/symphiq-funnel-analysis-dashboard.component.ts", lineNumber: 1010 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqFunnelAnalysisDashboardComponent, { className: "SymphiqFunnelAnalysisDashboardComponent", filePath: "lib/components/funnel-analysis-dashboard/symphiq-funnel-analysis-dashboard.component.ts", lineNumber: 1027 }); })();
 
 /**
  * Shared Theme Color Utilities