diff --git a/changelog.md b/changelog.md index 8c9ac18..471c355 100644 --- a/changelog.md +++ b/changelog.md @@ -1,5 +1,12 @@ # Changelog +## 2026-01-03 - 3.29.3 - fix(elements/appui) +prevent scroll chaining on app UI components by adding overscroll-behavior: contain + +- Added CSS overscroll-behavior: contain to activity log, main menu, secondary menu, profile dropdown, and tabs components to prevent scroll chaining and unintended body scrolling on touch/trackpad. +- Styling-only change; no public API or behavioral changes beyond scroll handling. +- Bump patch version from 3.29.2 to 3.29.3. + ## 2026-01-03 - 3.29.2 - fix(dees-appui) set min-height: 0 on .maingrid > dees-appui-maincontent to prevent layout overflow in flex container diff --git a/ts_web/00_commitinfo_data.ts b/ts_web/00_commitinfo_data.ts index 16aadb4..e6e6771 100644 --- a/ts_web/00_commitinfo_data.ts +++ b/ts_web/00_commitinfo_data.ts @@ -3,6 +3,6 @@ */ export const commitinfo = { name: '@design.estate/dees-catalog', - version: '3.29.2', + version: '3.29.3', description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.' } diff --git a/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts b/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts index 398aa5a..af86c12 100644 --- a/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts +++ b/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts @@ -122,6 +122,7 @@ export class DeesAppuiActivitylog extends DeesElement implements IActivityLogAPI width: 100%; padding: 8px 0; overflow-y: auto; + overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: ${cssManager.bdTheme('#d4d4d4', '#333333')} transparent; } diff --git a/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts b/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts index eb09738..033c4c8 100644 --- a/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts +++ b/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts @@ -164,6 +164,7 @@ export class DeesAppuiMainmenu extends DeesElement { flex: 1; overflow-y: auto; overflow-x: hidden; + overscroll-behavior: contain; padding: 8px 0; } diff --git a/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts b/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts index 22e177e..cc9c5a0 100644 --- a/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts +++ b/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts @@ -285,6 +285,7 @@ export class DeesAppuiProfileDropdown extends DeesElement { max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow-y: auto; + overscroll-behavior: contain; } :host([isopen]) .dropdown { diff --git a/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts b/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts index 3e40f39..a42a1e1 100644 --- a/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts +++ b/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts @@ -201,6 +201,7 @@ export class DeesAppuiSecondarymenu extends DeesElement { flex: 1; overflow-y: auto; overflow-x: hidden; + overscroll-behavior: contain; padding: 8px 0; } diff --git a/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts b/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts index 3cdcef6..4ce2426 100644 --- a/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts +++ b/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts @@ -116,6 +116,7 @@ export class DeesAppuiTabs extends DeesElement { font-size: 14px; overflow-x: auto; overflow-y: hidden; + overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: transparent transparent; height: 100%;