Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b8a03def79 | |||
| 2b6798083d |
@@ -1,5 +1,12 @@
|
||||
# Changelog
|
||||
|
||||
## 2026-04-12 - 3.74.2 - fix(modal,tile,input-text)
|
||||
move scroll handling from tile content to modal and update input text demo to use changeSubject subscriptions
|
||||
|
||||
- bump @design.estate/dees-wcctools from ^3.8.2 to ^3.8.4
|
||||
- set dees-tile content overflow to hidden and apply scroll styling through dees-modal part selectors
|
||||
- simplify the interactive dees-input-text demo by subscribing directly to changeSubject for live value updates
|
||||
|
||||
## 2026-04-12 - 3.74.1 - fix(dees-input-text)
|
||||
adjust password toggle and validation icon alignment in text input
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@design.estate/dees-catalog",
|
||||
"version": "3.74.1",
|
||||
"version": "3.74.2",
|
||||
"private": false,
|
||||
"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",
|
||||
@@ -18,7 +18,7 @@
|
||||
"dependencies": {
|
||||
"@design.estate/dees-domtools": "^2.5.4",
|
||||
"@design.estate/dees-element": "^2.2.4",
|
||||
"@design.estate/dees-wcctools": "^3.8.2",
|
||||
"@design.estate/dees-wcctools": "^3.8.4",
|
||||
"@fortawesome/fontawesome-svg-core": "^7.2.0",
|
||||
"@fortawesome/free-brands-svg-icons": "^7.2.0",
|
||||
"@fortawesome/free-regular-svg-icons": "^7.2.0",
|
||||
|
||||
12
pnpm-lock.yaml
generated
12
pnpm-lock.yaml
generated
@@ -15,8 +15,8 @@ importers:
|
||||
specifier: ^2.2.4
|
||||
version: 2.2.4
|
||||
'@design.estate/dees-wcctools':
|
||||
specifier: ^3.8.2
|
||||
version: 3.8.2
|
||||
specifier: ^3.8.4
|
||||
version: 3.8.4
|
||||
'@fortawesome/fontawesome-svg-core':
|
||||
specifier: ^7.2.0
|
||||
version: 7.2.0
|
||||
@@ -323,8 +323,8 @@ packages:
|
||||
'@design.estate/dees-element@2.2.4':
|
||||
resolution: {integrity: sha512-O9cA6flBMMd+pBwMQrZXwAWel9yVxgokolb+Em6gvkXxPJ0P/B5UDn4Vc2d4ts3ta55PTBm+l2dPeDVGx/bl7Q==}
|
||||
|
||||
'@design.estate/dees-wcctools@3.8.2':
|
||||
resolution: {integrity: sha512-A55XHeWExxxojdERAmedrZeyTGeK01ax5ct46VbjMeH65HbgBiTF4EOHfS6rjdTp+9VD3vXd0efhzyOxOS6uFw==}
|
||||
'@design.estate/dees-wcctools@3.8.4':
|
||||
resolution: {integrity: sha512-KpFK/azK+a/Xpq33pXKcho+tdFKVHhKZM5ArvHqo9QMwTczgp5DZZgowTDUuqAofjZwnuVfCPHK/Pw9e64N46A==}
|
||||
|
||||
'@emnapi/core@1.8.1':
|
||||
resolution: {integrity: sha512-AvT9QFpxK0Zd8J0jopedNm+w/2fIzvtPKPjqyw9jwvBaReTTqPBk9Hixaz7KbjimP+QNz605/XnjFcDAL2pqBg==}
|
||||
@@ -4711,7 +4711,7 @@ snapshots:
|
||||
dependencies:
|
||||
'@design.estate/dees-domtools': 2.5.4
|
||||
'@design.estate/dees-element': 2.2.4
|
||||
'@design.estate/dees-wcctools': 3.8.2
|
||||
'@design.estate/dees-wcctools': 3.8.4
|
||||
'@fortawesome/fontawesome-svg-core': 7.2.0
|
||||
'@fortawesome/free-brands-svg-icons': 7.2.0
|
||||
'@fortawesome/free-regular-svg-icons': 7.2.0
|
||||
@@ -4787,7 +4787,7 @@ snapshots:
|
||||
- supports-color
|
||||
- vue
|
||||
|
||||
'@design.estate/dees-wcctools@3.8.2':
|
||||
'@design.estate/dees-wcctools@3.8.4':
|
||||
dependencies:
|
||||
'@design.estate/dees-domtools': 2.5.4
|
||||
'@design.estate/dees-element': 2.2.4
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@design.estate/dees-catalog',
|
||||
version: '3.74.1',
|
||||
version: '3.74.2',
|
||||
description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
|
||||
}
|
||||
|
||||
@@ -284,40 +284,21 @@ export const demoFunc = () => html`
|
||||
</dees-demowrapper>
|
||||
|
||||
<dees-demowrapper .runAfterRender=${async (elementArg: HTMLElement) => {
|
||||
// Set up interactive example
|
||||
const dynamicInput = elementArg.querySelector('dees-input-text');
|
||||
const dynamicInput = elementArg.querySelector('dees-input-text') as DeesInputText;
|
||||
const output = elementArg.querySelector('#text-input-output');
|
||||
|
||||
|
||||
if (dynamicInput && output) {
|
||||
// Update output on every change
|
||||
dynamicInput.addEventListener('changeSubject', ((event: CustomEvent) => {
|
||||
const value = (event.detail as DeesInputText).getValue();
|
||||
output.textContent = `Current value: "${value}"`;
|
||||
}) as EventListener);
|
||||
|
||||
// Also track focus/blur events
|
||||
dynamicInput.addEventListener('focus', () => {
|
||||
console.log('Input focused');
|
||||
});
|
||||
|
||||
dynamicInput.addEventListener('blur', () => {
|
||||
console.log('Input blurred');
|
||||
});
|
||||
|
||||
// Track keypress events
|
||||
let keypressCount = 0;
|
||||
dynamicInput.addEventListener('keydown', () => {
|
||||
keypressCount++;
|
||||
console.log(`Keypress count: ${keypressCount}`);
|
||||
dynamicInput.changeSubject.subscribe(() => {
|
||||
output.textContent = `Current value: "${dynamicInput.getValue()}"`;
|
||||
});
|
||||
}
|
||||
}}>
|
||||
<dees-panel .title=${'Interactive Example'} .subtitle=${'Try typing in the inputs to see real-time value changes'}>
|
||||
<dees-input-text
|
||||
.label=${'Dynamic Input'}
|
||||
<dees-panel .title=${'Interactive Example'} .subtitle=${'Try typing in the input to see real-time value changes'}>
|
||||
<dees-input-text
|
||||
.label=${'Dynamic Input'}
|
||||
.placeholder=${'Type something here...'}
|
||||
></dees-input-text>
|
||||
|
||||
|
||||
<div class="interactive-section">
|
||||
<div id="text-input-output" class="output-text">Current value: ""</div>
|
||||
</div>
|
||||
|
||||
@@ -100,11 +100,7 @@ export class DeesTile extends DeesElement {
|
||||
border-radius: 8px;
|
||||
border-top: 1px solid var(--dees-color-border-subtle);
|
||||
border-bottom: 1px solid var(--dees-color-border-subtle);
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tile-content.no-footer {
|
||||
|
||||
@@ -153,6 +153,14 @@ export class DeesModal extends DeesElement {
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
|
||||
dees-tile::part(content) {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
|
||||
}
|
||||
|
||||
dees-tile::part(outer) {
|
||||
box-shadow:
|
||||
0 0 0 1px ${cssManager.bdTheme('hsl(0 0% 0% / 0.03)', 'hsl(0 0% 100% / 0.03)')},
|
||||
|
||||
Reference in New Issue
Block a user