@eric-emg/symphiq-components 1.2.512 → 1.2.514

package/fesm2022/symphiq-components.mjs

@@ -1958,6 +1958,32 @@ class HeaderScrollService {
             this.log('Ignored: programmatic scroll', { scrollPosition });
             return;
         }
+        const scrollDelta = scrollPosition - this.lastScrollPosition;
+        const absScrollDelta = Math.abs(scrollDelta);
+        this.lastScrollPosition = scrollPosition;
+        const currentState = this.isScrolled();
+        let desiredState = currentState;
+        if (!currentState && scrollPosition > this.config.collapseThreshold) {
+            desiredState = true;
+        }
+        else if (currentState && scrollPosition < this.config.expandThreshold) {
+            desiredState = false;
+        }
+        if (currentState === desiredState) {
+            return;
+        }
+        const isFastScroll = absScrollDelta > 30;
+        const isWellPastThreshold = !currentState && scrollPosition > this.config.collapseThreshold * 2;
+        const fastScrollBypass = isFastScroll && isWellPastThreshold && desiredState;
+        if (fastScrollBypass) {
+            this.log('Fast scroll bypass triggered', { scrollPosition, absScrollDelta });
+            if (this.scrollTimeout) {
+                clearTimeout(this.scrollTimeout);
+                this.scrollTimeout = null;
+            }
+            this.applyStateChange(desiredState);
+            return;
+        }
         const timeSinceLastChange = now - this.lastStateChangeTime;
         if (timeSinceLastChange < this.config.stateChangeCooldown) {
             this.log('Ignored: cooldown active', {
@@ -1967,8 +1993,6 @@ class HeaderScrollService {
             });
             return;
         }
-        const scrollDelta = scrollPosition - this.lastScrollPosition;
-        const absScrollDelta = Math.abs(scrollDelta);
         const newDirection = scrollDelta > 2 ? 'down' : scrollDelta < -2 ? 'up' : 'none';
         if (newDirection !== 'none') {
             if (newDirection === this.scrollDirection) {
@@ -1985,18 +2009,6 @@ class HeaderScrollService {
         else {
             this.scrollStabilityCount = 0;
         }
-        this.lastScrollPosition = scrollPosition;
-        const currentState = this.isScrolled();
-        let desiredState = currentState;
-        if (!currentState && scrollPosition > this.config.collapseThreshold) {
-            desiredState = true;
-        }
-        else if (currentState && scrollPosition < this.config.expandThreshold) {
-            desiredState = false;
-        }
-        if (currentState === desiredState) {
-            return;
-        }
         const isStable = this.scrollStabilityCount >= this.STABILITY_THRESHOLD;
         const hasConsistentDirection = this.consecutiveDirectionCount >= 3;
         const directionMatchesIntent = (desiredState && this.scrollDirection === 'down') ||
@@ -2086,18 +2098,70 @@ class HeaderScrollService {
             this.scrollTimeout = null;
         }
     }
+    applyStateChange(desiredState) {
+        this.stateChangeCount++;
+        this.log('STATE CHANGE #' + this.stateChangeCount, {
+            from: this.isScrolled() ? 'collapsed' : 'expanded',
+            to: desiredState ? 'collapsed' : 'expanded',
+            scrollPosition: window.scrollY,
+            willCompensate: desiredState
+        });
+        this.isProgrammaticScroll = true;
+        this.isScrolled.set(desiredState);
+        this.lastStateChangeTime = Date.now();
+        this.scrollStabilityCount = 0;
+        this.consecutiveDirectionCount = 0;
+        if (desiredState) {
+            const beforeScroll = window.scrollY;
+            window.scrollBy(0, this.HEADER_HEIGHT_DIFF);
+            this.log('Scroll compensation applied', {
+                before: beforeScroll,
+                after: window.scrollY,
+                compensation: this.HEADER_HEIGHT_DIFF
+            });
+        }
+        setTimeout(() => {
+            this.isProgrammaticScroll = false;
+            this.lastScrollPosition = window.scrollY;
+            this.log('Programmatic scroll lock released', { scrollPosition: window.scrollY });
+        }, 400);
+    }
     handleEmbeddedScroll(scrollTop, collapseThreshold, expandThreshold) {
         const now = Date.now();
         if (this.isProgrammaticScroll) {
             this.log('Embedded ignored: programmatic scroll', { scrollTop });
             return;
         }
+        const scrollDelta = scrollTop - this.lastScrollPosition;
+        const absScrollDelta = Math.abs(scrollDelta);
+        this.lastScrollPosition = scrollTop;
+        const currentState = this.isScrolled();
+        let desiredState = currentState;
+        if (!currentState && scrollTop > collapseThreshold) {
+            desiredState = true;
+        }
+        else if (currentState && scrollTop < expandThreshold) {
+            desiredState = false;
+        }
+        if (currentState === desiredState) {
+            return;
+        }
+        const isFastScroll = absScrollDelta > 30;
+        const isWellPastThreshold = !currentState && scrollTop > collapseThreshold * 2;
+        const fastScrollBypass = isFastScroll && isWellPastThreshold && desiredState;
+        if (fastScrollBypass) {
+            this.log('Fast scroll bypass triggered', { scrollTop, absScrollDelta, collapseThreshold });
+            if (this.scrollTimeout) {
+                clearTimeout(this.scrollTimeout);
+                this.scrollTimeout = null;
+            }
+            this.applyEmbeddedStateChange(desiredState, scrollTop);
+            return;
+        }
         const timeSinceLastChange = now - this.lastStateChangeTime;
         if (timeSinceLastChange < this.config.stateChangeCooldown) {
             return;
         }
-        const scrollDelta = scrollTop - this.lastScrollPosition;
-        const absScrollDelta = Math.abs(scrollDelta);
         const newDirection = scrollDelta > 2 ? 'down' : scrollDelta < -2 ? 'up' : 'none';
         if (newDirection !== 'none') {
             if (newDirection === this.scrollDirection) {
@@ -2114,18 +2178,6 @@ class HeaderScrollService {
         else {
             this.scrollStabilityCount = 0;
         }
-        this.lastScrollPosition = scrollTop;
-        const currentState = this.isScrolled();
-        let desiredState = currentState;
-        if (!currentState && scrollTop > collapseThreshold) {
-            desiredState = true;
-        }
-        else if (currentState && scrollTop < expandThreshold) {
-            desiredState = false;
-        }
-        if (currentState === desiredState) {
-            return;
-        }
         const isStable = this.scrollStabilityCount >= this.STABILITY_THRESHOLD;
         const hasConsistentDirection = this.consecutiveDirectionCount >= 3;
         const directionMatchesIntent = (desiredState && this.scrollDirection === 'down') ||
@@ -2163,23 +2215,26 @@ class HeaderScrollService {
             if (finalCurrentState === finalDesiredState) {
                 return;
             }
-            this.stateChangeCount++;
-            this.log('EMBEDDED STATE CHANGE #' + this.stateChangeCount, {
-                from: finalCurrentState ? 'collapsed' : 'expanded',
-                to: finalDesiredState ? 'collapsed' : 'expanded',
-                scrollTop
-            });
-            this.isProgrammaticScroll = true;
-            this.isScrolled.set(finalDesiredState);
-            this.lastStateChangeTime = Date.now();
-            this.scrollStabilityCount = 0;
-            this.consecutiveDirectionCount = 0;
-            setTimeout(() => {
-                this.isProgrammaticScroll = false;
-                this.lastScrollPosition = scrollTop;
-            }, 400);
+            this.applyEmbeddedStateChange(finalDesiredState, scrollTop);
         }, this.config.debounceDelay);
     }
+    applyEmbeddedStateChange(desiredState, scrollTop) {
+        this.stateChangeCount++;
+        this.log('EMBEDDED STATE CHANGE #' + this.stateChangeCount, {
+            from: this.isScrolled() ? 'collapsed' : 'expanded',
+            to: desiredState ? 'collapsed' : 'expanded',
+            scrollTop
+        });
+        this.isProgrammaticScroll = true;
+        this.isScrolled.set(desiredState);
+        this.lastStateChangeTime = Date.now();
+        this.scrollStabilityCount = 0;
+        this.consecutiveDirectionCount = 0;
+        setTimeout(() => {
+            this.isProgrammaticScroll = false;
+            this.lastScrollPosition = scrollTop;
+        }, 400);
+    }
     static { this.ɵfac = function HeaderScrollService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || HeaderScrollService)(); }; }
     static { this.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: HeaderScrollService, factory: HeaderScrollService.ɵfac, providedIn: 'root' }); }
 }
@@ -96868,7 +96923,7 @@ class SymphiqProfileFocusAreasAnalysesDashboardComponent {
             type: HostListener,
             args: ['window:scroll', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqProfileFocusAreasAnalysesDashboardComponent, { className: "SymphiqProfileFocusAreasAnalysesDashboardComponent", filePath: "lib/components/profile-analyses-focus-areas-dashboard/symphiq-profile-focus-areas-analyses-dashboard.component.ts", lineNumber: 679 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SymphiqProfileFocusAreasAnalysesDashboardComponent, { className: "SymphiqProfileFocusAreasAnalysesDashboardComponent", filePath: "lib/components/profile-analyses-focus-areas-dashboard/symphiq-profile-focus-areas-analyses-dashboard.component.ts", lineNumber: 682 }); })();
 
 const _c0$6 = () => [];
 function SymphiqProfileFocusAreaDashboardComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {