@ethlete/cdk 5.0.0-next.1 → 5.0.0-next.3

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @ethlete/cdk
 
+## 5.0.0-next.3
+
+### Patch Changes
+
+- [`58525cd`](https://github.com/ethlete-io/ethdk/commit/58525cd7123c8e20739b0841b2f0abf5920296f1) Thanks [@TomTomB](https://github.com/TomTomB)! - Fix scroll blocking getting applied even if the page is currently not scrollable
+
+## 5.0.0-next.2
+
+### Patch Changes
+
+- [`95e656d`](https://github.com/ethlete-io/ethdk/commit/95e656d036368a48cbd17a399f7c0c61c49ab0fa) Thanks [@TomTomB](https://github.com/TomTomB)! - Fix overlay origin not getting inferred correctly
+
+- [`95e656d`](https://github.com/ethlete-io/ethdk/commit/95e656d036368a48cbd17a399f7c0c61c49ab0fa) Thanks [@TomTomB](https://github.com/TomTomB)! - Fix scroll blocker getting stuck in blocked state
+
 ## 5.0.0-next.1
 
 ### Patch Changes

package/fesm2022/ethlete-cdk.mjs

@@ -9,7 +9,7 @@ import { map, switchMap, combineLatest, pairwise, tap, BehaviorSubject, filter,
 import { __decorate, __metadata } from 'tslib';
 import { AsyncPipe, NgComponentOutlet, Location, NgTemplateOutlet, NgClass, DOCUMENT as DOCUMENT$1, NgStyle } from '@angular/common';
 import * as i1$1 from '@ethlete/core';
-import { createComponentId, injectRenderer, IS_EMAIL, MUST_MATCH, IS_ARRAY_NOT_EMPTY, AT_LEAST_ONE_REQUIRED, createDestroy, equal, signalHostClasses, signalAttributes, signalHostAttributes, switchQueryListChanges, controlValueSignal, fromNextFrame, elementCanScroll, AnimatedLifecycleDirective, forceReflow, nextFrame, createRootProvider, injectBreakpointObserver, THEME_PROVIDER, ProvideThemeDirective, BOUNDARY_ELEMENT_TOKEN, signalElementScrollState, signalElementIntersection, isElementVisible, provideBoundaryElement, applyHostListener, injectBoundaryElement, ANIMATED_LIFECYCLE_TOKEN, cloneFormGroup, getFormGroupValue, injectQueryParam, injectRoute, AnimatedIfDirective, injectObserveBreakpoint, syncSignal, injectAngularRootElement, writeScrollbarSizeToCssVariables, createStaticRootProvider, AnimatedOverlayDirective, setInputSignal, signalElementMutations, signalElementDimensions, createIsRenderedSignal, createCanAnimateSignal, useCursorDragScroll, signalElementChildren, signalClasses, signalHostStyles, signalStyles, getElementScrollCoordinates, injectTemplateRef, signalHostElementScrollState, signalHostElementDimensions, createProvider, previousSignalValue, injectHostElement, signalHostElementIntersection, createFlipAnimation, isObject, getObjectProperty, RuntimeError, KeyPressManager, scrollToElement, ClickOutsideDirective, clamp, injectFocusVisibleTracker, inferMimeType, applyHostListeners, TypedQueryList } from '@ethlete/core';
+import { createComponentId, injectRenderer, IS_EMAIL, MUST_MATCH, IS_ARRAY_NOT_EMPTY, AT_LEAST_ONE_REQUIRED, createDestroy, equal, signalHostClasses, signalAttributes, signalHostAttributes, switchQueryListChanges, controlValueSignal, fromNextFrame, elementCanScroll, AnimatedLifecycleDirective, forceReflow, nextFrame, createRootProvider, injectBreakpointObserver, THEME_PROVIDER, ProvideThemeDirective, BOUNDARY_ELEMENT_TOKEN, signalElementScrollState, signalElementIntersection, isElementVisible, provideBoundaryElement, applyHostListener, injectBoundaryElement, ANIMATED_LIFECYCLE_TOKEN, cloneFormGroup, getFormGroupValue, injectQueryParam, injectRoute, AnimatedIfDirective, injectObserveBreakpoint, syncSignal, createDocumentElementSignal, createStaticRootProvider, AnimatedOverlayDirective, setInputSignal, signalElementMutations, signalElementDimensions, createIsRenderedSignal, createCanAnimateSignal, useCursorDragScroll, signalElementChildren, signalClasses, signalHostStyles, signalStyles, getElementScrollCoordinates, injectTemplateRef, signalHostElementScrollState, signalHostElementDimensions, createProvider, previousSignalValue, injectHostElement, signalHostElementIntersection, createFlipAnimation, isObject, getObjectProperty, RuntimeError, KeyPressManager, scrollToElement, ClickOutsideDirective, clamp, injectFocusVisibleTracker, inferMimeType, applyHostListeners, TypedQueryList } from '@ethlete/core';
 import * as i1$5 from '@angular/cdk/a11y';
 import { FocusMonitor, FocusKeyManager, AriaDescriber, A11yModule } from '@angular/cdk/a11y';
 import { AutofillMonitor } from '@angular/cdk/text-field';
@@ -5508,7 +5508,7 @@ const getOriginCoordinatesAndDimensions = (origin) => {
             y: rect.top + rect.height / 2,
             width: rect.width,
             height: rect.height,
-            element: target,
+            element: relevantElement,
         };
     }
     return null;
@@ -7703,43 +7703,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
 const [provideOverlayScrollBlocker, injectOverlayScrollBlocker] = createRootProvider(() => {
     const overlayManager = injectOverlayManager();
     const document = inject(DOCUMENT);
-    const angularRoot = injectAngularRootElement();
     const renderer = injectRenderer();
+    const documentScrollState = signalElementScrollState(createDocumentElementSignal());
     const root = document.documentElement;
-    let isEnabled = false;
-    writeScrollbarSizeToCssVariables();
-    combineLatest({
-        hasOpenOverlays: toObservable(overlayManager.hasOpenOverlays),
-        angularRoot: toObservable(angularRoot),
-    })
-        .pipe(switchMap((data) => {
-        if (!data.hasOpenOverlays || !data.angularRoot)
-            return of(data);
-        return fromEvent(window, 'resize').pipe(startWith(data), map(() => data));
-    }), tap(({ hasOpenOverlays, angularRoot }) => {
-        if (!angularRoot)
-            return;
-        if (hasOpenOverlays && elementCanScroll(root)) {
-            if (isEnabled)
-                return;
-            renderer.setStyle(angularRoot, {
-                contain: 'content',
-            });
+    let savedTop = null;
+    combineLatest([toObservable(overlayManager.hasOpenOverlays), toObservable(documentScrollState)])
+        .pipe(tap(([hasOpenOverlays, scrollState]) => {
+        if (hasOpenOverlays && scrollState.canScrollVertically && savedTop === null) {
+            savedTop = document.defaultView?.scrollY ?? 0;
             renderer.setStyle(root, {
-                'padding-inline-end': 'var(--et-sw)',
-                overflow: 'hidden',
+                position: 'fixed',
+                top: `-${savedTop}px`,
+                left: '0',
+                right: '0',
+                'overflow-y': 'scroll',
             });
-            isEnabled = true;
         }
-        else if (!hasOpenOverlays && isEnabled) {
+        else if (!hasOpenOverlays && savedTop !== null) {
+            const top = savedTop;
+            savedTop = null;
             renderer.setStyle(root, {
-                overflow: null,
-                'padding-inline-end': null,
-            });
-            renderer.setStyle(angularRoot, {
-                contain: null,
+                position: null,
+                top: null,
+                left: null,
+                right: null,
+                'overflow-y': null,
+                'scroll-behavior': 'auto',
             });
-            isEnabled = false;
+            document.defaultView?.scrollTo(0, top);
+            renderer.setStyle(root, { 'scroll-behavior': null });
         }
     }), takeUntilDestroyed())
         .subscribe();