design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(dees-table): add schema-based in-cell editing with keyboard navigation and cell edit events

Browse Source
This commit is contained in:
Jürgen Kunz
2026-04-07 15:32:10 +00:00
parent 2f95979cc6
commit efea2d62d9
6 changed files with 451 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
ts_web/elements/00group-dataview/dees-table/styles.ts
View File

@@ -372,32 +372,32 @@ export const tableStyles: CSSResult[] = [
min-height: 24px;
line-height: 24px;
}
td input {
position: absolute;
top: 4px;
bottom: 4px;
left: 20px;
right: 20px;
width: calc(100% - 40px);
height: calc(100% - 8px);
padding: 0 12px;
outline: none;
border: 1px solid var(--dees-color-border-default);
border-radius: 6px;
background: ${cssManager.bdTheme('hsl(0 0% 100%)', 'hsl(0 0% 9%)')};
color: var(--dees-color-text-primary);
font-family: inherit;
font-size: inherit;
font-weight: inherit;
transition: all 0.15s ease;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
/* Editable cell affordances */
td.editable {
cursor: text;
}
td input:focus {
border-color: ${cssManager.bdTheme('hsl(222.2 47.4% 51.2%)', 'hsl(217.2 91.2% 59.8%)')};
outline: 2px solid transparent;
outline-offset: 2px;
box-shadow: 0 0 0 2px ${cssManager.bdTheme('hsl(222.2 47.4% 51.2% / 0.2)', 'hsl(217.2 91.2% 59.8% / 0.2)')};
td.focused {
outline: 2px solid ${cssManager.bdTheme(
'hsl(222.2 47.4% 51.2% / 0.6)',
'hsl(217.2 91.2% 59.8% / 0.6)'
)};
outline-offset: -2px;
}
td.editingCell {
padding: 0;
}
td.editingCell .innerCellContainer {
padding: 0;
line-height: normal;
}
td.editingCell dees-input-text,
td.editingCell dees-input-checkbox,
td.editingCell dees-input-dropdown,
td.editingCell dees-input-datepicker,
td.editingCell dees-input-tags {
display: block;
width: 100%;
}
/* filter row */