dockview-core 4.4.0 → 4.5.0

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.
Files changed (53) hide show
  1. package/dist/cjs/api/dockviewGroupPanelApi.d.ts +4 -0
  2. package/dist/cjs/api/dockviewGroupPanelApi.js +4 -3
  3. package/dist/cjs/api/dockviewPanelApi.js +1 -0
  4. package/dist/cjs/dockview/components/tab/tab.d.ts +1 -0
  5. package/dist/cjs/dockview/components/tab/tab.js +4 -1
  6. package/dist/cjs/dockview/components/titlebar/tabs.d.ts +1 -0
  7. package/dist/cjs/dockview/components/titlebar/tabs.js +16 -0
  8. package/dist/cjs/dockview/components/titlebar/tabsContainer.d.ts +2 -0
  9. package/dist/cjs/dockview/components/titlebar/tabsContainer.js +4 -0
  10. package/dist/cjs/dockview/components/titlebar/voidContainer.d.ts +1 -0
  11. package/dist/cjs/dockview/components/titlebar/voidContainer.js +4 -1
  12. package/dist/cjs/dockview/dockviewComponent.d.ts +3 -0
  13. package/dist/cjs/dockview/dockviewComponent.js +142 -37
  14. package/dist/cjs/dockview/dockviewGroupPanelModel.d.ts +10 -8
  15. package/dist/cjs/dockview/dockviewGroupPanelModel.js +3 -0
  16. package/dist/dockview-core.amd.js +131 -15
  17. package/dist/dockview-core.amd.js.map +1 -1
  18. package/dist/dockview-core.amd.min.js +2 -2
  19. package/dist/dockview-core.amd.min.js.map +1 -1
  20. package/dist/dockview-core.amd.min.noStyle.js +2 -2
  21. package/dist/dockview-core.amd.min.noStyle.js.map +1 -1
  22. package/dist/dockview-core.amd.noStyle.js +131 -15
  23. package/dist/dockview-core.amd.noStyle.js.map +1 -1
  24. package/dist/dockview-core.cjs.js +131 -15
  25. package/dist/dockview-core.cjs.js.map +1 -1
  26. package/dist/dockview-core.esm.js +131 -15
  27. package/dist/dockview-core.esm.js.map +1 -1
  28. package/dist/dockview-core.esm.min.js +2 -2
  29. package/dist/dockview-core.esm.min.js.map +1 -1
  30. package/dist/dockview-core.js +131 -15
  31. package/dist/dockview-core.js.map +1 -1
  32. package/dist/dockview-core.min.js +2 -2
  33. package/dist/dockview-core.min.js.map +1 -1
  34. package/dist/dockview-core.min.noStyle.js +2 -2
  35. package/dist/dockview-core.min.noStyle.js.map +1 -1
  36. package/dist/dockview-core.noStyle.js +131 -15
  37. package/dist/dockview-core.noStyle.js.map +1 -1
  38. package/dist/esm/api/dockviewGroupPanelApi.d.ts +4 -0
  39. package/dist/esm/api/dockviewGroupPanelApi.js +4 -3
  40. package/dist/esm/api/dockviewPanelApi.js +1 -0
  41. package/dist/esm/dockview/components/tab/tab.d.ts +1 -0
  42. package/dist/esm/dockview/components/tab/tab.js +4 -1
  43. package/dist/esm/dockview/components/titlebar/tabs.d.ts +1 -0
  44. package/dist/esm/dockview/components/titlebar/tabs.js +5 -0
  45. package/dist/esm/dockview/components/titlebar/tabsContainer.d.ts +2 -0
  46. package/dist/esm/dockview/components/titlebar/tabsContainer.js +4 -0
  47. package/dist/esm/dockview/components/titlebar/voidContainer.d.ts +1 -0
  48. package/dist/esm/dockview/components/titlebar/voidContainer.js +4 -1
  49. package/dist/esm/dockview/dockviewComponent.d.ts +3 -0
  50. package/dist/esm/dockview/dockviewComponent.js +105 -9
  51. package/dist/esm/dockview/dockviewGroupPanelModel.d.ts +10 -8
  52. package/dist/esm/dockview/dockviewGroupPanelModel.js +3 -0
  53. package/package.json +1 -1
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * dockview-core
3
- * @version 4.4.0
3
+ * @version 4.5.0
4
4
  * @link https://github.com/mathuo/dockview
5
5
  * @license MIT
6
6
  */
@@ -4997,7 +4997,7 @@
4997
4997
  this._element = document.createElement('div');
4998
4998
  this._element.className = 'dv-tab';
4999
4999
  this._element.tabIndex = 0;
5000
- this._element.draggable = true;
5000
+ this._element.draggable = !this.accessor.options.disableDnd;
5001
5001
  toggleClass(this.element, 'dv-inactive-tab', true);
5002
5002
  const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
5003
5003
  this.dropTarget = new Droptarget(this._element, {
@@ -5045,6 +5045,9 @@
5045
5045
  this.content = part;
5046
5046
  this._element.appendChild(this.content.element);
5047
5047
  }
5048
+ updateDragAndDropState() {
5049
+ this._element.draggable = !this.accessor.options.disableDnd;
5050
+ }
5048
5051
  dispose() {
5049
5052
  super.dispose();
5050
5053
  }
@@ -5116,7 +5119,7 @@
5116
5119
  this.onDragStart = this._onDragStart.event;
5117
5120
  this._element = document.createElement('div');
5118
5121
  this._element.className = 'dv-void-container';
5119
- this._element.draggable = true;
5122
+ this._element.draggable = !this.accessor.options.disableDnd;
5120
5123
  this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
5121
5124
  this.accessor.doSetGroupActive(this.group);
5122
5125
  }));
@@ -5139,6 +5142,9 @@
5139
5142
  this._onDrop.fire(event);
5140
5143
  }), this.dropTarget);
5141
5144
  }
5145
+ updateDragAndDropState() {
5146
+ this._element.draggable = !this.accessor.options.disableDnd;
5147
+ }
5142
5148
  }
5143
5149
 
5144
5150
  class Scrollbar extends CompositeDisposable {
@@ -5399,6 +5405,11 @@
5399
5405
  .map((x) => x.value.panel.id);
5400
5406
  this._onOverflowTabsChange.fire({ tabs, reset: options.reset });
5401
5407
  }
5408
+ updateDragAndDropState() {
5409
+ for (const tab of this._tabs) {
5410
+ tab.value.updateDragAndDropState();
5411
+ }
5412
+ }
5402
5413
  }
5403
5414
 
5404
5415
  const createSvgElementFromPath = (params) => {
@@ -5671,6 +5682,10 @@
5671
5682
  });
5672
5683
  }));
5673
5684
  }
5685
+ updateDragAndDropState() {
5686
+ this.tabs.updateDragAndDropState();
5687
+ this.voidContainer.updateDragAndDropState();
5688
+ }
5674
5689
  }
5675
5690
 
5676
5691
  class DockviewUnhandledDragOverEvent extends AcceptableEvent {
@@ -6376,6 +6391,9 @@
6376
6391
  }));
6377
6392
  }
6378
6393
  }
6394
+ updateDragAndDropState() {
6395
+ this.tabsContainer.updateDragAndDropState();
6396
+ }
6379
6397
  dispose() {
6380
6398
  var _a, _b, _c;
6381
6399
  super.dispose();
@@ -6621,23 +6639,24 @@
6621
6639
  : window;
6622
6640
  }
6623
6641
  moveTo(options) {
6624
- var _a, _b, _c;
6642
+ var _a, _b, _c, _d;
6625
6643
  if (!this._group) {
6626
6644
  throw new Error(NOT_INITIALIZED_MESSAGE);
6627
6645
  }
6628
6646
  const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
6629
6647
  direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
6630
- skipSetActive: true,
6648
+ skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
6631
6649
  });
6632
6650
  this.accessor.moveGroupOrPanel({
6633
6651
  from: { groupId: this._group.id },
6634
6652
  to: {
6635
6653
  group,
6636
6654
  position: options.group
6637
- ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
6655
+ ? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
6638
6656
  : 'center',
6639
6657
  index: options.index,
6640
6658
  },
6659
+ skipSetActive: options.skipSetActive,
6641
6660
  });
6642
6661
  }
6643
6662
  maximize() {
@@ -6869,6 +6888,7 @@
6869
6888
  : 'center',
6870
6889
  index: options.index,
6871
6890
  },
6891
+ skipSetActive: options.skipSetActive,
6872
6892
  });
6873
6893
  }
6874
6894
  setTitle(title) {
@@ -8848,7 +8868,12 @@
8848
8868
  }
8849
8869
  }
8850
8870
  this.updateDropTargetModel(options);
8871
+ const oldDisableDnd = this.options.disableDnd;
8851
8872
  this._options = Object.assign(Object.assign({}, this.options), options);
8873
+ const newDisableDnd = this.options.disableDnd;
8874
+ if (oldDisableDnd !== newDisableDnd) {
8875
+ this.updateDragAndDropState();
8876
+ }
8852
8877
  if ('theme' in options) {
8853
8878
  this.updateTheme();
8854
8879
  }
@@ -8863,6 +8888,12 @@
8863
8888
  }
8864
8889
  }
8865
8890
  }
8891
+ updateDragAndDropState() {
8892
+ // Update draggable state for all tabs and void containers
8893
+ for (const group of this.groups) {
8894
+ group.model.updateDragAndDropState();
8895
+ }
8896
+ }
8866
8897
  focus() {
8867
8898
  var _a;
8868
8899
  (_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.focus();
@@ -9450,6 +9481,7 @@
9450
9481
  group: destinationGroup,
9451
9482
  position: destinationTarget,
9452
9483
  },
9484
+ skipSetActive: options.skipSetActive,
9453
9485
  });
9454
9486
  return;
9455
9487
  }
@@ -9468,11 +9500,17 @@
9468
9500
  // remove the group and do not set a new group as active
9469
9501
  this.doRemoveGroup(sourceGroup, { skipActive: true });
9470
9502
  }
9471
- this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
9472
- index: destinationIndex,
9473
- skipSetGroupActive: true,
9474
- }));
9475
- this.doSetGroupAndPanelActive(destinationGroup);
9503
+ this.movingLock(() => {
9504
+ var _a;
9505
+ return destinationGroup.model.openPanel(removedPanel, {
9506
+ index: destinationIndex,
9507
+ skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
9508
+ skipSetGroupActive: true,
9509
+ });
9510
+ });
9511
+ if (!options.skipSetActive) {
9512
+ this.doSetGroupAndPanelActive(destinationGroup);
9513
+ }
9476
9514
  this._onDidMovePanel.fire({
9477
9515
  panel: removedPanel,
9478
9516
  from: sourceGroup,
@@ -9575,6 +9613,7 @@
9575
9613
  const target = options.to.position;
9576
9614
  if (target === 'center') {
9577
9615
  const activePanel = from.activePanel;
9616
+ const targetActivePanel = to.activePanel;
9578
9617
  const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
9579
9618
  skipSetActive: true,
9580
9619
  })));
@@ -9584,12 +9623,23 @@
9584
9623
  this.movingLock(() => {
9585
9624
  for (const panel of panels) {
9586
9625
  to.model.openPanel(panel, {
9587
- skipSetActive: panel !== activePanel,
9626
+ skipSetActive: true, // Always skip setting panels active during move
9588
9627
  skipSetGroupActive: true,
9589
9628
  });
9590
9629
  }
9591
9630
  });
9592
- this.doSetGroupAndPanelActive(to);
9631
+ if (!options.skipSetActive) {
9632
+ // Make the moved panel (from the source group) active
9633
+ if (activePanel) {
9634
+ this.doSetGroupAndPanelActive(to);
9635
+ }
9636
+ }
9637
+ else if (targetActivePanel) {
9638
+ // Ensure the target group's original active panel remains active
9639
+ to.model.openPanel(targetActivePanel, {
9640
+ skipSetGroupActive: true
9641
+ });
9642
+ }
9593
9643
  }
9594
9644
  else {
9595
9645
  switch (from.api.location.type) {
@@ -9609,12 +9659,39 @@
9609
9659
  if (!selectedPopoutGroup) {
9610
9660
  throw new Error('failed to find popout group');
9611
9661
  }
9612
- selectedPopoutGroup.disposable.dispose();
9662
+ // Remove from popout groups list to prevent automatic restoration
9663
+ const index = this._popoutGroups.indexOf(selectedPopoutGroup);
9664
+ if (index >= 0) {
9665
+ this._popoutGroups.splice(index, 1);
9666
+ }
9667
+ // Clean up the reference group (ghost) if it exists and is hidden
9668
+ if (selectedPopoutGroup.referenceGroup) {
9669
+ const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
9670
+ if (referenceGroup && !referenceGroup.api.isVisible) {
9671
+ this.doRemoveGroup(referenceGroup, { skipActive: true });
9672
+ }
9673
+ }
9674
+ // Manually dispose the window without triggering restoration
9675
+ selectedPopoutGroup.window.dispose();
9676
+ // Update group's location and containers for target
9677
+ if (to.api.location.type === 'grid') {
9678
+ from.model.renderContainer = this.overlayRenderContainer;
9679
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9680
+ from.model.location = { type: 'grid' };
9681
+ }
9682
+ else if (to.api.location.type === 'floating') {
9683
+ from.model.renderContainer = this.overlayRenderContainer;
9684
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9685
+ from.model.location = { type: 'floating' };
9686
+ }
9687
+ break;
9613
9688
  }
9614
9689
  }
9615
- if (from.api.location.type !== 'popout') {
9690
+ // For moves to grid locations
9691
+ if (to.api.location.type === 'grid') {
9616
9692
  const referenceLocation = getGridLocation(to.element);
9617
9693
  const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
9694
+ // Add to grid for all moves targeting grid location
9618
9695
  let size;
9619
9696
  switch (this.gridview.orientation) {
9620
9697
  case exports.Orientation.VERTICAL:
@@ -9632,10 +9709,49 @@
9632
9709
  }
9633
9710
  this.gridview.addView(from, size, dropLocation);
9634
9711
  }
9712
+ else if (to.api.location.type === 'floating') {
9713
+ // For moves to floating locations, add as floating group
9714
+ // Get the position/size from the target floating group
9715
+ const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
9716
+ if (targetFloatingGroup) {
9717
+ const box = targetFloatingGroup.overlay.toJSON();
9718
+ // Calculate position based on available properties
9719
+ let left, top;
9720
+ if ('left' in box) {
9721
+ left = box.left + 50;
9722
+ }
9723
+ else if ('right' in box) {
9724
+ left = Math.max(0, box.right - box.width - 50);
9725
+ }
9726
+ else {
9727
+ left = 50; // Default fallback
9728
+ }
9729
+ if ('top' in box) {
9730
+ top = box.top + 50;
9731
+ }
9732
+ else if ('bottom' in box) {
9733
+ top = Math.max(0, box.bottom - box.height - 50);
9734
+ }
9735
+ else {
9736
+ top = 50; // Default fallback
9737
+ }
9738
+ this.addFloatingGroup(from, {
9739
+ height: box.height,
9740
+ width: box.width,
9741
+ position: {
9742
+ left,
9743
+ top,
9744
+ },
9745
+ });
9746
+ }
9747
+ }
9635
9748
  }
9636
9749
  from.panels.forEach((panel) => {
9637
9750
  this._onDidMovePanel.fire({ panel, from });
9638
9751
  });
9752
+ if (!options.skipSetActive) {
9753
+ this.doSetGroupAndPanelActive(from);
9754
+ }
9639
9755
  }
9640
9756
  doSetGroupActive(group) {
9641
9757
  super.doSetGroupActive(group);