rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-08-12 12:16:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

tmp

Browse Source
This commit is contained in:
mathuo 2025-01-19 20:00:26 +00:00
parent 723272d6de
commit 5ca5ffac8d
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
2 changed files with 47 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/dockview-core/src/dockview/components/titlebar/tabs.scss
View File

@ -39,4 +39,35 @@
height: 100%;
}
}
&.dv-tabs-overflow-container {
flex-direction: column;
height: unset;
.dv-tab {
height: var(--dv-tabs-and-actions-container-height);
}
.dv-active-tab {
background-color: var(
--dv-activegroup-visiblepanel-tab-background-color
);
color: var(--dv-activegroup-visiblepanel-tab-color);
}
.dv-inactive-tab {
background-color: var(
--dv-activegroup-hiddenpanel-tab-background-color
);
color: var(--dv-activegroup-hiddenpanel-tab-color);
}
}
}
.dv-tabs-panel {
.dv-tabs-overflow-handle {
height: 100%;
width: 15px;
flex-shrink: 0;
background-color: red;
}
}

30
packages/dockview-core/src/dockview/components/titlebar/tabs.tsx
View File

@ -220,6 +220,7 @@ export class Tabs extends CompositeDisposable {
private toggleDropdown(show: boolean): void {
this._hasOverflow = show;
if (this._dropdownAnchor) {
this._dropdownAnchor.remove();
this._dropdownAnchor = null;
@ -230,28 +231,29 @@ export class Tabs extends CompositeDisposable {
}
this._dropdownAnchor = document.createElement('div');
this._dropdownAnchor.style.width = '10px';
this._dropdownAnchor.style.height = '100%';
this._dropdownAnchor.style.flexShrink = '0';
this._dropdownAnchor.style.backgroundColor = 'red';
this._dropdownAnchor.className = 'dv-tabs-overflow-handle';
this.element.appendChild(this._dropdownAnchor);
addDisposableListener(this._dropdownAnchor, 'click', (event) => {
const el = document.createElement('div');
el.style.width = '200px';
el.style.maxHeight = '600px';
el.style.overflow = 'auto';
el.style.backgroundColor = 'lightgreen';
el.className =
'dv-tabs-and-actions-container dv-tabs-container dv-tabs-overflow-container';
this.tabs.map((tab) => {
const tab2 = new Tab(
tab.value.panel,
this.accessor,
this.group
);
tab2.setContent(tab.value.panel.view.newTab);
el.appendChild(tab2.element);
const child = tab.value.element.cloneNode(true);
const wrapper = document.createElement('div');
wrapper.addEventListener('mousedown', () => {
this.accessor.popupService.close();
tab.value.element.scrollIntoView();
tab.value.panel.api.setActive();
});
wrapper.appendChild(child);
el.appendChild(wrapper);
});
this.accessor.popupService.openPopover(el, {