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
  */
@@ -4993,7 +4993,7 @@ define(['exports'], (function (exports) { 'use strict';
4993
4993
  this._element = document.createElement('div');
4994
4994
  this._element.className = 'dv-tab';
4995
4995
  this._element.tabIndex = 0;
4996
- this._element.draggable = true;
4996
+ this._element.draggable = !this.accessor.options.disableDnd;
4997
4997
  toggleClass(this.element, 'dv-inactive-tab', true);
4998
4998
  const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
4999
4999
  this.dropTarget = new Droptarget(this._element, {
@@ -5041,6 +5041,9 @@ define(['exports'], (function (exports) { 'use strict';
5041
5041
  this.content = part;
5042
5042
  this._element.appendChild(this.content.element);
5043
5043
  }
5044
+ updateDragAndDropState() {
5045
+ this._element.draggable = !this.accessor.options.disableDnd;
5046
+ }
5044
5047
  dispose() {
5045
5048
  super.dispose();
5046
5049
  }
@@ -5112,7 +5115,7 @@ define(['exports'], (function (exports) { 'use strict';
5112
5115
  this.onDragStart = this._onDragStart.event;
5113
5116
  this._element = document.createElement('div');
5114
5117
  this._element.className = 'dv-void-container';
5115
- this._element.draggable = true;
5118
+ this._element.draggable = !this.accessor.options.disableDnd;
5116
5119
  this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
5117
5120
  this.accessor.doSetGroupActive(this.group);
5118
5121
  }));
@@ -5135,6 +5138,9 @@ define(['exports'], (function (exports) { 'use strict';
5135
5138
  this._onDrop.fire(event);
5136
5139
  }), this.dropTarget);
5137
5140
  }
5141
+ updateDragAndDropState() {
5142
+ this._element.draggable = !this.accessor.options.disableDnd;
5143
+ }
5138
5144
  }
5139
5145
 
5140
5146
  class Scrollbar extends CompositeDisposable {
@@ -5395,6 +5401,11 @@ define(['exports'], (function (exports) { 'use strict';
5395
5401
  .map((x) => x.value.panel.id);
5396
5402
  this._onOverflowTabsChange.fire({ tabs, reset: options.reset });
5397
5403
  }
5404
+ updateDragAndDropState() {
5405
+ for (const tab of this._tabs) {
5406
+ tab.value.updateDragAndDropState();
5407
+ }
5408
+ }
5398
5409
  }
5399
5410
 
5400
5411
  const createSvgElementFromPath = (params) => {
@@ -5667,6 +5678,10 @@ define(['exports'], (function (exports) { 'use strict';
5667
5678
  });
5668
5679
  }));
5669
5680
  }
5681
+ updateDragAndDropState() {
5682
+ this.tabs.updateDragAndDropState();
5683
+ this.voidContainer.updateDragAndDropState();
5684
+ }
5670
5685
  }
5671
5686
 
5672
5687
  class DockviewUnhandledDragOverEvent extends AcceptableEvent {
@@ -6372,6 +6387,9 @@ define(['exports'], (function (exports) { 'use strict';
6372
6387
  }));
6373
6388
  }
6374
6389
  }
6390
+ updateDragAndDropState() {
6391
+ this.tabsContainer.updateDragAndDropState();
6392
+ }
6375
6393
  dispose() {
6376
6394
  var _a, _b, _c;
6377
6395
  super.dispose();
@@ -6617,23 +6635,24 @@ define(['exports'], (function (exports) { 'use strict';
6617
6635
  : window;
6618
6636
  }
6619
6637
  moveTo(options) {
6620
- var _a, _b, _c;
6638
+ var _a, _b, _c, _d;
6621
6639
  if (!this._group) {
6622
6640
  throw new Error(NOT_INITIALIZED_MESSAGE);
6623
6641
  }
6624
6642
  const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
6625
6643
  direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
6626
- skipSetActive: true,
6644
+ skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
6627
6645
  });
6628
6646
  this.accessor.moveGroupOrPanel({
6629
6647
  from: { groupId: this._group.id },
6630
6648
  to: {
6631
6649
  group,
6632
6650
  position: options.group
6633
- ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
6651
+ ? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
6634
6652
  : 'center',
6635
6653
  index: options.index,
6636
6654
  },
6655
+ skipSetActive: options.skipSetActive,
6637
6656
  });
6638
6657
  }
6639
6658
  maximize() {
@@ -6865,6 +6884,7 @@ define(['exports'], (function (exports) { 'use strict';
6865
6884
  : 'center',
6866
6885
  index: options.index,
6867
6886
  },
6887
+ skipSetActive: options.skipSetActive,
6868
6888
  });
6869
6889
  }
6870
6890
  setTitle(title) {
@@ -8844,7 +8864,12 @@ define(['exports'], (function (exports) { 'use strict';
8844
8864
  }
8845
8865
  }
8846
8866
  this.updateDropTargetModel(options);
8867
+ const oldDisableDnd = this.options.disableDnd;
8847
8868
  this._options = Object.assign(Object.assign({}, this.options), options);
8869
+ const newDisableDnd = this.options.disableDnd;
8870
+ if (oldDisableDnd !== newDisableDnd) {
8871
+ this.updateDragAndDropState();
8872
+ }
8848
8873
  if ('theme' in options) {
8849
8874
  this.updateTheme();
8850
8875
  }
@@ -8859,6 +8884,12 @@ define(['exports'], (function (exports) { 'use strict';
8859
8884
  }
8860
8885
  }
8861
8886
  }
8887
+ updateDragAndDropState() {
8888
+ // Update draggable state for all tabs and void containers
8889
+ for (const group of this.groups) {
8890
+ group.model.updateDragAndDropState();
8891
+ }
8892
+ }
8862
8893
  focus() {
8863
8894
  var _a;
8864
8895
  (_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.focus();
@@ -9446,6 +9477,7 @@ define(['exports'], (function (exports) { 'use strict';
9446
9477
  group: destinationGroup,
9447
9478
  position: destinationTarget,
9448
9479
  },
9480
+ skipSetActive: options.skipSetActive,
9449
9481
  });
9450
9482
  return;
9451
9483
  }
@@ -9464,11 +9496,17 @@ define(['exports'], (function (exports) { 'use strict';
9464
9496
  // remove the group and do not set a new group as active
9465
9497
  this.doRemoveGroup(sourceGroup, { skipActive: true });
9466
9498
  }
9467
- this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
9468
- index: destinationIndex,
9469
- skipSetGroupActive: true,
9470
- }));
9471
- this.doSetGroupAndPanelActive(destinationGroup);
9499
+ this.movingLock(() => {
9500
+ var _a;
9501
+ return destinationGroup.model.openPanel(removedPanel, {
9502
+ index: destinationIndex,
9503
+ skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
9504
+ skipSetGroupActive: true,
9505
+ });
9506
+ });
9507
+ if (!options.skipSetActive) {
9508
+ this.doSetGroupAndPanelActive(destinationGroup);
9509
+ }
9472
9510
  this._onDidMovePanel.fire({
9473
9511
  panel: removedPanel,
9474
9512
  from: sourceGroup,
@@ -9571,6 +9609,7 @@ define(['exports'], (function (exports) { 'use strict';
9571
9609
  const target = options.to.position;
9572
9610
  if (target === 'center') {
9573
9611
  const activePanel = from.activePanel;
9612
+ const targetActivePanel = to.activePanel;
9574
9613
  const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
9575
9614
  skipSetActive: true,
9576
9615
  })));
@@ -9580,12 +9619,23 @@ define(['exports'], (function (exports) { 'use strict';
9580
9619
  this.movingLock(() => {
9581
9620
  for (const panel of panels) {
9582
9621
  to.model.openPanel(panel, {
9583
- skipSetActive: panel !== activePanel,
9622
+ skipSetActive: true, // Always skip setting panels active during move
9584
9623
  skipSetGroupActive: true,
9585
9624
  });
9586
9625
  }
9587
9626
  });
9588
- this.doSetGroupAndPanelActive(to);
9627
+ if (!options.skipSetActive) {
9628
+ // Make the moved panel (from the source group) active
9629
+ if (activePanel) {
9630
+ this.doSetGroupAndPanelActive(to);
9631
+ }
9632
+ }
9633
+ else if (targetActivePanel) {
9634
+ // Ensure the target group's original active panel remains active
9635
+ to.model.openPanel(targetActivePanel, {
9636
+ skipSetGroupActive: true
9637
+ });
9638
+ }
9589
9639
  }
9590
9640
  else {
9591
9641
  switch (from.api.location.type) {
@@ -9605,12 +9655,39 @@ define(['exports'], (function (exports) { 'use strict';
9605
9655
  if (!selectedPopoutGroup) {
9606
9656
  throw new Error('failed to find popout group');
9607
9657
  }
9608
- selectedPopoutGroup.disposable.dispose();
9658
+ // Remove from popout groups list to prevent automatic restoration
9659
+ const index = this._popoutGroups.indexOf(selectedPopoutGroup);
9660
+ if (index >= 0) {
9661
+ this._popoutGroups.splice(index, 1);
9662
+ }
9663
+ // Clean up the reference group (ghost) if it exists and is hidden
9664
+ if (selectedPopoutGroup.referenceGroup) {
9665
+ const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
9666
+ if (referenceGroup && !referenceGroup.api.isVisible) {
9667
+ this.doRemoveGroup(referenceGroup, { skipActive: true });
9668
+ }
9669
+ }
9670
+ // Manually dispose the window without triggering restoration
9671
+ selectedPopoutGroup.window.dispose();
9672
+ // Update group's location and containers for target
9673
+ if (to.api.location.type === 'grid') {
9674
+ from.model.renderContainer = this.overlayRenderContainer;
9675
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9676
+ from.model.location = { type: 'grid' };
9677
+ }
9678
+ else if (to.api.location.type === 'floating') {
9679
+ from.model.renderContainer = this.overlayRenderContainer;
9680
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9681
+ from.model.location = { type: 'floating' };
9682
+ }
9683
+ break;
9609
9684
  }
9610
9685
  }
9611
- if (from.api.location.type !== 'popout') {
9686
+ // For moves to grid locations
9687
+ if (to.api.location.type === 'grid') {
9612
9688
  const referenceLocation = getGridLocation(to.element);
9613
9689
  const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
9690
+ // Add to grid for all moves targeting grid location
9614
9691
  let size;
9615
9692
  switch (this.gridview.orientation) {
9616
9693
  case exports.Orientation.VERTICAL:
@@ -9628,10 +9705,49 @@ define(['exports'], (function (exports) { 'use strict';
9628
9705
  }
9629
9706
  this.gridview.addView(from, size, dropLocation);
9630
9707
  }
9708
+ else if (to.api.location.type === 'floating') {
9709
+ // For moves to floating locations, add as floating group
9710
+ // Get the position/size from the target floating group
9711
+ const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
9712
+ if (targetFloatingGroup) {
9713
+ const box = targetFloatingGroup.overlay.toJSON();
9714
+ // Calculate position based on available properties
9715
+ let left, top;
9716
+ if ('left' in box) {
9717
+ left = box.left + 50;
9718
+ }
9719
+ else if ('right' in box) {
9720
+ left = Math.max(0, box.right - box.width - 50);
9721
+ }
9722
+ else {
9723
+ left = 50; // Default fallback
9724
+ }
9725
+ if ('top' in box) {
9726
+ top = box.top + 50;
9727
+ }
9728
+ else if ('bottom' in box) {
9729
+ top = Math.max(0, box.bottom - box.height - 50);
9730
+ }
9731
+ else {
9732
+ top = 50; // Default fallback
9733
+ }
9734
+ this.addFloatingGroup(from, {
9735
+ height: box.height,
9736
+ width: box.width,
9737
+ position: {
9738
+ left,
9739
+ top,
9740
+ },
9741
+ });
9742
+ }
9743
+ }
9631
9744
  }
9632
9745
  from.panels.forEach((panel) => {
9633
9746
  this._onDidMovePanel.fire({ panel, from });
9634
9747
  });
9748
+ if (!options.skipSetActive) {
9749
+ this.doSetGroupAndPanelActive(from);
9750
+ }
9635
9751
  }
9636
9752
  doSetGroupActive(group) {
9637
9753
  super.doSetGroupActive(group);