Skip to content

Commit 3530c98

Browse files
mathuomathuo
committed
Merge branch 'master' of https://github.com/mathuo/dockview into 849-improved-dnd-overlay-model
2 parents d811ca6 + ab965ca commit 3530c98

File tree

24 files changed

+471
-106
lines changed

24 files changed

+471
-106
lines changed

‎lerna.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"packages": [
33
"packages/*"
44
],
5-
"version": "3.0.2",
5+
"version": "3.2.0",
66
"npmClient": "yarn",
77
"command": {
88
"publish": {

‎packages/dockview-angular/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dockview-angular",
3-
"version": "3.0.2",
3+
"version": "3.2.0",
44
"description": "Zero dependency layout manager supporting tabs, grids and splitviews",
55
"keywords": [
66
"splitview",
@@ -54,6 +54,6 @@
5454
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage"
5555
},
5656
"dependencies": {
57-
"dockview-core": "^3.0.2"
57+
"dockview-core": "^3.2.0"
5858
}
5959
}

‎packages/dockview-core/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dockview-core",
3-
"version": "3.0.2",
3+
"version": "3.2.0",
44
"description": "Zero dependency layout manager supporting tabs, grids and splitviews",
55
"keywords": [
66
"splitview",

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

+74-1
Original file line numberDiff line numberDiff line change
@@ -1102,7 +1102,9 @@ describe('dockviewComponent', () => {
11021102
disposable.dispose();
11031103
});
11041104

1105-
test('events flow', () => {
1105+
test('events flow', async () => {
1106+
window.open = () => setupMockWindow();
1107+
11061108
dockview.layout(1000, 1000);
11071109

11081110
let events: {
@@ -1295,7 +1297,42 @@ describe('dockviewComponent', () => {
12951297
expect(dockview.size).toBe(0);
12961298
expect(dockview.totalPanels).toBe(0);
12971299

1300+
events = [];
1301+
1302+
const panel8 = dockview.addPanel({
1303+
id: 'panel8',
1304+
component: 'default',
1305+
});
1306+
const panel9 = dockview.addPanel({
1307+
id: 'panel9',
1308+
component: 'default',
1309+
floating: true,
1310+
});
1311+
const panel10 = dockview.addPanel({
1312+
id: 'panel10',
1313+
component: 'default',
1314+
});
1315+
1316+
expect(await dockview.addPopoutGroup(panel10)).toBeTruthy();
1317+
1318+
expect(events).toEqual([
1319+
{ type: 'ADD_GROUP', group: panel8.group },
1320+
{ type: 'ADD_PANEL', panel: panel8 },
1321+
{ type: 'ACTIVE_GROUP', group: panel8.group },
1322+
{ type: 'ACTIVE_PANEL', panel: panel8 },
1323+
{ type: 'ADD_GROUP', group: panel9.group },
1324+
{ type: 'ADD_PANEL', panel: panel9 },
1325+
{ type: 'ACTIVE_GROUP', group: panel9.group },
1326+
{ type: 'ACTIVE_PANEL', panel: panel9 },
1327+
{ type: 'ADD_PANEL', panel: panel10 },
1328+
{ type: 'ACTIVE_PANEL', panel: panel10 },
1329+
{ type: 'ADD_GROUP', group: panel10.group },
1330+
]);
1331+
1332+
events = [];
12981333
disposable.dispose();
1334+
1335+
expect(events.length).toBe(0);
12991336
});
13001337

13011338
test('that removing a panel from a group reflects in the dockviewcomponent when searching for a panel', () => {
@@ -5696,6 +5733,42 @@ describe('dockviewComponent', () => {
56965733
},
56975734
]);
56985735
});
5736+
5737+
test('dispose of dockview instance when popup is open', async () => {
5738+
const container = document.createElement('div');
5739+
5740+
window.open = () => setupMockWindow();
5741+
5742+
const dockview = new DockviewComponent(container, {
5743+
createComponent(options) {
5744+
switch (options.name) {
5745+
case 'default':
5746+
return new PanelContentPartTest(
5747+
options.id,
5748+
options.name
5749+
);
5750+
default:
5751+
throw new Error(`unsupported`);
5752+
}
5753+
},
5754+
});
5755+
5756+
dockview.layout(1000, 500);
5757+
5758+
dockview.addPanel({
5759+
id: 'panel_1',
5760+
component: 'default',
5761+
});
5762+
5763+
const panel2 = dockview.addPanel({
5764+
id: 'panel_2',
5765+
component: 'default',
5766+
});
5767+
5768+
expect(await dockview.addPopoutGroup(panel2.group)).toBeTruthy();
5769+
5770+
dockview.dispose();
5771+
});
56995772
});
57005773

57015774
describe('maximized group', () => {

‎packages/dockview-core/src/dockview/components/tab/defaultTab.ts

-6
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,6 @@ export class DefaultTab extends CompositeDisposable implements ITabRenderer {
2929
this._element.appendChild(this._content);
3030
this._element.appendChild(this.action);
3131

32-
this.addDisposables(
33-
addDisposableListener(this.action, 'pointerdown', (ev) => {
34-
ev.preventDefault();
35-
})
36-
);
37-
3832
this.render();
3933
}
4034

‎packages/dockview-core/src/dockview/components/tab/tab.ts

+4-8
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,8 @@ export class Tab extends CompositeDisposable {
5050
private readonly dropTarget: Droptarget;
5151
private content: ITabRenderer | undefined = undefined;
5252

53-
private readonly _onChanged = new Emitter<MouseEvent>();
54-
readonly onChanged: Event<MouseEvent> = this._onChanged.event;
53+
private readonly _onPointDown = new Emitter<MouseEvent>();
54+
readonly onPointerDown: Event<MouseEvent> = this._onPointDown.event;
5555

5656
private readonly _onDropped = new Emitter<DroptargetEvent>();
5757
readonly onDrop: Event<DroptargetEvent> = this._onDropped.event;
@@ -112,7 +112,7 @@ export class Tab extends CompositeDisposable {
112112
this.onWillShowOverlay = this.dropTarget.onWillShowOverlay;
113113

114114
this.addDisposables(
115-
this._onChanged,
115+
this._onPointDown,
116116
this._onDropped,
117117
this._onDragStart,
118118
dragHandler.onDragStart((event) => {
@@ -137,11 +137,7 @@ export class Tab extends CompositeDisposable {
137137
}),
138138
dragHandler,
139139
addDisposableListener(this._element, 'pointerdown', (event) => {
140-
if (event.defaultPrevented) {
141-
return;
142-
}
143-
144-
this._onChanged.fire(event);
140+
this._onPointDown.fire(event);
145141
}),
146142
this.dropTarget.onDrop((event) => {
147143
this._onDropped.fire(event);

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

+15-9
Original file line numberDiff line numberDiff line change
@@ -286,6 +286,10 @@ export class TabsContainer
286286

287287
const tabToRemove = this.tabs.splice(index, 1)[0];
288288

289+
if (!tabToRemove) {
290+
throw new Error(`dockview: Tab not found`);
291+
}
292+
289293
const { value, disposable } = tabToRemove;
290294

291295
disposable.dispose();
@@ -316,7 +320,11 @@ export class TabsContainer
316320
tab.onDragStart((event) => {
317321
this._onTabDragStart.fire({ nativeEvent: event, panel });
318322
}),
319-
tab.onChanged((event) => {
323+
tab.onPointerDown((event) => {
324+
if (event.defaultPrevented) {
325+
return;
326+
}
327+
320328
const isFloatingGroupsEnabled =
321329
!this.accessor.options.disableFloatingGroups;
322330

@@ -345,14 +353,12 @@ export class TabsContainer
345353
return;
346354
}
347355

348-
const isLeftClick = event.button === 0;
349-
350-
if (!isLeftClick || event.defaultPrevented) {
351-
return;
352-
}
353-
354-
if (this.group.activePanel !== panel) {
355-
this.group.model.openPanel(panel);
356+
switch (event.button) {
357+
case 0: // left click or touch
358+
if (this.group.activePanel !== panel) {
359+
this.group.model.openPanel(panel);
360+
}
361+
break;
356362
}
357363
}),
358364
tab.onDrop((event) => {

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

+4
Original file line numberDiff line numberDiff line change
@@ -853,6 +853,10 @@ export class DockviewComponent
853853
),
854854
overlayRenderContainer,
855855
Disposable.from(() => {
856+
if (this.isDisposed) {
857+
return; // cleanup may run after instance is disposed
858+
}
859+
856860
if (
857861
isGroupAddedToDom &&
858862
this.getPanel(referenceGroup.id)

‎packages/dockview-core/src/splitview/splitview.scss

+8-7
Original file line numberDiff line numberDiff line change
@@ -118,15 +118,16 @@
118118
touch-action: none;
119119
background-color: var(--dv-sash-color, transparent);
120120

121-
&:not(.disabled):active {
122-
transition: background-color 0.1s ease-in-out;
123-
background-color: var(--dv-active-sash-color, transparent);
124-
}
125-
121+
&:not(.disabled):active,
126122
&:not(.disabled):hover {
127123
background-color: var(--dv-active-sash-color, transparent);
128-
transition: background-color 0.1s ease-in-out;
129-
transition-delay: 0.5s;
124+
transition-property: background-color;
125+
transition-timing-function: ease-in-out;
126+
transition-duration: var(
127+
--dv-active-sash-transition-duration,
128+
0.1s
129+
);
130+
transition-delay: var(--dv-active-sash-transition-delay, 0.5s);
130131
}
131132
}
132133
}

‎packages/dockview-core/src/theme.scss

+2
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@
1919
--dv-tab-margin: 0;
2020
--dv-sash-color: transparent;
2121
--dv-active-sash-color: transparent;
22+
--dv-active-sash-transition-duration: 0.1s;
23+
--dv-active-sash-transition-delay: 0.5s;
2224
}
2325

2426
@mixin dockview-theme-dark-mixin {

‎packages/dockview-react/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dockview-react",
3-
"version": "3.0.2",
3+
"version": "3.2.0",
44
"description": "Zero dependency layout manager supporting tabs, grids and splitviews",
55
"keywords": [
66
"splitview",
@@ -54,6 +54,6 @@
5454
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-react --coverage"
5555
},
5656
"dependencies": {
57-
"dockview": "^3.0.2"
57+
"dockview": "^3.2.0"
5858
}
5959
}

‎packages/dockview-vue/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dockview-vue",
3-
"version": "3.0.2",
3+
"version": "3.2.0",
44
"description": "Zero dependency layout manager supporting tabs, grids and splitviews",
55
"keywords": [
66
"splitview",
@@ -52,7 +52,7 @@
5252
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-vue --coverage"
5353
},
5454
"dependencies": {
55-
"dockview-core": "^3.0.2"
55+
"dockview-core": "^3.2.0"
5656
},
5757
"peerDependencies": {
5858
"vue": "^3.4.0"

‎packages/dockview/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "dockview",
3-
"version": "3.0.2",
3+
"version": "3.2.0",
44
"description": "Zero dependency layout manager supporting tabs, grids and splitviews",
55
"keywords": [
66
"splitview",
@@ -54,7 +54,7 @@
5454
"test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage"
5555
},
5656
"dependencies": {
57-
"dockview-core": "^3.0.2"
57+
"dockview-core": "^3.2.0"
5858
},
5959
"peerDependencies": {
6060
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"

0 commit comments

Comments
 (0)