Skip to content

Commit db8e310

Browse files
committed
moveTo(inactive)
1 parent 148a05a commit db8e310

File tree

3 files changed

+255
-7
lines changed

3 files changed

+255
-7
lines changed

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

+217
Original file line numberDiff line numberDiff line change
@@ -6485,6 +6485,223 @@ describe('dockviewComponent', () => {
64856485
});
64866486
});
64876487

6488+
describe('moveGroup', () => {
6489+
test('#1', () => {
6490+
const container = document.createElement('div');
6491+
6492+
const dockview = new DockviewComponent(container, {
6493+
createComponent(options) {
6494+
switch (options.name) {
6495+
case 'default':
6496+
return new PanelContentPartTest(
6497+
options.id,
6498+
options.name
6499+
);
6500+
default:
6501+
throw new Error(`unsupported`);
6502+
}
6503+
},
6504+
});
6505+
const api = new DockviewApi(dockview);
6506+
6507+
dockview.layout(1000, 1000);
6508+
6509+
let panel1!: IDockviewPanel;
6510+
let panel2!: IDockviewPanel;
6511+
6512+
const reset = () => {
6513+
dockview.clear();
6514+
6515+
panel1 = api.addPanel({
6516+
id: 'panel_1',
6517+
component: 'default',
6518+
});
6519+
6520+
panel2 = api.addPanel({
6521+
id: 'panel_2',
6522+
component: 'default',
6523+
position: { direction: 'right' },
6524+
});
6525+
};
6526+
6527+
// default case
6528+
6529+
reset();
6530+
expect([
6531+
panel1.group.api.isActive,
6532+
panel2.group.api.isActive,
6533+
]).toEqual([false, true]);
6534+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6535+
false,
6536+
true,
6537+
]);
6538+
6539+
// move inactive group
6540+
6541+
reset();
6542+
panel1.group.api.moveTo({ group: panel2.group, position: 'right' });
6543+
expect([
6544+
panel1.group.api.isActive,
6545+
panel2.group.api.isActive,
6546+
]).toEqual([true, false]);
6547+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6548+
true,
6549+
false,
6550+
]);
6551+
6552+
// move active group
6553+
6554+
reset();
6555+
panel2.group.api.moveTo({ group: panel1.group, position: 'left' });
6556+
expect([
6557+
panel1.group.api.isActive,
6558+
panel2.group.api.isActive,
6559+
]).toEqual([false, true]);
6560+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6561+
false,
6562+
true,
6563+
]);
6564+
6565+
// move inactive group (with inactive flag)
6566+
6567+
reset();
6568+
panel1.group.api.moveTo({
6569+
group: panel2.group,
6570+
position: 'right',
6571+
inactive: true,
6572+
});
6573+
expect([
6574+
panel1.group.api.isActive,
6575+
panel2.group.api.isActive,
6576+
]).toEqual([false, true]);
6577+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6578+
false,
6579+
true,
6580+
]);
6581+
6582+
// move active group (with inactive flag)
6583+
6584+
reset();
6585+
panel2.group.api.moveTo({
6586+
group: panel1.group,
6587+
position: 'left',
6588+
inactive: true,
6589+
});
6590+
expect([
6591+
panel1.group.api.isActive,
6592+
panel2.group.api.isActive,
6593+
]).toEqual([false, true]);
6594+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6595+
false,
6596+
true,
6597+
]);
6598+
6599+
// merge inactive group with active group
6600+
6601+
reset();
6602+
panel1.group.api.moveTo({ group: panel2.group });
6603+
expect([
6604+
panel1.group.api.isActive,
6605+
panel2.group.api.isActive,
6606+
]).toEqual([true, true]);
6607+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6608+
true,
6609+
false,
6610+
]);
6611+
6612+
// merge active group with inactive group
6613+
6614+
reset();
6615+
panel2.group.api.moveTo({ group: panel1.group });
6616+
expect([
6617+
panel1.group.api.isActive,
6618+
panel2.group.api.isActive,
6619+
]).toEqual([true, true]);
6620+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6621+
false,
6622+
true,
6623+
]);
6624+
6625+
// merge inactive group with active group (with inactive flag)
6626+
6627+
reset();
6628+
panel1.group.api.moveTo({ group: panel2.group, inactive: true });
6629+
expect([
6630+
panel1.group.api.isActive,
6631+
panel2.group.api.isActive,
6632+
]).toEqual([true, true]);
6633+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6634+
false,
6635+
true,
6636+
]);
6637+
6638+
// merge active group with inactive group (with inactive flag)
6639+
6640+
reset();
6641+
panel2.group.api.moveTo({ group: panel1.group, inactive: true });
6642+
expect([
6643+
panel1.group.api.isActive,
6644+
panel2.group.api.isActive,
6645+
]).toEqual([true, true]);
6646+
expect([panel1.api.isActive, panel2.api.isActive]).toEqual([
6647+
false,
6648+
true,
6649+
]);
6650+
});
6651+
});
6652+
6653+
describe('movePanel', () => {
6654+
test('#1', () => {
6655+
const container = document.createElement('div');
6656+
6657+
const dockview = new DockviewComponent(container, {
6658+
createComponent(options) {
6659+
switch (options.name) {
6660+
case 'default':
6661+
return new PanelContentPartTest(
6662+
options.id,
6663+
options.name
6664+
);
6665+
default:
6666+
throw new Error(`unsupported`);
6667+
}
6668+
},
6669+
});
6670+
const api = new DockviewApi(dockview);
6671+
6672+
dockview.layout(1000, 1000);
6673+
6674+
let panel1!: IDockviewPanel;
6675+
let panel2!: IDockviewPanel;
6676+
6677+
const reset = () => {
6678+
dockview.clear();
6679+
6680+
panel1 = api.addPanel({
6681+
id: 'panel_1',
6682+
component: 'default',
6683+
});
6684+
6685+
panel2 = api.addPanel({
6686+
id: 'panel_2',
6687+
component: 'default',
6688+
position: { direction: 'right' },
6689+
});
6690+
};
6691+
6692+
// default case
6693+
//
6694+
// last panel of group to within another group
6695+
//
6696+
// panel from group of at least 2 panels to within another group
6697+
//
6698+
// last panel of group to a new group within same branch
6699+
//
6700+
// last panel of group to a new group not within same branch
6701+
//
6702+
});
6703+
});
6704+
64886705
test('that `onDidLayoutChange` only subscribes to events after initial subscription time', () => {
64896706
jest.useFakeTimers();
64906707

packages/dockview-core/src/api/dockviewGroupPanelApi.ts

+2
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export interface DockviewGroupMoveParams {
1616
* The index to place the panel within a group, only applicable if the placement is within an existing group
1717
*/
1818
index?: number;
19+
inactive?: boolean;
1920
}
2021

2122
export interface DockviewGroupPanelApi extends GridviewPanelApi {
@@ -105,6 +106,7 @@ export class DockviewGroupPanelApiImpl extends GridviewPanelApiImpl {
105106
: 'center',
106107
index: options.index,
107108
},
109+
inactive: options.inactive,
108110
});
109111
}
110112

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

+36-7
Original file line numberDiff line numberDiff line change
@@ -153,6 +153,7 @@ export interface MovePanelEvent {
153153
type MoveGroupOptions = {
154154
from: { group: DockviewGroupPanel };
155155
to: { group: DockviewGroupPanel; position: Position };
156+
inactive?: boolean;
156157
};
157158

158159
type MoveGroupOrPanelOptions = {
@@ -165,6 +166,7 @@ type MoveGroupOrPanelOptions = {
165166
position: Position;
166167
index?: number;
167168
};
169+
inactive?: boolean;
168170
};
169171

170172
export interface FloatingGroupOptions {
@@ -1997,6 +1999,7 @@ export class DockviewComponent
19971999
group: destinationGroup,
19982000
position: destinationTarget,
19992001
},
2002+
inactive: options.inactive,
20002003
});
20012004
return;
20022005
}
@@ -2027,9 +2030,13 @@ export class DockviewComponent
20272030
destinationGroup.model.openPanel(removedPanel, {
20282031
index: destinationIndex,
20292032
skipSetGroupActive: true,
2033+
skipSetActive: options.inactive,
20302034
})
20312035
);
2032-
this.doSetGroupAndPanelActive(destinationGroup);
2036+
2037+
if (!options.inactive) {
2038+
this.doSetGroupAndPanelActive(destinationGroup);
2039+
}
20332040

20342041
this._onDidMovePanel.fire({
20352042
panel: removedPanel,
@@ -2107,10 +2114,14 @@ export class DockviewComponent
21072114
this.doRemoveGroup(sourceGroup, { skipActive: true });
21082115

21092116
const newGroup = this.createGroupAtLocation(targetLocation);
2117+
21102118
this.movingLock(() =>
21112119
newGroup.model.openPanel(removedPanel)
21122120
);
2113-
this.doSetGroupAndPanelActive(newGroup);
2121+
2122+
if (!options.inactive) {
2123+
this.doSetGroupAndPanelActive(newGroup);
2124+
}
21142125

21152126
this._onDidMovePanel.fire({
21162127
panel: this.getGroupPanel(sourceItemId)!,
@@ -2137,8 +2148,12 @@ export class DockviewComponent
21372148
updatedReferenceLocation,
21382149
destinationTarget
21392150
);
2151+
21402152
this.movingLock(() => this.doAddGroup(targetGroup, location));
2141-
this.doSetGroupAndPanelActive(targetGroup);
2153+
2154+
if (!options.inactive) {
2155+
this.doSetGroupAndPanelActive(targetGroup);
2156+
}
21422157

21432158
this._onDidMovePanel.fire({
21442159
panel: this.getGroupPanel(sourceItemId)!,
@@ -2173,7 +2188,10 @@ export class DockviewComponent
21732188
skipSetGroupActive: true,
21742189
})
21752190
);
2176-
this.doSetGroupAndPanelActive(group);
2191+
2192+
if (!options.inactive) {
2193+
this.doSetGroupAndPanelActive(group);
2194+
}
21772195

21782196
this._onDidMovePanel.fire({
21792197
panel: removedPanel,
@@ -2199,20 +2217,27 @@ export class DockviewComponent
21992217
)
22002218
);
22012219

2220+
const isActiveGroup = from.api.isActive;
2221+
22022222
if (from?.model.size === 0) {
22032223
this.doRemoveGroup(from, { skipActive: true });
22042224
}
22052225

22062226
this.movingLock(() => {
22072227
for (const panel of panels) {
22082228
to.model.openPanel(panel, {
2209-
skipSetActive: panel !== activePanel,
2210-
skipSetGroupActive: true,
2229+
skipSetActive:
2230+
options.inactive && !isActiveGroup
2231+
? true
2232+
: panel !== activePanel,
2233+
skipSetGroupActive: !options.inactive,
22112234
});
22122235
}
22132236
});
22142237

2215-
this.doSetGroupAndPanelActive(to);
2238+
if (isActiveGroup || !options.inactive) {
2239+
this.doSetGroupAndPanelActive(to);
2240+
}
22162241
} else {
22172242
switch (from.api.location.type) {
22182243
case 'grid':
@@ -2264,6 +2289,10 @@ export class DockviewComponent
22642289
}
22652290

22662291
this.gridview.addView(from, size, dropLocation);
2292+
2293+
if (!options.inactive) {
2294+
this.doSetGroupAndPanelActive(from);
2295+
}
22672296
}
22682297

22692298
from.panels.forEach((panel) => {

0 commit comments

Comments
 (0)