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
  */
@@ -5023,7 +5023,7 @@ define(['exports'], (function (exports) { 'use strict';
5023
5023
  this._element = document.createElement('div');
5024
5024
  this._element.className = 'dv-tab';
5025
5025
  this._element.tabIndex = 0;
5026
- this._element.draggable = true;
5026
+ this._element.draggable = !this.accessor.options.disableDnd;
5027
5027
  toggleClass(this.element, 'dv-inactive-tab', true);
5028
5028
  const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
5029
5029
  this.dropTarget = new Droptarget(this._element, {
@@ -5071,6 +5071,9 @@ define(['exports'], (function (exports) { 'use strict';
5071
5071
  this.content = part;
5072
5072
  this._element.appendChild(this.content.element);
5073
5073
  }
5074
+ updateDragAndDropState() {
5075
+ this._element.draggable = !this.accessor.options.disableDnd;
5076
+ }
5074
5077
  dispose() {
5075
5078
  super.dispose();
5076
5079
  }
@@ -5142,7 +5145,7 @@ define(['exports'], (function (exports) { 'use strict';
5142
5145
  this.onDragStart = this._onDragStart.event;
5143
5146
  this._element = document.createElement('div');
5144
5147
  this._element.className = 'dv-void-container';
5145
- this._element.draggable = true;
5148
+ this._element.draggable = !this.accessor.options.disableDnd;
5146
5149
  this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
5147
5150
  this.accessor.doSetGroupActive(this.group);
5148
5151
  }));
@@ -5165,6 +5168,9 @@ define(['exports'], (function (exports) { 'use strict';
5165
5168
  this._onDrop.fire(event);
5166
5169
  }), this.dropTarget);
5167
5170
  }
5171
+ updateDragAndDropState() {
5172
+ this._element.draggable = !this.accessor.options.disableDnd;
5173
+ }
5168
5174
  }
5169
5175
 
5170
5176
  class Scrollbar extends CompositeDisposable {
@@ -5425,6 +5431,11 @@ define(['exports'], (function (exports) { 'use strict';
5425
5431
  .map((x) => x.value.panel.id);
5426
5432
  this._onOverflowTabsChange.fire({ tabs, reset: options.reset });
5427
5433
  }
5434
+ updateDragAndDropState() {
5435
+ for (const tab of this._tabs) {
5436
+ tab.value.updateDragAndDropState();
5437
+ }
5438
+ }
5428
5439
  }
5429
5440
 
5430
5441
  const createSvgElementFromPath = (params) => {
@@ -5697,6 +5708,10 @@ define(['exports'], (function (exports) { 'use strict';
5697
5708
  });
5698
5709
  }));
5699
5710
  }
5711
+ updateDragAndDropState() {
5712
+ this.tabs.updateDragAndDropState();
5713
+ this.voidContainer.updateDragAndDropState();
5714
+ }
5700
5715
  }
5701
5716
 
5702
5717
  class DockviewUnhandledDragOverEvent extends AcceptableEvent {
@@ -6402,6 +6417,9 @@ define(['exports'], (function (exports) { 'use strict';
6402
6417
  }));
6403
6418
  }
6404
6419
  }
6420
+ updateDragAndDropState() {
6421
+ this.tabsContainer.updateDragAndDropState();
6422
+ }
6405
6423
  dispose() {
6406
6424
  var _a, _b, _c;
6407
6425
  super.dispose();
@@ -6647,23 +6665,24 @@ define(['exports'], (function (exports) { 'use strict';
6647
6665
  : window;
6648
6666
  }
6649
6667
  moveTo(options) {
6650
- var _a, _b, _c;
6668
+ var _a, _b, _c, _d;
6651
6669
  if (!this._group) {
6652
6670
  throw new Error(NOT_INITIALIZED_MESSAGE);
6653
6671
  }
6654
6672
  const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
6655
6673
  direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
6656
- skipSetActive: true,
6674
+ skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
6657
6675
  });
6658
6676
  this.accessor.moveGroupOrPanel({
6659
6677
  from: { groupId: this._group.id },
6660
6678
  to: {
6661
6679
  group,
6662
6680
  position: options.group
6663
- ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
6681
+ ? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
6664
6682
  : 'center',
6665
6683
  index: options.index,
6666
6684
  },
6685
+ skipSetActive: options.skipSetActive,
6667
6686
  });
6668
6687
  }
6669
6688
  maximize() {
@@ -6895,6 +6914,7 @@ define(['exports'], (function (exports) { 'use strict';
6895
6914
  : 'center',
6896
6915
  index: options.index,
6897
6916
  },
6917
+ skipSetActive: options.skipSetActive,
6898
6918
  });
6899
6919
  }
6900
6920
  setTitle(title) {
@@ -8874,7 +8894,12 @@ define(['exports'], (function (exports) { 'use strict';
8874
8894
  }
8875
8895
  }
8876
8896
  this.updateDropTargetModel(options);
8897
+ const oldDisableDnd = this.options.disableDnd;
8877
8898
  this._options = Object.assign(Object.assign({}, this.options), options);
8899
+ const newDisableDnd = this.options.disableDnd;
8900
+ if (oldDisableDnd !== newDisableDnd) {
8901
+ this.updateDragAndDropState();
8902
+ }
8878
8903
  if ('theme' in options) {
8879
8904
  this.updateTheme();
8880
8905
  }
@@ -8889,6 +8914,12 @@ define(['exports'], (function (exports) { 'use strict';
8889
8914
  }
8890
8915
  }
8891
8916
  }
8917
+ updateDragAndDropState() {
8918
+ // Update draggable state for all tabs and void containers
8919
+ for (const group of this.groups) {
8920
+ group.model.updateDragAndDropState();
8921
+ }
8922
+ }
8892
8923
  focus() {
8893
8924
  var _a;
8894
8925
  (_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.focus();
@@ -9476,6 +9507,7 @@ define(['exports'], (function (exports) { 'use strict';
9476
9507
  group: destinationGroup,
9477
9508
  position: destinationTarget,
9478
9509
  },
9510
+ skipSetActive: options.skipSetActive,
9479
9511
  });
9480
9512
  return;
9481
9513
  }
@@ -9494,11 +9526,17 @@ define(['exports'], (function (exports) { 'use strict';
9494
9526
  // remove the group and do not set a new group as active
9495
9527
  this.doRemoveGroup(sourceGroup, { skipActive: true });
9496
9528
  }
9497
- this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
9498
- index: destinationIndex,
9499
- skipSetGroupActive: true,
9500
- }));
9501
- this.doSetGroupAndPanelActive(destinationGroup);
9529
+ this.movingLock(() => {
9530
+ var _a;
9531
+ return destinationGroup.model.openPanel(removedPanel, {
9532
+ index: destinationIndex,
9533
+ skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
9534
+ skipSetGroupActive: true,
9535
+ });
9536
+ });
9537
+ if (!options.skipSetActive) {
9538
+ this.doSetGroupAndPanelActive(destinationGroup);
9539
+ }
9502
9540
  this._onDidMovePanel.fire({
9503
9541
  panel: removedPanel,
9504
9542
  from: sourceGroup,
@@ -9601,6 +9639,7 @@ define(['exports'], (function (exports) { 'use strict';
9601
9639
  const target = options.to.position;
9602
9640
  if (target === 'center') {
9603
9641
  const activePanel = from.activePanel;
9642
+ const targetActivePanel = to.activePanel;
9604
9643
  const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
9605
9644
  skipSetActive: true,
9606
9645
  })));
@@ -9610,12 +9649,23 @@ define(['exports'], (function (exports) { 'use strict';
9610
9649
  this.movingLock(() => {
9611
9650
  for (const panel of panels) {
9612
9651
  to.model.openPanel(panel, {
9613
- skipSetActive: panel !== activePanel,
9652
+ skipSetActive: true, // Always skip setting panels active during move
9614
9653
  skipSetGroupActive: true,
9615
9654
  });
9616
9655
  }
9617
9656
  });
9618
- this.doSetGroupAndPanelActive(to);
9657
+ if (!options.skipSetActive) {
9658
+ // Make the moved panel (from the source group) active
9659
+ if (activePanel) {
9660
+ this.doSetGroupAndPanelActive(to);
9661
+ }
9662
+ }
9663
+ else if (targetActivePanel) {
9664
+ // Ensure the target group's original active panel remains active
9665
+ to.model.openPanel(targetActivePanel, {
9666
+ skipSetGroupActive: true
9667
+ });
9668
+ }
9619
9669
  }
9620
9670
  else {
9621
9671
  switch (from.api.location.type) {
@@ -9635,12 +9685,39 @@ define(['exports'], (function (exports) { 'use strict';
9635
9685
  if (!selectedPopoutGroup) {
9636
9686
  throw new Error('failed to find popout group');
9637
9687
  }
9638
- selectedPopoutGroup.disposable.dispose();
9688
+ // Remove from popout groups list to prevent automatic restoration
9689
+ const index = this._popoutGroups.indexOf(selectedPopoutGroup);
9690
+ if (index >= 0) {
9691
+ this._popoutGroups.splice(index, 1);
9692
+ }
9693
+ // Clean up the reference group (ghost) if it exists and is hidden
9694
+ if (selectedPopoutGroup.referenceGroup) {
9695
+ const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
9696
+ if (referenceGroup && !referenceGroup.api.isVisible) {
9697
+ this.doRemoveGroup(referenceGroup, { skipActive: true });
9698
+ }
9699
+ }
9700
+ // Manually dispose the window without triggering restoration
9701
+ selectedPopoutGroup.window.dispose();
9702
+ // Update group's location and containers for target
9703
+ if (to.api.location.type === 'grid') {
9704
+ from.model.renderContainer = this.overlayRenderContainer;
9705
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9706
+ from.model.location = { type: 'grid' };
9707
+ }
9708
+ else if (to.api.location.type === 'floating') {
9709
+ from.model.renderContainer = this.overlayRenderContainer;
9710
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9711
+ from.model.location = { type: 'floating' };
9712
+ }
9713
+ break;
9639
9714
  }
9640
9715
  }
9641
- if (from.api.location.type !== 'popout') {
9716
+ // For moves to grid locations
9717
+ if (to.api.location.type === 'grid') {
9642
9718
  const referenceLocation = getGridLocation(to.element);
9643
9719
  const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
9720
+ // Add to grid for all moves targeting grid location
9644
9721
  let size;
9645
9722
  switch (this.gridview.orientation) {
9646
9723
  case exports.Orientation.VERTICAL:
@@ -9658,10 +9735,49 @@ define(['exports'], (function (exports) { 'use strict';
9658
9735
  }
9659
9736
  this.gridview.addView(from, size, dropLocation);
9660
9737
  }
9738
+ else if (to.api.location.type === 'floating') {
9739
+ // For moves to floating locations, add as floating group
9740
+ // Get the position/size from the target floating group
9741
+ const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
9742
+ if (targetFloatingGroup) {
9743
+ const box = targetFloatingGroup.overlay.toJSON();
9744
+ // Calculate position based on available properties
9745
+ let left, top;
9746
+ if ('left' in box) {
9747
+ left = box.left + 50;
9748
+ }
9749
+ else if ('right' in box) {
9750
+ left = Math.max(0, box.right - box.width - 50);
9751
+ }
9752
+ else {
9753
+ left = 50; // Default fallback
9754
+ }
9755
+ if ('top' in box) {
9756
+ top = box.top + 50;
9757
+ }
9758
+ else if ('bottom' in box) {
9759
+ top = Math.max(0, box.bottom - box.height - 50);
9760
+ }
9761
+ else {
9762
+ top = 50; // Default fallback
9763
+ }
9764
+ this.addFloatingGroup(from, {
9765
+ height: box.height,
9766
+ width: box.width,
9767
+ position: {
9768
+ left,
9769
+ top,
9770
+ },
9771
+ });
9772
+ }
9773
+ }
9661
9774
  }
9662
9775
  from.panels.forEach((panel) => {
9663
9776
  this._onDidMovePanel.fire({ panel, from });
9664
9777
  });
9778
+ if (!options.skipSetActive) {
9779
+ this.doSetGroupAndPanelActive(from);
9780
+ }
9665
9781
  }
9666
9782
  doSetGroupActive(group) {
9667
9783
  super.doSetGroupActive(group);