Skip to content

Commit 58aba53

Browse files
committed
feat: priority experiments
1 parent d0eda81 commit 58aba53

22 files changed

+223
-90
lines changed

packages/dockview-core/src/__tests__/gridview/baseComponentGridview.spec.ts

+6-2
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,11 @@ import {
1111
PanelUpdateEvent,
1212
Parameters,
1313
} from '../../panel/types';
14-
import { LayoutPriority, Orientation } from '../../splitview/splitview';
14+
import {
15+
EnhancedLayoutPriority,
16+
LayoutPriority,
17+
Orientation,
18+
} from '../../splitview/splitview';
1519

1620
class TestPanel implements IGridPanelView {
1721
_onDidChange = new Emitter<IViewSize | undefined>();
@@ -32,7 +36,7 @@ class TestPanel implements IGridPanelView {
3236
public readonly maximumWidth: number,
3337
public readonly minimumHeight: number,
3438
public readonly maximumHeight: number,
35-
public priority: LayoutPriority,
39+
public priority: EnhancedLayoutPriority,
3640
public snap: boolean
3741
) {}
3842

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

+4-3
Original file line numberDiff line numberDiff line change
@@ -2,17 +2,18 @@ import { Emitter } from '../../events';
22
import { CompositeDisposable } from '../../lifecycle';
33
import {
44
IView,
5-
LayoutPriority,
5+
EnhancedLayoutPriority,
66
Orientation,
77
Sizing,
88
Splitview,
9+
LayoutPriority,
910
} from '../../splitview/splitview';
1011
import { fireEvent } from '@testing-library/dom';
1112
class Testview implements IView {
1213
private _element: HTMLElement = document.createElement('div');
1314
private _size = 0;
1415
private _orthogonalSize = 0;
15-
private _priority: LayoutPriority | undefined;
16+
private _priority: EnhancedLayoutPriority | undefined;
1617

1718
private readonly _onDidChange = new Emitter<{
1819
size?: number;
@@ -54,7 +55,7 @@ class Testview implements IView {
5455
constructor(
5556
private _minimumSize: number,
5657
private _maxiumSize: number,
57-
priority?: LayoutPriority
58+
priority?: EnhancedLayoutPriority
5859
) {
5960
this._priority = priority;
6061
}

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

+9
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ export interface DockviewPanelApi
4040
readonly group: DockviewGroupPanel;
4141
readonly isGroupActive: boolean;
4242
readonly renderer: DockviewPanelRenderer;
43+
readonly preferredSize: number | undefined;
4344
readonly title: string | undefined;
4445
readonly onDidActiveGroupChange: Event<ActiveGroupEvent>;
4546
readonly onDidGroupChange: Event<GroupChangedEvent>;
@@ -106,6 +107,10 @@ export class DockviewPanelApiImpl
106107
return this.panel.renderer;
107108
}
108109

110+
get preferredSize(): number | undefined {
111+
return this.panel.preferredSize;
112+
}
113+
109114
set group(value: DockviewGroupPanel) {
110115
const oldGroup = this._group;
111116

@@ -130,6 +135,10 @@ export class DockviewPanelApiImpl
130135
return this._tabComponent;
131136
}
132137

138+
get priority(): number {
139+
return this.panel.priority;
140+
}
141+
133142
constructor(
134143
private panel: DockviewPanel,
135144
group: DockviewGroupPanel,

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

+16-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { Emitter, Event } from '../events';
2+
import { GridviewPanel } from '../gridview/gridviewPanel';
23
import { IPanel } from '../panel/types';
4+
import { layoutPriorityAsNumber } from '../splitview/splitview';
35
import { FunctionOrValue } from '../types';
46
import { PanelApiImpl, PanelApi } from './panelApi';
57

@@ -26,6 +28,7 @@ export interface GridviewPanelApi extends PanelApi {
2628
readonly onDidConstraintsChange: Event<GridConstraintChangeEvent>;
2729
setConstraints(value: GridConstraintChangeEvent2): void;
2830
setSize(event: SizeEvent): void;
31+
readonly priority: number;
2932
}
3033

3134
export class GridviewPanelApiImpl
@@ -44,7 +47,17 @@ export class GridviewPanelApiImpl
4447
private readonly _onDidSizeChange = new Emitter<SizeEvent>();
4548
readonly onDidSizeChange: Event<SizeEvent> = this._onDidSizeChange.event;
4649

47-
constructor(id: string, component: string, panel?: IPanel) {
50+
get priority(): number {
51+
return this.gridPanel?.priority
52+
? layoutPriorityAsNumber(this.gridPanel.priority)
53+
: 0;
54+
}
55+
56+
constructor(
57+
id: string,
58+
component: string,
59+
private readonly gridPanel?: GridviewPanel
60+
) {
4861
super(id, component);
4962

5063
this.addDisposables(
@@ -53,8 +66,8 @@ export class GridviewPanelApiImpl
5366
this._onDidSizeChange
5467
);
5568

56-
if (panel) {
57-
this.initialize(panel);
69+
if (gridPanel) {
70+
this.initialize(gridPanel);
5871
}
5972
}
6073

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

+2
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,8 @@ export class DefaultDockviewDeserialzier implements IPanelDeserializer {
5757
view,
5858
{
5959
renderer: panelData.renderer,
60+
priority: panelData.priority,
61+
preferredSize: panelData.preferredSize,
6062
}
6163
);
6264

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

+44-13
Original file line numberDiff line numberDiff line change
@@ -588,7 +588,13 @@ export class DockviewComponent
588588
panelId: data.panelId ?? undefined,
589589
},
590590
to: {
591-
group: this.orthogonalize(event.position),
591+
group: this.orthogonalize(
592+
event.position,
593+
data.panelId
594+
? this.getGroupPanel(data.panelId)?.api
595+
.preferredSize
596+
: undefined
597+
),
592598
position: 'center',
593599
},
594600
});
@@ -991,7 +997,10 @@ export class DockviewComponent
991997
this.updateWatermark();
992998
}
993999

994-
private orthogonalize(position: Position): DockviewGroupPanel {
1000+
private orthogonalize(
1001+
position: Position,
1002+
size?: number
1003+
): DockviewGroupPanel {
9951004
switch (position) {
9961005
case 'top':
9971006
case 'bottom':
@@ -1017,10 +1026,10 @@ export class DockviewComponent
10171026
case 'top':
10181027
case 'left':
10191028
case 'center':
1020-
return this.createGroupAtLocation([0]); // insert into first position
1029+
return this.createGroupAtLocation([0], size); // insert into first position
10211030
case 'bottom':
10221031
case 'right':
1023-
return this.createGroupAtLocation([this.gridview.length]); // insert into last position
1032+
return this.createGroupAtLocation([this.gridview.length], size); // insert into last position
10241033
default:
10251034
throw new Error(`unsupported position ${position}`);
10261035
}
@@ -1437,7 +1446,8 @@ export class DockviewComponent
14371446
}
14381447
} else {
14391448
const group = this.orthogonalize(
1440-
directionToPosition(<Direction>options.position.direction)
1449+
directionToPosition(<Direction>options.position.direction),
1450+
options.preferredSize
14411451
);
14421452

14431453
const panel = this.createPanel(options, group);
@@ -1505,7 +1515,10 @@ export class DockviewComponent
15051515
location,
15061516
target
15071517
);
1508-
const group = this.createGroupAtLocation(relativeLocation);
1518+
const group = this.createGroupAtLocation(
1519+
relativeLocation,
1520+
options.preferredSize
1521+
);
15091522
panel = this.createPanel(options, group);
15101523
group.model.openPanel(panel, {
15111524
skipSetActive: options.inactive,
@@ -1538,7 +1551,10 @@ export class DockviewComponent
15381551
skipSetGroupActive: options.inactive,
15391552
});
15401553
} else {
1541-
const group = this.createGroupAtLocation();
1554+
const group = this.createGroupAtLocation(
1555+
undefined,
1556+
options.preferredSize
1557+
);
15421558
panel = this.createPanel(options, group);
15431559
group.model.openPanel(panel, {
15441560
skipSetActive: options.inactive,
@@ -1659,7 +1675,8 @@ export class DockviewComponent
16591675
}
16601676
} else {
16611677
const group = this.orthogonalize(
1662-
directionToPosition(<Direction>options.direction)
1678+
directionToPosition(<Direction>options.direction),
1679+
options.preferredSize
16631680
);
16641681
if (!options.skipSetActive) {
16651682
this.doSetGroupAndPanelActive(group);
@@ -1942,7 +1959,13 @@ export class DockviewComponent
19421959
updatedReferenceLocation,
19431960
destinationTarget
19441961
);
1945-
this.movingLock(() => this.doAddGroup(targetGroup, location));
1962+
this.movingLock(() =>
1963+
this.doAddGroup(
1964+
targetGroup,
1965+
location,
1966+
targetGroup.activePanel?.api.preferredSize
1967+
)
1968+
);
19461969
this.doSetGroupAndPanelActive(targetGroup);
19471970
} else {
19481971
/**
@@ -1967,7 +1990,10 @@ export class DockviewComponent
19671990
destinationTarget
19681991
);
19691992

1970-
const group = this.createGroupAtLocation(dropLocation);
1993+
const group = this.createGroupAtLocation(
1994+
dropLocation,
1995+
removedPanel.api.preferredSize
1996+
);
19711997
this.movingLock(() =>
19721998
group.model.openPanel(removedPanel, {
19731999
skipSetGroupActive: true,
@@ -2219,7 +2245,11 @@ export class DockviewComponent
22192245
this._api,
22202246
group,
22212247
view,
2222-
{ renderer: options.renderer }
2248+
{
2249+
renderer: options.renderer,
2250+
priority: options.priority,
2251+
preferredSize: options.preferredSize,
2252+
}
22232253
);
22242254

22252255
panel.init({
@@ -2231,10 +2261,11 @@ export class DockviewComponent
22312261
}
22322262

22332263
private createGroupAtLocation(
2234-
location: number[] = [0]
2264+
location: number[] = [0],
2265+
size?: number
22352266
): DockviewGroupPanel {
22362267
const group = this.createGroup();
2237-
this.doAddGroup(group, location);
2268+
this.doAddGroup(group, location, size);
22382269
return group;
22392270
}
22402271

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

+11
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import {
1313
DockviewGroupPanelApi,
1414
DockviewGroupPanelApiImpl,
1515
} from '../api/dockviewGroupPanelApi';
16+
import { EnhancedLayoutPriority, LayoutPriority } from '../splitview/splitview';
1617

1718
const MINIMUM_DOCKVIEW_GROUP_PANEL_WIDTH = 100;
1819
const MINIMUM_DOCKVIEW_GROUP_PANEL_HEIGHT = 100;
@@ -62,6 +63,16 @@ export class DockviewGroupPanel
6263
return this._model.header;
6364
}
6465

66+
get priority(): EnhancedLayoutPriority | undefined {
67+
const activePanel = this.model.activePanel;
68+
69+
if (!activePanel) {
70+
return LayoutPriority.Normal;
71+
}
72+
73+
return activePanel.api.priority;
74+
}
75+
6576
constructor(
6677
accessor: DockviewComponent,
6778
id: string,

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

+1
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ export interface GroupOptions extends CoreGroupOptions {
5656
readonly panels?: IDockviewPanel[];
5757
readonly activePanel?: IDockviewPanel;
5858
readonly id?: string;
59+
readonly preferredSize?: number;
5960
}
6061

6162
export interface GroupPanelViewState extends CoreGroupOptions {

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

+18-1
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,8 @@ export class DockviewPanel
3939
private _params?: Parameters;
4040
private _title: string | undefined;
4141
private _renderer: DockviewPanelRenderer | undefined;
42+
private _priority: number | undefined;
43+
private _preferredSize: number | undefined;
4244

4345
get params(): Parameters | undefined {
4446
return this._params;
@@ -56,6 +58,14 @@ export class DockviewPanel
5658
return this._renderer ?? this.accessor.renderer;
5759
}
5860

61+
get preferredSize(): number | undefined {
62+
return this._preferredSize;
63+
}
64+
65+
get priority(): number {
66+
return this._priority ?? 0;
67+
}
68+
5969
constructor(
6070
public readonly id: string,
6171
component: string,
@@ -64,10 +74,16 @@ export class DockviewPanel
6474
private readonly containerApi: DockviewApi,
6575
group: DockviewGroupPanel,
6676
readonly view: IDockviewPanelModel,
67-
options: { renderer?: DockviewPanelRenderer }
77+
options: {
78+
renderer?: DockviewPanelRenderer;
79+
priority?: number;
80+
preferredSize?: number;
81+
}
6882
) {
6983
super();
7084
this._renderer = options.renderer;
85+
this._priority = options.priority;
86+
this._preferredSize = options.preferredSize;
7187
this._group = group;
7288

7389
this.api = new DockviewPanelApiImpl(
@@ -129,6 +145,7 @@ export class DockviewPanel
129145
: undefined,
130146
title: this.title,
131147
renderer: this._renderer,
148+
priority: this._priority,
132149
};
133150
}
134151

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

+5
Original file line numberDiff line numberDiff line change
@@ -225,6 +225,11 @@ export type AddPanelOptions<P extends object = Parameters> = {
225225
* Defaults to `false` which forces newly added panels to become active.
226226
*/
227227
inactive?: boolean;
228+
/**
229+
* Panel resizing priority
230+
*/
231+
priority?: number;
232+
preferredSize?: number;
228233
} & Partial<AddPanelOptionsUnion>;
229234

230235
type AddGroupOptionsWithPanel = {

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

+2
Original file line numberDiff line numberDiff line change
@@ -75,5 +75,7 @@ export interface GroupviewPanelState {
7575
tabComponent?: string;
7676
title?: string;
7777
renderer?: DockviewPanelRenderer;
78+
priority?: number;
79+
preferredSize?: number;
7880
params?: { [key: string]: any };
7981
}

0 commit comments

Comments
 (0)