From 1975d56e45a4cc0d3f272ad31cb081b91a1b0d1d Mon Sep 17 00:00:00 2001 From: Nikola Anachkov <87311182+NakataCode@users.noreply.github.com> Date: Mon, 6 Jan 2025 16:23:32 +0200 Subject: [PATCH] fix(ui5-dynamic-page): update header sticky on manual snap (#10431) Prevent header glitch when unsnapping after manual snap and scroll When the header was manually snapped before scrolling, the sticky area state wasn't properly updated, causing visual glitches during unsnap. Fixes: #10430 --- packages/fiori/src/DynamicPage.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/fiori/src/DynamicPage.ts b/packages/fiori/src/DynamicPage.ts index 76dce5a4b06e..fbd6932ba11b 100644 --- a/packages/fiori/src/DynamicPage.ts +++ b/packages/fiori/src/DynamicPage.ts @@ -326,6 +326,10 @@ class DynamicPage extends UI5Element { const headerHeight = this.dynamicPageHeader.getBoundingClientRect().height; const lastHeaderSnapped = this._headerSnapped; + if (this._headerSnapped && scrollTop > headerHeight) { + this.showHeaderInStickArea = false; + } + const shouldSnap = !this._headerSnapped && scrollTop > headerHeight + SCROLL_THRESHOLD; const shouldExpand = this._headerSnapped && (scrollTop < headerHeight - SCROLL_THRESHOLD || (!scrollTop && !headerHeight));