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.
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * dockview-react
3
- * @version 4.4.1
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('pointerdown', () => {
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: true,
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
- ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
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(() => destinationGroup.model.openPanel(removedPanel, {
9474
- index: destinationIndex,
9475
- skipSetGroupActive: true,
9476
- }));
9477
- this.doSetGroupAndPanelActive(destinationGroup);
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: panel !== activePanel,
9605
+ skipSetActive: true, // Always skip setting panels active during move
9590
9606
  skipSetGroupActive: true,
9591
9607
  });
9592
9608
  }
9593
9609
  });
9594
- this.doSetGroupAndPanelActive(to);
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
- selectedPopoutGroup.disposable.dispose();
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
- if (from.api.location.type !== 'popout') {
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 && tabLocation !== 'headerOverflow' && (React.createElement("div", { className: "dv-default-tab-action", onPointerDown: onBtnPointerDown, onClick: onClose },
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;