Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| ba4aa912af | |||
| ca4f994b55 | |||
| 74844492eb | |||
| c42cedbf94 | |||
| 749725f091 | |||
| f3a8ad057a |
BIN
.playwright-mcp/after-scroll.png
Normal file
BIN
.playwright-mcp/after-scroll.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 125 KiB |
BIN
.playwright-mcp/scroll-containment-check.png
Normal file
BIN
.playwright-mcp/scroll-containment-check.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 125 KiB |
19
changelog.md
19
changelog.md
@@ -1,5 +1,24 @@
|
|||||||
# Changelog
|
# 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
|
||||||
|
|
||||||
|
- Added min-height: 0 to .maingrid > dees-appui-maincontent in ts_web/elements/00group-appui/dees-appui/dees-appui.ts to prevent unwanted growth/overflow when used inside a flex container.
|
||||||
|
- Pure CSS/layout fix — no API or behavior changes to components.
|
||||||
|
|
||||||
|
## 2026-01-03 - 3.29.1 - fix(dees-appui)
|
||||||
|
prevent main grid overflow by adding overflow:hidden; and add Playwright scroll containment screenshots
|
||||||
|
|
||||||
|
- Add overflow: hidden to .maingrid in ts_web/elements/00group-appui/dees-appui/dees-appui.ts to prevent content from escaping during grid-template-columns transitions.
|
||||||
|
- Add Playwright artifacts: .playwright-mcp/after-scroll.png and .playwright-mcp/scroll-containment-check.png (screenshots for scroll containment testing).
|
||||||
|
|
||||||
## 2026-01-03 - 3.29.0 - feat(docs)
|
## 2026-01-03 - 3.29.0 - feat(docs)
|
||||||
add documentation for new input components, activity log features, theming, and expand DeesAppui docs
|
add documentation for new input components, activity log features, theming, and expand DeesAppui docs
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@design.estate/dees-catalog",
|
"name": "@design.estate/dees-catalog",
|
||||||
"version": "3.29.0",
|
"version": "3.29.3",
|
||||||
"private": false,
|
"private": false,
|
||||||
"description": "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.",
|
"description": "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.",
|
||||||
"main": "dist_ts_web/index.js",
|
"main": "dist_ts_web/index.js",
|
||||||
|
|||||||
@@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@design.estate/dees-catalog',
|
name: '@design.estate/dees-catalog',
|
||||||
version: '3.29.0',
|
version: '3.29.3',
|
||||||
description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
|
description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -122,6 +122,7 @@ export class DeesAppuiActivitylog extends DeesElement implements IActivityLogAPI
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8px 0;
|
padding: 8px 0;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
overscroll-behavior: contain;
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
scrollbar-color: ${cssManager.bdTheme('#d4d4d4', '#333333')} transparent;
|
scrollbar-color: ${cssManager.bdTheme('#d4d4d4', '#333333')} transparent;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -164,6 +164,7 @@ export class DeesAppuiMainmenu extends DeesElement {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
overscroll-behavior: contain;
|
||||||
padding: 8px 0;
|
padding: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -285,6 +285,7 @@ export class DeesAppuiProfileDropdown extends DeesElement {
|
|||||||
max-width: calc(100vw - 32px);
|
max-width: calc(100vw - 32px);
|
||||||
max-height: calc(100vh - 32px);
|
max-height: calc(100vh - 32px);
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
overscroll-behavior: contain;
|
||||||
}
|
}
|
||||||
|
|
||||||
:host([isopen]) .dropdown {
|
:host([isopen]) .dropdown {
|
||||||
|
|||||||
@@ -201,6 +201,7 @@ export class DeesAppuiSecondarymenu extends DeesElement {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
overscroll-behavior: contain;
|
||||||
padding: 8px 0;
|
padding: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -116,6 +116,7 @@ export class DeesAppuiTabs extends DeesElement {
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
|
overscroll-behavior: contain;
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
scrollbar-color: transparent transparent;
|
scrollbar-color: transparent transparent;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|||||||
@@ -185,6 +185,7 @@ export class DeesAppui extends DeesElement {
|
|||||||
/* grid-template-columns set dynamically in template */
|
/* grid-template-columns set dynamically in template */
|
||||||
grid-template-rows: 1fr;
|
grid-template-rows: 1fr;
|
||||||
transition: grid-template-columns 0.3s ease;
|
transition: grid-template-columns 0.3s ease;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Z-index layering for proper stacking */
|
/* Z-index layering for proper stacking */
|
||||||
@@ -201,6 +202,7 @@ export class DeesAppui extends DeesElement {
|
|||||||
.maingrid > dees-appui-maincontent {
|
.maingrid > dees-appui-maincontent {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
min-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maingrid > dees-appui-activitylog {
|
.maingrid > dees-appui-activitylog {
|
||||||
|
|||||||
@@ -257,12 +257,13 @@ export class DeesIcon extends DeesElement {
|
|||||||
* @returns Object with type and name properties
|
* @returns Object with type and name properties
|
||||||
*/
|
*/
|
||||||
private parseIconString(iconStr: string): { type: 'fa' | 'lucide', name: string } {
|
private parseIconString(iconStr: string): { type: 'fa' | 'lucide', name: string } {
|
||||||
if (iconStr.startsWith('fa:')) {
|
const lowerStr = iconStr.toLowerCase();
|
||||||
|
if (lowerStr.startsWith('fa:')) {
|
||||||
return {
|
return {
|
||||||
type: 'fa',
|
type: 'fa',
|
||||||
name: iconStr.substring(3) // Remove 'fa:' prefix
|
name: iconStr.substring(3) // Remove 'fa:' prefix
|
||||||
};
|
};
|
||||||
} else if (iconStr.startsWith('lucide:')) {
|
} else if (lowerStr.startsWith('lucide:')) {
|
||||||
return {
|
return {
|
||||||
type: 'lucide',
|
type: 'lucide',
|
||||||
name: iconStr.substring(7) // Remove 'lucide:' prefix
|
name: iconStr.substring(7) // Remove 'lucide:' prefix
|
||||||
|
|||||||
Reference in New Issue
Block a user