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
  */
@@ -5027,7 +5027,7 @@
5027
5027
  this._element = document.createElement('div');
5028
5028
  this._element.className = 'dv-tab';
5029
5029
  this._element.tabIndex = 0;
5030
- this._element.draggable = true;
5030
+ this._element.draggable = !this.accessor.options.disableDnd;
5031
5031
  toggleClass(this.element, 'dv-inactive-tab', true);
5032
5032
  const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
5033
5033
  this.dropTarget = new Droptarget(this._element, {
@@ -5075,6 +5075,9 @@
5075
5075
  this.content = part;
5076
5076
  this._element.appendChild(this.content.element);
5077
5077
  }
5078
+ updateDragAndDropState() {
5079
+ this._element.draggable = !this.accessor.options.disableDnd;
5080
+ }
5078
5081
  dispose() {
5079
5082
  super.dispose();
5080
5083
  }
@@ -5146,7 +5149,7 @@
5146
5149
  this.onDragStart = this._onDragStart.event;
5147
5150
  this._element = document.createElement('div');
5148
5151
  this._element.className = 'dv-void-container';
5149
- this._element.draggable = true;
5152
+ this._element.draggable = !this.accessor.options.disableDnd;
5150
5153
  this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
5151
5154
  this.accessor.doSetGroupActive(this.group);
5152
5155
  }));
@@ -5169,6 +5172,9 @@
5169
5172
  this._onDrop.fire(event);
5170
5173
  }), this.dropTarget);
5171
5174
  }
5175
+ updateDragAndDropState() {
5176
+ this._element.draggable = !this.accessor.options.disableDnd;
5177
+ }
5172
5178
  }
5173
5179
 
5174
5180
  class Scrollbar extends CompositeDisposable {
@@ -5429,6 +5435,11 @@
5429
5435
  .map((x) => x.value.panel.id);
5430
5436
  this._onOverflowTabsChange.fire({ tabs, reset: options.reset });
5431
5437
  }
5438
+ updateDragAndDropState() {
5439
+ for (const tab of this._tabs) {
5440
+ tab.value.updateDragAndDropState();
5441
+ }
5442
+ }
5432
5443
  }
5433
5444
 
5434
5445
  const createSvgElementFromPath = (params) => {
@@ -5701,6 +5712,10 @@
5701
5712
  });
5702
5713
  }));
5703
5714
  }
5715
+ updateDragAndDropState() {
5716
+ this.tabs.updateDragAndDropState();
5717
+ this.voidContainer.updateDragAndDropState();
5718
+ }
5704
5719
  }
5705
5720
 
5706
5721
  class DockviewUnhandledDragOverEvent extends AcceptableEvent {
@@ -6406,6 +6421,9 @@
6406
6421
  }));
6407
6422
  }
6408
6423
  }
6424
+ updateDragAndDropState() {
6425
+ this.tabsContainer.updateDragAndDropState();
6426
+ }
6409
6427
  dispose() {
6410
6428
  var _a, _b, _c;
6411
6429
  super.dispose();
@@ -6651,23 +6669,24 @@
6651
6669
  : window;
6652
6670
  }
6653
6671
  moveTo(options) {
6654
- var _a, _b, _c;
6672
+ var _a, _b, _c, _d;
6655
6673
  if (!this._group) {
6656
6674
  throw new Error(NOT_INITIALIZED_MESSAGE);
6657
6675
  }
6658
6676
  const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
6659
6677
  direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
6660
- skipSetActive: true,
6678
+ skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
6661
6679
  });
6662
6680
  this.accessor.moveGroupOrPanel({
6663
6681
  from: { groupId: this._group.id },
6664
6682
  to: {
6665
6683
  group,
6666
6684
  position: options.group
6667
- ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
6685
+ ? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
6668
6686
  : 'center',
6669
6687
  index: options.index,
6670
6688
  },
6689
+ skipSetActive: options.skipSetActive,
6671
6690
  });
6672
6691
  }
6673
6692
  maximize() {
@@ -6899,6 +6918,7 @@
6899
6918
  : 'center',
6900
6919
  index: options.index,
6901
6920
  },
6921
+ skipSetActive: options.skipSetActive,
6902
6922
  });
6903
6923
  }
6904
6924
  setTitle(title) {
@@ -8878,7 +8898,12 @@
8878
8898
  }
8879
8899
  }
8880
8900
  this.updateDropTargetModel(options);
8901
+ const oldDisableDnd = this.options.disableDnd;
8881
8902
  this._options = Object.assign(Object.assign({}, this.options), options);
8903
+ const newDisableDnd = this.options.disableDnd;
8904
+ if (oldDisableDnd !== newDisableDnd) {
8905
+ this.updateDragAndDropState();
8906
+ }
8882
8907
  if ('theme' in options) {
8883
8908
  this.updateTheme();
8884
8909
  }
@@ -8893,6 +8918,12 @@
8893
8918
  }
8894
8919
  }
8895
8920
  }
8921
+ updateDragAndDropState() {
8922
+ // Update draggable state for all tabs and void containers
8923
+ for (const group of this.groups) {
8924
+ group.model.updateDragAndDropState();
8925
+ }
8926
+ }
8896
8927
  focus() {
8897
8928
  var _a;
8898
8929
  (_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.focus();
@@ -9480,6 +9511,7 @@
9480
9511
  group: destinationGroup,
9481
9512
  position: destinationTarget,
9482
9513
  },
9514
+ skipSetActive: options.skipSetActive,
9483
9515
  });
9484
9516
  return;
9485
9517
  }
@@ -9498,11 +9530,17 @@
9498
9530
  // remove the group and do not set a new group as active
9499
9531
  this.doRemoveGroup(sourceGroup, { skipActive: true });
9500
9532
  }
9501
- this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
9502
- index: destinationIndex,
9503
- skipSetGroupActive: true,
9504
- }));
9505
- this.doSetGroupAndPanelActive(destinationGroup);
9533
+ this.movingLock(() => {
9534
+ var _a;
9535
+ return destinationGroup.model.openPanel(removedPanel, {
9536
+ index: destinationIndex,
9537
+ skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
9538
+ skipSetGroupActive: true,
9539
+ });
9540
+ });
9541
+ if (!options.skipSetActive) {
9542
+ this.doSetGroupAndPanelActive(destinationGroup);
9543
+ }
9506
9544
  this._onDidMovePanel.fire({
9507
9545
  panel: removedPanel,
9508
9546
  from: sourceGroup,
@@ -9605,6 +9643,7 @@
9605
9643
  const target = options.to.position;
9606
9644
  if (target === 'center') {
9607
9645
  const activePanel = from.activePanel;
9646
+ const targetActivePanel = to.activePanel;
9608
9647
  const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
9609
9648
  skipSetActive: true,
9610
9649
  })));
@@ -9614,12 +9653,23 @@
9614
9653
  this.movingLock(() => {
9615
9654
  for (const panel of panels) {
9616
9655
  to.model.openPanel(panel, {
9617
- skipSetActive: panel !== activePanel,
9656
+ skipSetActive: true, // Always skip setting panels active during move
9618
9657
  skipSetGroupActive: true,
9619
9658
  });
9620
9659
  }
9621
9660
  });
9622
- this.doSetGroupAndPanelActive(to);
9661
+ if (!options.skipSetActive) {
9662
+ // Make the moved panel (from the source group) active
9663
+ if (activePanel) {
9664
+ this.doSetGroupAndPanelActive(to);
9665
+ }
9666
+ }
9667
+ else if (targetActivePanel) {
9668
+ // Ensure the target group's original active panel remains active
9669
+ to.model.openPanel(targetActivePanel, {
9670
+ skipSetGroupActive: true
9671
+ });
9672
+ }
9623
9673
  }
9624
9674
  else {
9625
9675
  switch (from.api.location.type) {
@@ -9639,12 +9689,39 @@
9639
9689
  if (!selectedPopoutGroup) {
9640
9690
  throw new Error('failed to find popout group');
9641
9691
  }
9642
- selectedPopoutGroup.disposable.dispose();
9692
+ // Remove from popout groups list to prevent automatic restoration
9693
+ const index = this._popoutGroups.indexOf(selectedPopoutGroup);
9694
+ if (index >= 0) {
9695
+ this._popoutGroups.splice(index, 1);
9696
+ }
9697
+ // Clean up the reference group (ghost) if it exists and is hidden
9698
+ if (selectedPopoutGroup.referenceGroup) {
9699
+ const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
9700
+ if (referenceGroup && !referenceGroup.api.isVisible) {
9701
+ this.doRemoveGroup(referenceGroup, { skipActive: true });
9702
+ }
9703
+ }
9704
+ // Manually dispose the window without triggering restoration
9705
+ selectedPopoutGroup.window.dispose();
9706
+ // Update group's location and containers for target
9707
+ if (to.api.location.type === 'grid') {
9708
+ from.model.renderContainer = this.overlayRenderContainer;
9709
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9710
+ from.model.location = { type: 'grid' };
9711
+ }
9712
+ else if (to.api.location.type === 'floating') {
9713
+ from.model.renderContainer = this.overlayRenderContainer;
9714
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9715
+ from.model.location = { type: 'floating' };
9716
+ }
9717
+ break;
9643
9718
  }
9644
9719
  }
9645
- if (from.api.location.type !== 'popout') {
9720
+ // For moves to grid locations
9721
+ if (to.api.location.type === 'grid') {
9646
9722
  const referenceLocation = getGridLocation(to.element);
9647
9723
  const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
9724
+ // Add to grid for all moves targeting grid location
9648
9725
  let size;
9649
9726
  switch (this.gridview.orientation) {
9650
9727
  case exports.Orientation.VERTICAL:
@@ -9662,10 +9739,49 @@
9662
9739
  }
9663
9740
  this.gridview.addView(from, size, dropLocation);
9664
9741
  }
9742
+ else if (to.api.location.type === 'floating') {
9743
+ // For moves to floating locations, add as floating group
9744
+ // Get the position/size from the target floating group
9745
+ const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
9746
+ if (targetFloatingGroup) {
9747
+ const box = targetFloatingGroup.overlay.toJSON();
9748
+ // Calculate position based on available properties
9749
+ let left, top;
9750
+ if ('left' in box) {
9751
+ left = box.left + 50;
9752
+ }
9753
+ else if ('right' in box) {
9754
+ left = Math.max(0, box.right - box.width - 50);
9755
+ }
9756
+ else {
9757
+ left = 50; // Default fallback
9758
+ }
9759
+ if ('top' in box) {
9760
+ top = box.top + 50;
9761
+ }
9762
+ else if ('bottom' in box) {
9763
+ top = Math.max(0, box.bottom - box.height - 50);
9764
+ }
9765
+ else {
9766
+ top = 50; // Default fallback
9767
+ }
9768
+ this.addFloatingGroup(from, {
9769
+ height: box.height,
9770
+ width: box.width,
9771
+ position: {
9772
+ left,
9773
+ top,
9774
+ },
9775
+ });
9776
+ }
9777
+ }
9665
9778
  }
9666
9779
  from.panels.forEach((panel) => {
9667
9780
  this._onDidMovePanel.fire({ panel, from });
9668
9781
  });
9782
+ if (!options.skipSetActive) {
9783
+ this.doSetGroupAndPanelActive(from);
9784
+ }
9669
9785
  }
9670
9786
  doSetGroupActive(group) {
9671
9787
  super.doSetGroupActive(group);