dockview-core 4.4.1 → 4.6.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 (56) hide show
  1. package/dist/cjs/api/component.api.d.ts +2 -1
  2. package/dist/cjs/api/dockviewGroupPanelApi.d.ts +4 -0
  3. package/dist/cjs/api/dockviewGroupPanelApi.js +4 -3
  4. package/dist/cjs/api/dockviewPanelApi.js +1 -0
  5. package/dist/cjs/dockview/components/titlebar/tabs.d.ts +1 -1
  6. package/dist/cjs/dockview/components/titlebar/tabs.js +2 -2
  7. package/dist/cjs/dockview/components/titlebar/tabsContainer.d.ts +1 -1
  8. package/dist/cjs/dockview/components/titlebar/tabsContainer.js +6 -3
  9. package/dist/cjs/dockview/components/titlebar/voidContainer.js +3 -0
  10. package/dist/cjs/dockview/dockviewComponent.d.ts +4 -1
  11. package/dist/cjs/dockview/dockviewComponent.js +91 -7
  12. package/dist/cjs/dockview/dockviewGroupPanelModel.d.ts +3 -24
  13. package/dist/cjs/dockview/dockviewGroupPanelModel.js +3 -65
  14. package/dist/cjs/dockview/events.d.ts +28 -0
  15. package/dist/cjs/dockview/events.js +66 -0
  16. package/dist/cjs/dockview/options.d.ts +2 -1
  17. package/dist/dockview-core.amd.js +141 -49
  18. package/dist/dockview-core.amd.js.map +1 -1
  19. package/dist/dockview-core.amd.min.js +2 -2
  20. package/dist/dockview-core.amd.min.js.map +1 -1
  21. package/dist/dockview-core.amd.min.noStyle.js +2 -2
  22. package/dist/dockview-core.amd.min.noStyle.js.map +1 -1
  23. package/dist/dockview-core.amd.noStyle.js +140 -48
  24. package/dist/dockview-core.amd.noStyle.js.map +1 -1
  25. package/dist/dockview-core.cjs.js +141 -49
  26. package/dist/dockview-core.cjs.js.map +1 -1
  27. package/dist/dockview-core.esm.js +142 -49
  28. package/dist/dockview-core.esm.js.map +1 -1
  29. package/dist/dockview-core.esm.min.js +2 -2
  30. package/dist/dockview-core.esm.min.js.map +1 -1
  31. package/dist/dockview-core.js +141 -49
  32. package/dist/dockview-core.js.map +1 -1
  33. package/dist/dockview-core.min.js +2 -2
  34. package/dist/dockview-core.min.js.map +1 -1
  35. package/dist/dockview-core.min.noStyle.js +2 -2
  36. package/dist/dockview-core.min.noStyle.js.map +1 -1
  37. package/dist/dockview-core.noStyle.js +140 -48
  38. package/dist/dockview-core.noStyle.js.map +1 -1
  39. package/dist/esm/api/component.api.d.ts +2 -1
  40. package/dist/esm/api/dockviewGroupPanelApi.d.ts +4 -0
  41. package/dist/esm/api/dockviewGroupPanelApi.js +4 -3
  42. package/dist/esm/api/dockviewPanelApi.js +1 -0
  43. package/dist/esm/dockview/components/titlebar/tabs.d.ts +1 -1
  44. package/dist/esm/dockview/components/titlebar/tabs.js +1 -1
  45. package/dist/esm/dockview/components/titlebar/tabsContainer.d.ts +1 -1
  46. package/dist/esm/dockview/components/titlebar/tabsContainer.js +5 -2
  47. package/dist/esm/dockview/components/titlebar/voidContainer.js +3 -0
  48. package/dist/esm/dockview/dockviewComponent.d.ts +4 -1
  49. package/dist/esm/dockview/dockviewComponent.js +96 -10
  50. package/dist/esm/dockview/dockviewGroupPanelModel.d.ts +3 -24
  51. package/dist/esm/dockview/dockviewGroupPanelModel.js +1 -33
  52. package/dist/esm/dockview/events.d.ts +28 -0
  53. package/dist/esm/dockview/events.js +33 -0
  54. package/dist/esm/dockview/options.d.ts +2 -1
  55. package/dist/styles/dockview.css +5 -0
  56. package/package.json +4 -5
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * dockview-core
3
- * @version 4.4.1
3
+ * @version 4.6.0
4
4
  * @link https://github.com/mathuo/dockview
5
5
  * @license MIT
6
6
  */
@@ -5049,6 +5049,40 @@ define(['exports'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
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'], (function (exports) { 'use strict';
6883
6890
  : 'center',
6884
6891
  index: options.index,
6885
6892
  },
6893
+ skipSetActive: options.skipSetActive,
6886
6894
  });
6887
6895
  }
6888
6896
  setTitle(title) {
@@ -9475,6 +9483,7 @@ define(['exports'], (function (exports) { 'use strict';
9475
9483
  group: destinationGroup,
9476
9484
  position: destinationTarget,
9477
9485
  },
9486
+ skipSetActive: options.skipSetActive,
9478
9487
  });
9479
9488
  return;
9480
9489
  }
@@ -9493,11 +9502,17 @@ define(['exports'], (function (exports) { 'use strict';
9493
9502
  // remove the group and do not set a new group as active
9494
9503
  this.doRemoveGroup(sourceGroup, { skipActive: true });
9495
9504
  }
9496
- this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
9497
- index: destinationIndex,
9498
- skipSetGroupActive: true,
9499
- }));
9500
- this.doSetGroupAndPanelActive(destinationGroup);
9505
+ this.movingLock(() => {
9506
+ var _a;
9507
+ return destinationGroup.model.openPanel(removedPanel, {
9508
+ index: destinationIndex,
9509
+ skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
9510
+ skipSetGroupActive: true,
9511
+ });
9512
+ });
9513
+ if (!options.skipSetActive) {
9514
+ this.doSetGroupAndPanelActive(destinationGroup);
9515
+ }
9501
9516
  this._onDidMovePanel.fire({
9502
9517
  panel: removedPanel,
9503
9518
  from: sourceGroup,
@@ -9600,6 +9615,7 @@ define(['exports'], (function (exports) { 'use strict';
9600
9615
  const target = options.to.position;
9601
9616
  if (target === 'center') {
9602
9617
  const activePanel = from.activePanel;
9618
+ const targetActivePanel = to.activePanel;
9603
9619
  const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
9604
9620
  skipSetActive: true,
9605
9621
  })));
@@ -9609,12 +9625,23 @@ define(['exports'], (function (exports) { 'use strict';
9609
9625
  this.movingLock(() => {
9610
9626
  for (const panel of panels) {
9611
9627
  to.model.openPanel(panel, {
9612
- skipSetActive: panel !== activePanel,
9628
+ skipSetActive: true, // Always skip setting panels active during move
9613
9629
  skipSetGroupActive: true,
9614
9630
  });
9615
9631
  }
9616
9632
  });
9617
- this.doSetGroupAndPanelActive(to);
9633
+ if (!options.skipSetActive) {
9634
+ // Make the moved panel (from the source group) active
9635
+ if (activePanel) {
9636
+ this.doSetGroupAndPanelActive(to);
9637
+ }
9638
+ }
9639
+ else if (targetActivePanel) {
9640
+ // Ensure the target group's original active panel remains active
9641
+ to.model.openPanel(targetActivePanel, {
9642
+ skipSetGroupActive: true
9643
+ });
9644
+ }
9618
9645
  }
9619
9646
  else {
9620
9647
  switch (from.api.location.type) {
@@ -9634,12 +9661,39 @@ define(['exports'], (function (exports) { 'use strict';
9634
9661
  if (!selectedPopoutGroup) {
9635
9662
  throw new Error('failed to find popout group');
9636
9663
  }
9637
- selectedPopoutGroup.disposable.dispose();
9664
+ // Remove from popout groups list to prevent automatic restoration
9665
+ const index = this._popoutGroups.indexOf(selectedPopoutGroup);
9666
+ if (index >= 0) {
9667
+ this._popoutGroups.splice(index, 1);
9668
+ }
9669
+ // Clean up the reference group (ghost) if it exists and is hidden
9670
+ if (selectedPopoutGroup.referenceGroup) {
9671
+ const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
9672
+ if (referenceGroup && !referenceGroup.api.isVisible) {
9673
+ this.doRemoveGroup(referenceGroup, { skipActive: true });
9674
+ }
9675
+ }
9676
+ // Manually dispose the window without triggering restoration
9677
+ selectedPopoutGroup.window.dispose();
9678
+ // Update group's location and containers for target
9679
+ if (to.api.location.type === 'grid') {
9680
+ from.model.renderContainer = this.overlayRenderContainer;
9681
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9682
+ from.model.location = { type: 'grid' };
9683
+ }
9684
+ else if (to.api.location.type === 'floating') {
9685
+ from.model.renderContainer = this.overlayRenderContainer;
9686
+ from.model.dropTargetContainer = this.rootDropTargetContainer;
9687
+ from.model.location = { type: 'floating' };
9688
+ }
9689
+ break;
9638
9690
  }
9639
9691
  }
9640
- if (from.api.location.type !== 'popout') {
9692
+ // For moves to grid locations
9693
+ if (to.api.location.type === 'grid') {
9641
9694
  const referenceLocation = getGridLocation(to.element);
9642
9695
  const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
9696
+ // Add to grid for all moves targeting grid location
9643
9697
  let size;
9644
9698
  switch (this.gridview.orientation) {
9645
9699
  case exports.Orientation.VERTICAL:
@@ -9657,10 +9711,49 @@ define(['exports'], (function (exports) { 'use strict';
9657
9711
  }
9658
9712
  this.gridview.addView(from, size, dropLocation);
9659
9713
  }
9714
+ else if (to.api.location.type === 'floating') {
9715
+ // For moves to floating locations, add as floating group
9716
+ // Get the position/size from the target floating group
9717
+ const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
9718
+ if (targetFloatingGroup) {
9719
+ const box = targetFloatingGroup.overlay.toJSON();
9720
+ // Calculate position based on available properties
9721
+ let left, top;
9722
+ if ('left' in box) {
9723
+ left = box.left + 50;
9724
+ }
9725
+ else if ('right' in box) {
9726
+ left = Math.max(0, box.right - box.width - 50);
9727
+ }
9728
+ else {
9729
+ left = 50; // Default fallback
9730
+ }
9731
+ if ('top' in box) {
9732
+ top = box.top + 50;
9733
+ }
9734
+ else if ('bottom' in box) {
9735
+ top = Math.max(0, box.bottom - box.height - 50);
9736
+ }
9737
+ else {
9738
+ top = 50; // Default fallback
9739
+ }
9740
+ this.addFloatingGroup(from, {
9741
+ height: box.height,
9742
+ width: box.width,
9743
+ position: {
9744
+ left,
9745
+ top,
9746
+ },
9747
+ });
9748
+ }
9749
+ }
9660
9750
  }
9661
9751
  from.panels.forEach((panel) => {
9662
9752
  this._onDidMovePanel.fire({ panel, from });
9663
9753
  });
9754
+ if (!options.skipSetActive) {
9755
+ this.doSetGroupAndPanelActive(from);
9756
+ }
9664
9757
  }
9665
9758
  doSetGroupActive(group) {
9666
9759
  super.doSetGroupActive(group);
@@ -10881,7 +10974,6 @@ define(['exports'], (function (exports) { 'use strict';
10881
10974
  exports.SplitviewComponent = SplitviewComponent;
10882
10975
  exports.SplitviewPanel = SplitviewPanel;
10883
10976
  exports.Tab = Tab;
10884
- exports.WillShowOverlayLocationEvent = WillShowOverlayLocationEvent;
10885
10977
  exports.createDockview = createDockview;
10886
10978
  exports.createGridview = createGridview;
10887
10979
  exports.createPaneview = createPaneview;