dockview-react 4.4.1 → 4.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dockview-react.amd.js +142 -50
- package/dist/dockview-react.amd.js.map +1 -1
- package/dist/dockview-react.amd.min.js +2 -2
- package/dist/dockview-react.amd.min.js.map +1 -1
- package/dist/dockview-react.amd.min.noStyle.js +2 -2
- package/dist/dockview-react.amd.min.noStyle.js.map +1 -1
- package/dist/dockview-react.amd.noStyle.js +141 -49
- package/dist/dockview-react.amd.noStyle.js.map +1 -1
- package/dist/dockview-react.cjs.js +142 -50
- package/dist/dockview-react.cjs.js.map +1 -1
- package/dist/dockview-react.esm.js +143 -50
- package/dist/dockview-react.esm.js.map +1 -1
- package/dist/dockview-react.esm.min.js +2 -2
- package/dist/dockview-react.esm.min.js.map +1 -1
- package/dist/dockview-react.js +142 -50
- package/dist/dockview-react.js.map +1 -1
- package/dist/dockview-react.min.js +2 -2
- package/dist/dockview-react.min.js.map +1 -1
- package/dist/dockview-react.min.noStyle.js +2 -2
- package/dist/dockview-react.min.noStyle.js.map +1 -1
- package/dist/dockview-react.noStyle.js +141 -49
- package/dist/dockview-react.noStyle.js.map +1 -1
- package/dist/styles/dockview.css +5 -0
- package/package.json +5 -6
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-react
|
|
3
|
-
* @version 4.
|
|
3
|
+
* @version 4.6.2
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -5049,6 +5049,40 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
5049
5049
|
}
|
|
5050
5050
|
}
|
|
5051
5051
|
|
|
5052
|
+
class WillShowOverlayLocationEvent {
|
|
5053
|
+
get kind() {
|
|
5054
|
+
return this.options.kind;
|
|
5055
|
+
}
|
|
5056
|
+
get nativeEvent() {
|
|
5057
|
+
return this.event.nativeEvent;
|
|
5058
|
+
}
|
|
5059
|
+
get position() {
|
|
5060
|
+
return this.event.position;
|
|
5061
|
+
}
|
|
5062
|
+
get defaultPrevented() {
|
|
5063
|
+
return this.event.defaultPrevented;
|
|
5064
|
+
}
|
|
5065
|
+
get panel() {
|
|
5066
|
+
return this.options.panel;
|
|
5067
|
+
}
|
|
5068
|
+
get api() {
|
|
5069
|
+
return this.options.api;
|
|
5070
|
+
}
|
|
5071
|
+
get group() {
|
|
5072
|
+
return this.options.group;
|
|
5073
|
+
}
|
|
5074
|
+
preventDefault() {
|
|
5075
|
+
this.event.preventDefault();
|
|
5076
|
+
}
|
|
5077
|
+
getData() {
|
|
5078
|
+
return this.options.getData();
|
|
5079
|
+
}
|
|
5080
|
+
constructor(event, options) {
|
|
5081
|
+
this.event = event;
|
|
5082
|
+
this.options = options;
|
|
5083
|
+
}
|
|
5084
|
+
}
|
|
5085
|
+
|
|
5052
5086
|
class GroupDragHandler extends DragHandler {
|
|
5053
5087
|
constructor(element, accessor, group) {
|
|
5054
5088
|
super(element);
|
|
@@ -5116,6 +5150,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
5116
5150
|
this._element = document.createElement('div');
|
|
5117
5151
|
this._element.className = 'dv-void-container';
|
|
5118
5152
|
this._element.draggable = !this.accessor.options.disableDnd;
|
|
5153
|
+
toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
|
|
5119
5154
|
this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
|
|
5120
5155
|
this.accessor.doSetGroupActive(this.group);
|
|
5121
5156
|
}));
|
|
@@ -5140,6 +5175,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
5140
5175
|
}
|
|
5141
5176
|
updateDragAndDropState() {
|
|
5142
5177
|
this._element.draggable = !this.accessor.options.disableDnd;
|
|
5178
|
+
toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
|
|
5143
5179
|
}
|
|
5144
5180
|
}
|
|
5145
5181
|
|
|
@@ -5660,8 +5696,11 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
5660
5696
|
toggleClass(wrapper, 'dv-tab', true);
|
|
5661
5697
|
toggleClass(wrapper, 'dv-active-tab', panelObject.api.isActive);
|
|
5662
5698
|
toggleClass(wrapper, 'dv-inactive-tab', !panelObject.api.isActive);
|
|
5663
|
-
wrapper.addEventListener('
|
|
5699
|
+
wrapper.addEventListener('click', (event) => {
|
|
5664
5700
|
this.accessor.popupService.close();
|
|
5701
|
+
if (event.defaultPrevented) {
|
|
5702
|
+
return;
|
|
5703
|
+
}
|
|
5665
5704
|
tab.element.scrollIntoView();
|
|
5666
5705
|
tab.panel.api.setActive();
|
|
5667
5706
|
});
|
|
@@ -5778,39 +5817,6 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
5778
5817
|
this._kind = options.kind;
|
|
5779
5818
|
}
|
|
5780
5819
|
}
|
|
5781
|
-
class WillShowOverlayLocationEvent {
|
|
5782
|
-
get kind() {
|
|
5783
|
-
return this.options.kind;
|
|
5784
|
-
}
|
|
5785
|
-
get nativeEvent() {
|
|
5786
|
-
return this.event.nativeEvent;
|
|
5787
|
-
}
|
|
5788
|
-
get position() {
|
|
5789
|
-
return this.event.position;
|
|
5790
|
-
}
|
|
5791
|
-
get defaultPrevented() {
|
|
5792
|
-
return this.event.defaultPrevented;
|
|
5793
|
-
}
|
|
5794
|
-
get panel() {
|
|
5795
|
-
return this.options.panel;
|
|
5796
|
-
}
|
|
5797
|
-
get api() {
|
|
5798
|
-
return this.options.api;
|
|
5799
|
-
}
|
|
5800
|
-
get group() {
|
|
5801
|
-
return this.options.group;
|
|
5802
|
-
}
|
|
5803
|
-
preventDefault() {
|
|
5804
|
-
this.event.preventDefault();
|
|
5805
|
-
}
|
|
5806
|
-
getData() {
|
|
5807
|
-
return this.options.getData();
|
|
5808
|
-
}
|
|
5809
|
-
constructor(event, options) {
|
|
5810
|
-
this.event = event;
|
|
5811
|
-
this.options = options;
|
|
5812
|
-
}
|
|
5813
|
-
}
|
|
5814
5820
|
class DockviewGroupPanelModel extends CompositeDisposable {
|
|
5815
5821
|
get element() {
|
|
5816
5822
|
throw new Error('dockview: not supported');
|
|
@@ -6635,23 +6641,24 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
6635
6641
|
: window;
|
|
6636
6642
|
}
|
|
6637
6643
|
moveTo(options) {
|
|
6638
|
-
var _a, _b, _c;
|
|
6644
|
+
var _a, _b, _c, _d;
|
|
6639
6645
|
if (!this._group) {
|
|
6640
6646
|
throw new Error(NOT_INITIALIZED_MESSAGE);
|
|
6641
6647
|
}
|
|
6642
6648
|
const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
|
|
6643
6649
|
direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
|
|
6644
|
-
skipSetActive:
|
|
6650
|
+
skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
|
|
6645
6651
|
});
|
|
6646
6652
|
this.accessor.moveGroupOrPanel({
|
|
6647
6653
|
from: { groupId: this._group.id },
|
|
6648
6654
|
to: {
|
|
6649
6655
|
group,
|
|
6650
6656
|
position: options.group
|
|
6651
|
-
? (
|
|
6657
|
+
? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
|
|
6652
6658
|
: 'center',
|
|
6653
6659
|
index: options.index,
|
|
6654
6660
|
},
|
|
6661
|
+
skipSetActive: options.skipSetActive,
|
|
6655
6662
|
});
|
|
6656
6663
|
}
|
|
6657
6664
|
maximize() {
|
|
@@ -6883,6 +6890,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
6883
6890
|
: 'center',
|
|
6884
6891
|
index: options.index,
|
|
6885
6892
|
},
|
|
6893
|
+
skipSetActive: options.skipSetActive,
|
|
6886
6894
|
});
|
|
6887
6895
|
}
|
|
6888
6896
|
setTitle(title) {
|
|
@@ -9452,6 +9460,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9452
9460
|
group: destinationGroup,
|
|
9453
9461
|
position: destinationTarget,
|
|
9454
9462
|
},
|
|
9463
|
+
skipSetActive: options.skipSetActive,
|
|
9455
9464
|
});
|
|
9456
9465
|
return;
|
|
9457
9466
|
}
|
|
@@ -9470,11 +9479,17 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9470
9479
|
// remove the group and do not set a new group as active
|
|
9471
9480
|
this.doRemoveGroup(sourceGroup, { skipActive: true });
|
|
9472
9481
|
}
|
|
9473
|
-
this.movingLock(() =>
|
|
9474
|
-
|
|
9475
|
-
|
|
9476
|
-
|
|
9477
|
-
|
|
9482
|
+
this.movingLock(() => {
|
|
9483
|
+
var _a;
|
|
9484
|
+
return destinationGroup.model.openPanel(removedPanel, {
|
|
9485
|
+
index: destinationIndex,
|
|
9486
|
+
skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
|
|
9487
|
+
skipSetGroupActive: true,
|
|
9488
|
+
});
|
|
9489
|
+
});
|
|
9490
|
+
if (!options.skipSetActive) {
|
|
9491
|
+
this.doSetGroupAndPanelActive(destinationGroup);
|
|
9492
|
+
}
|
|
9478
9493
|
this._onDidMovePanel.fire({
|
|
9479
9494
|
panel: removedPanel,
|
|
9480
9495
|
from: sourceGroup,
|
|
@@ -9577,6 +9592,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9577
9592
|
const target = options.to.position;
|
|
9578
9593
|
if (target === 'center') {
|
|
9579
9594
|
const activePanel = from.activePanel;
|
|
9595
|
+
const targetActivePanel = to.activePanel;
|
|
9580
9596
|
const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
|
|
9581
9597
|
skipSetActive: true,
|
|
9582
9598
|
})));
|
|
@@ -9586,12 +9602,23 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9586
9602
|
this.movingLock(() => {
|
|
9587
9603
|
for (const panel of panels) {
|
|
9588
9604
|
to.model.openPanel(panel, {
|
|
9589
|
-
skipSetActive:
|
|
9605
|
+
skipSetActive: true, // Always skip setting panels active during move
|
|
9590
9606
|
skipSetGroupActive: true,
|
|
9591
9607
|
});
|
|
9592
9608
|
}
|
|
9593
9609
|
});
|
|
9594
|
-
|
|
9610
|
+
if (!options.skipSetActive) {
|
|
9611
|
+
// Make the moved panel (from the source group) active
|
|
9612
|
+
if (activePanel) {
|
|
9613
|
+
this.doSetGroupAndPanelActive(to);
|
|
9614
|
+
}
|
|
9615
|
+
}
|
|
9616
|
+
else if (targetActivePanel) {
|
|
9617
|
+
// Ensure the target group's original active panel remains active
|
|
9618
|
+
to.model.openPanel(targetActivePanel, {
|
|
9619
|
+
skipSetGroupActive: true
|
|
9620
|
+
});
|
|
9621
|
+
}
|
|
9595
9622
|
}
|
|
9596
9623
|
else {
|
|
9597
9624
|
switch (from.api.location.type) {
|
|
@@ -9611,12 +9638,39 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9611
9638
|
if (!selectedPopoutGroup) {
|
|
9612
9639
|
throw new Error('failed to find popout group');
|
|
9613
9640
|
}
|
|
9614
|
-
|
|
9641
|
+
// Remove from popout groups list to prevent automatic restoration
|
|
9642
|
+
const index = this._popoutGroups.indexOf(selectedPopoutGroup);
|
|
9643
|
+
if (index >= 0) {
|
|
9644
|
+
this._popoutGroups.splice(index, 1);
|
|
9645
|
+
}
|
|
9646
|
+
// Clean up the reference group (ghost) if it exists and is hidden
|
|
9647
|
+
if (selectedPopoutGroup.referenceGroup) {
|
|
9648
|
+
const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
|
|
9649
|
+
if (referenceGroup && !referenceGroup.api.isVisible) {
|
|
9650
|
+
this.doRemoveGroup(referenceGroup, { skipActive: true });
|
|
9651
|
+
}
|
|
9652
|
+
}
|
|
9653
|
+
// Manually dispose the window without triggering restoration
|
|
9654
|
+
selectedPopoutGroup.window.dispose();
|
|
9655
|
+
// Update group's location and containers for target
|
|
9656
|
+
if (to.api.location.type === 'grid') {
|
|
9657
|
+
from.model.renderContainer = this.overlayRenderContainer;
|
|
9658
|
+
from.model.dropTargetContainer = this.rootDropTargetContainer;
|
|
9659
|
+
from.model.location = { type: 'grid' };
|
|
9660
|
+
}
|
|
9661
|
+
else if (to.api.location.type === 'floating') {
|
|
9662
|
+
from.model.renderContainer = this.overlayRenderContainer;
|
|
9663
|
+
from.model.dropTargetContainer = this.rootDropTargetContainer;
|
|
9664
|
+
from.model.location = { type: 'floating' };
|
|
9665
|
+
}
|
|
9666
|
+
break;
|
|
9615
9667
|
}
|
|
9616
9668
|
}
|
|
9617
|
-
|
|
9669
|
+
// For moves to grid locations
|
|
9670
|
+
if (to.api.location.type === 'grid') {
|
|
9618
9671
|
const referenceLocation = getGridLocation(to.element);
|
|
9619
9672
|
const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
|
|
9673
|
+
// Add to grid for all moves targeting grid location
|
|
9620
9674
|
let size;
|
|
9621
9675
|
switch (this.gridview.orientation) {
|
|
9622
9676
|
case exports.Orientation.VERTICAL:
|
|
@@ -9634,10 +9688,49 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9634
9688
|
}
|
|
9635
9689
|
this.gridview.addView(from, size, dropLocation);
|
|
9636
9690
|
}
|
|
9691
|
+
else if (to.api.location.type === 'floating') {
|
|
9692
|
+
// For moves to floating locations, add as floating group
|
|
9693
|
+
// Get the position/size from the target floating group
|
|
9694
|
+
const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
|
|
9695
|
+
if (targetFloatingGroup) {
|
|
9696
|
+
const box = targetFloatingGroup.overlay.toJSON();
|
|
9697
|
+
// Calculate position based on available properties
|
|
9698
|
+
let left, top;
|
|
9699
|
+
if ('left' in box) {
|
|
9700
|
+
left = box.left + 50;
|
|
9701
|
+
}
|
|
9702
|
+
else if ('right' in box) {
|
|
9703
|
+
left = Math.max(0, box.right - box.width - 50);
|
|
9704
|
+
}
|
|
9705
|
+
else {
|
|
9706
|
+
left = 50; // Default fallback
|
|
9707
|
+
}
|
|
9708
|
+
if ('top' in box) {
|
|
9709
|
+
top = box.top + 50;
|
|
9710
|
+
}
|
|
9711
|
+
else if ('bottom' in box) {
|
|
9712
|
+
top = Math.max(0, box.bottom - box.height - 50);
|
|
9713
|
+
}
|
|
9714
|
+
else {
|
|
9715
|
+
top = 50; // Default fallback
|
|
9716
|
+
}
|
|
9717
|
+
this.addFloatingGroup(from, {
|
|
9718
|
+
height: box.height,
|
|
9719
|
+
width: box.width,
|
|
9720
|
+
position: {
|
|
9721
|
+
left,
|
|
9722
|
+
top,
|
|
9723
|
+
},
|
|
9724
|
+
});
|
|
9725
|
+
}
|
|
9726
|
+
}
|
|
9637
9727
|
}
|
|
9638
9728
|
from.panels.forEach((panel) => {
|
|
9639
9729
|
this._onDidMovePanel.fire({ panel, from });
|
|
9640
9730
|
});
|
|
9731
|
+
if (!options.skipSetActive) {
|
|
9732
|
+
this.doSetGroupAndPanelActive(from);
|
|
9733
|
+
}
|
|
9641
9734
|
}
|
|
9642
9735
|
doSetGroupActive(group) {
|
|
9643
9736
|
super.doSetGroupActive(group);
|
|
@@ -11378,7 +11471,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
11378
11471
|
}, [onPointerLeave]);
|
|
11379
11472
|
return (React.createElement("div", Object.assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onPointerDown: _onPointerDown, onPointerUp: _onPointerUp, onPointerLeave: _onPointerLeave, className: "dv-default-tab" }),
|
|
11380
11473
|
React.createElement("span", { className: "dv-default-tab-content" }, title),
|
|
11381
|
-
!hideClose &&
|
|
11474
|
+
!hideClose && (React.createElement("div", { className: "dv-default-tab-action", onPointerDown: onBtnPointerDown, onClick: onClose },
|
|
11382
11475
|
React.createElement(CloseButton, null)))));
|
|
11383
11476
|
};
|
|
11384
11477
|
|
|
@@ -11725,7 +11818,6 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
11725
11818
|
exports.SplitviewPanel = SplitviewPanel;
|
|
11726
11819
|
exports.SplitviewReact = SplitviewReact;
|
|
11727
11820
|
exports.Tab = Tab;
|
|
11728
|
-
exports.WillShowOverlayLocationEvent = WillShowOverlayLocationEvent;
|
|
11729
11821
|
exports.createDockview = createDockview;
|
|
11730
11822
|
exports.createGridview = createGridview;
|
|
11731
11823
|
exports.createPaneview = createPaneview;
|