Skip to content

Commit e4a0858

Browse files
mathuomathuo
committed
feat: scrollbars
1 parent 5fb13dd commit e4a0858

File tree

8 files changed

+41
-5
lines changed

8 files changed

+41
-5
lines changed

‎packages/dockview-core/src/__tests__/api/dockviewPanelApi.spec.ts

+3
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ describe('groupPanelApi', () => {
1010
onDidAddPanel: jest.fn(),
1111
onDidRemovePanel: jest.fn(),
1212
options: {},
13+
onDidOptionsChange: jest.fn(),
1314
});
1415

1516
const panelMock = jest.fn<DockviewPanel, []>(() => {
@@ -50,6 +51,7 @@ describe('groupPanelApi', () => {
5051
onDidAddPanel: jest.fn(),
5152
onDidRemovePanel: jest.fn(),
5253
options: {},
54+
onDidOptionsChange: jest.fn(),
5355
});
5456

5557
const groupViewPanel = new DockviewGroupPanel(
@@ -82,6 +84,7 @@ describe('groupPanelApi', () => {
8284
onDidAddPanel: jest.fn(),
8385
onDidRemovePanel: jest.fn(),
8486
options: {},
87+
onDidOptionsChange: jest.fn(),
8588
});
8689

8790
const groupViewPanel = new DockviewGroupPanel(

‎packages/dockview-core/src/__tests__/dockview/components/titlebar/tabsContainer.spec.ts

+14
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ describe('tabsContainer', () => {
1818
onDidAddPanel: jest.fn(),
1919
onDidRemovePanel: jest.fn(),
2020
options: {},
21+
onDidOptionsChange: jest.fn(),
2122
});
2223

2324
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -71,6 +72,7 @@ describe('tabsContainer', () => {
7172
onDidAddPanel: jest.fn(),
7273
onDidRemovePanel: jest.fn(),
7374
options: {},
75+
onDidOptionsChange: jest.fn(),
7476
});
7577

7678
const dropTargetContainer = document.createElement('div');
@@ -140,6 +142,7 @@ describe('tabsContainer', () => {
140142
onDidAddPanel: jest.fn(),
141143
onDidRemovePanel: jest.fn(),
142144
options: {},
145+
onDidOptionsChange: jest.fn(),
143146
});
144147

145148
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -203,6 +206,7 @@ describe('tabsContainer', () => {
203206
onDidAddPanel: jest.fn(),
204207
onDidRemovePanel: jest.fn(),
205208
options: {},
209+
onDidOptionsChange: jest.fn(),
206210
});
207211

208212
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -266,6 +270,7 @@ describe('tabsContainer', () => {
266270
onDidAddPanel: jest.fn(),
267271
onDidRemovePanel: jest.fn(),
268272
options: {},
273+
onDidOptionsChange: jest.fn(),
269274
});
270275

271276
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -334,6 +339,7 @@ describe('tabsContainer', () => {
334339
onDidAddPanel: jest.fn(),
335340
onDidRemovePanel: jest.fn(),
336341
options: {},
342+
onDidOptionsChange: jest.fn(),
337343
});
338344

339345
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -398,6 +404,7 @@ describe('tabsContainer', () => {
398404
onDidAddPanel: jest.fn(),
399405
onDidRemovePanel: jest.fn(),
400406
options: {},
407+
onDidOptionsChange: jest.fn(),
401408
});
402409

403410
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -464,6 +471,7 @@ describe('tabsContainer', () => {
464471
element: document.createElement('div'),
465472
addFloatingGroup: jest.fn(),
466473
doSetGroupActive: jest.fn(),
474+
onDidOptionsChange: jest.fn(),
467475
});
468476

469477
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -520,6 +528,7 @@ describe('tabsContainer', () => {
520528
element: document.createElement('div'),
521529
addFloatingGroup: jest.fn(),
522530
doSetGroupActive: jest.fn(),
531+
onDidOptionsChange: jest.fn(),
523532
});
524533

525534
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -571,6 +580,7 @@ describe('tabsContainer', () => {
571580
element: document.createElement('div'),
572581
addFloatingGroup: jest.fn(),
573582
getGroupPanel: jest.fn(),
583+
onDidOptionsChange: jest.fn(),
574584
});
575585

576586
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -627,6 +637,7 @@ describe('tabsContainer', () => {
627637
element: document.createElement('div'),
628638
addFloatingGroup: jest.fn(),
629639
getGroupPanel: jest.fn(),
640+
onDidOptionsChange: jest.fn(),
630641
});
631642

632643
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -694,6 +705,7 @@ describe('tabsContainer', () => {
694705
element: document.createElement('div'),
695706
addFloatingGroup: jest.fn(),
696707
getGroupPanel: jest.fn(),
708+
onDidOptionsChange: jest.fn(),
697709
});
698710

699711
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -761,6 +773,7 @@ describe('tabsContainer', () => {
761773
element: document.createElement('div'),
762774
addFloatingGroup: jest.fn(),
763775
getGroupPanel: jest.fn(),
776+
onDidOptionsChange: jest.fn(),
764777
});
765778

766779
const groupPanelMock = jest.fn<DockviewGroupPanel, []>(() => {
@@ -824,6 +837,7 @@ describe('tabsContainer', () => {
824837
const cut = new TabsContainer(
825838
fromPartial<DockviewComponent>({
826839
options: {},
840+
onDidOptionsChange: jest.fn(),
827841
}),
828842
fromPartial<DockviewGroupPanel>({})
829843
);

‎packages/dockview-core/src/__tests__/dockview/dockviewGroupPanel.spec.ts

+3
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ describe('dockviewGroupPanel', () => {
1616
onDidAddPanel: jest.fn(),
1717
onDidRemovePanel: jest.fn(),
1818
options: {},
19+
onDidOptionsChange: jest.fn(),
1920
});
2021
const options = fromPartial<GroupOptions>({});
2122
const cut = new DockviewGroupPanel(accessor, 'test_id', options);
@@ -39,6 +40,7 @@ describe('dockviewGroupPanel', () => {
3940
detatch: jest.fn(),
4041
},
4142
doSetGroupActive: jest.fn(),
43+
onDidOptionsChange: jest.fn(),
4244
});
4345
const options = fromPartial<GroupOptions>({});
4446

@@ -81,6 +83,7 @@ describe('dockviewGroupPanel', () => {
8183
detatch: jest.fn(),
8284
}),
8385
options: {},
86+
onDidOptionsChange: jest.fn(),
8487
});
8588
const options = fromPartial<GroupOptions>({});
8689
const cut = new DockviewGroupPanel(accessor, 'test_id', options);

‎packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts

+6
Original file line numberDiff line numberDiff line change
@@ -270,6 +270,7 @@ describe('dockviewGroupPanelModel', () => {
270270
document.createElement('div'),
271271
fromPartial<DockviewComponent>({})
272272
),
273+
onDidOptionsChange: () => ({ dispose: jest.fn() }),
273274
});
274275

275276
groupview = new DockviewGroupPanel(dockview, 'groupview-1', options);
@@ -651,6 +652,7 @@ describe('dockviewGroupPanelModel', () => {
651652
getPanel: jest.fn(),
652653
onDidAddPanel: jest.fn(),
653654
onDidRemovePanel: jest.fn(),
655+
onDidOptionsChange: jest.fn(),
654656
});
655657

656658
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -713,6 +715,7 @@ describe('dockviewGroupPanelModel', () => {
713715
getPanel: jest.fn(),
714716
onDidAddPanel: jest.fn(),
715717
onDidRemovePanel: jest.fn(),
718+
onDidOptionsChange: jest.fn(),
716719
});
717720

718721
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -809,6 +812,7 @@ describe('dockviewGroupPanelModel', () => {
809812
document.createElement('div'),
810813
fromPartial<DockviewComponent>({})
811814
),
815+
onDidOptionsChange: jest.fn(),
812816
});
813817

814818
const groupView = fromPartial<DockviewGroupPanelModel>({
@@ -875,6 +879,7 @@ describe('dockviewGroupPanelModel', () => {
875879
document.createElement('div'),
876880
fromPartial<DockviewComponent>({})
877881
),
882+
onDidOptionsChange: jest.fn(),
878883
});
879884

880885
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -948,6 +953,7 @@ describe('dockviewGroupPanelModel', () => {
948953
document.createElement('div'),
949954
fromPartial<DockviewComponent>({})
950955
),
956+
onDidOptionsChange: jest.fn(),
951957
});
952958

953959
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(

‎packages/dockview-core/src/__tests__/gridview/gridviewPanel.spec.ts

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ describe('gridviewPanel', () => {
88
onDidAddPanel: jest.fn(),
99
onDidRemovePanel: jest.fn(),
1010
options: {},
11+
onDidOptionsChange: jest.fn(),
1112
} as any;
1213
});
1314

‎packages/dockview-core/src/dockview/components/titlebar/tabsContainer.ts

+8-5
Original file line numberDiff line numberDiff line change
@@ -140,11 +140,7 @@ export class TabsContainer
140140
this.preActionsContainer.className = 'dv-pre-actions-container';
141141

142142
this.tabs = new Tabs(group, accessor, {
143-
showTabsOverflowControl: false,
144-
});
145-
146-
this.tabs.onOverflowTabsChange((event) => {
147-
this.toggleDropdown(event);
143+
showTabsOverflowControl: !accessor.options.disableTabsOverflowList,
148144
});
149145

150146
this.voidContainer = new VoidContainer(this.accessor, this.group);
@@ -156,6 +152,13 @@ export class TabsContainer
156152
this._element.appendChild(this.rightActionsContainer);
157153

158154
this.addDisposables(
155+
accessor.onDidOptionsChange(() => {
156+
this.tabs.showTabsOverflowControl =
157+
!accessor.options.disableTabsOverflowList;
158+
}),
159+
this.tabs.onOverflowTabsChange((event) => {
160+
this.toggleDropdown(event);
161+
}),
159162
this.tabs,
160163
this._onWillShowOverlay,
161164
this._onDrop,

‎packages/dockview-core/src/dockview/dockviewComponent.ts

+4
Original file line numberDiff line numberDiff line change
@@ -330,6 +330,9 @@ export class DockviewComponent
330330
readonly onDidAddGroup: Event<DockviewGroupPanel> =
331331
this._onDidAddGroup.event;
332332

333+
private readonly _onDidOptionsChange = new Emitter<void>();
334+
readonly onDidOptionsChange: Event<void> = this._onDidOptionsChange.event;
335+
333336
private readonly _onDidActiveGroupChange = new Emitter<
334337
DockviewGroupPanel | undefined
335338
>();
@@ -434,6 +437,7 @@ export class DockviewComponent
434437
this._onDidActiveGroupChange,
435438
this._onUnhandledDragOverEvent,
436439
this._onDidMaximizedGroupChange,
440+
this._onDidOptionsChange,
437441
this.onDidViewVisibilityChangeMicroTaskQueue(() => {
438442
this.updateWatermark();
439443
}),

‎packages/dockview-core/src/dockview/options.ts

+2
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ export interface DockviewOptions {
7272
*/
7373
noPanelsOverlay?: 'emptyGroup' | 'watermark';
7474
theme?: DockviewTheme;
75+
disableTabsOverflowList?: boolean;
7576
}
7677

7778
export interface DockviewDndOverlayEvent extends IAcceptableEvent {
@@ -119,6 +120,7 @@ export const PROPERTY_KEYS_DOCKVIEW: (keyof DockviewOptions)[] = (() => {
119120
dndEdges: undefined,
120121
theme: undefined,
121122
gap: undefined,
123+
disableTabsOverflowList: undefined,
122124
};
123125

124126
return Object.keys(properties) as (keyof DockviewOptions)[];

0 commit comments

Comments
 (0)