dockview-core 2.1.1 → 2.1.3

package/dist/cjs/dockview/dockviewComponent.d.ts

@@ -208,6 +208,7 @@ export declare class DockviewComponent extends BaseGrid<DockviewGroupPanel> impl
     get gap(): number;
     get floatingGroups(): DockviewFloatingGroupPanel[];
     constructor(parentElement: HTMLElement, options: DockviewComponentOptions);
+    dispose(): void;
     setVisible(panel: DockviewGroupPanel, visible: boolean): void;
     addPopoutGroup(itemToPopout: DockviewPanel | DockviewGroupPanel, options?: DockviewPopoutGroupOptions): Promise<boolean>;
     addFloatingGroup(item: DockviewPanel | DockviewGroupPanel, options?: FloatingGroupOptionsInternal): void;

package/dist/cjs/dockview/dockviewComponent.js

@@ -86,6 +86,7 @@ var dockviewFloatingGroupPanel_1 = require("./dockviewFloatingGroupPanel");
 var constants_1 = require("../constants");
 var overlayRenderContainer_1 = require("../overlay/overlayRenderContainer");
 var popoutWindow_1 = require("../popoutWindow");
+var strictEventsSequencing_1 = require("./strictEventsSequencing");
 var DEFAULT_ROOT_OVERLAY_MODEL = {
     activationSize: { type: 'pixels', value: 10 },
     size: { type: 'pixels', value: 20 },
@@ -158,7 +159,10 @@ var DockviewComponent = /** @class */ (function (_super) {
         _this.overlayRenderContainer = new overlayRenderContainer_1.OverlayRenderContainer(_this.gridview.element, _this);
         (0, dom_1.toggleClass)(_this.gridview.element, 'dv-dockview', true);
         (0, dom_1.toggleClass)(_this.element, 'dv-debug', !!options.debug);
-        _this.addDisposables(_this.overlayRenderContainer, _this._onWillDragPanel, _this._onWillDragGroup, _this._onWillShowOverlay, _this._onDidActivePanelChange, _this._onDidAddPanel, _this._onDidRemovePanel, _this._onDidLayoutFromJSON, _this._onDidDrop, _this._onWillDrop, _this._onDidMovePanel, _this._onDidAddGroup, _this._onDidRemoveGroup, _this._onDidActiveGroupChange, _this._onUnhandledDragOverEvent, _this.onDidViewVisibilityChangeMicroTaskQueue(function () {
+        if (options.debug) {
+            _this.addDisposables(new strictEventsSequencing_1.StrictEventsSequencing(_this));
+        }
+        _this.addDisposables(_this.overlayRenderContainer, _this._onWillDragPanel, _this._onWillDragGroup, _this._onWillShowOverlay, _this._onDidActivePanelChange, _this._onDidAddPanel, _this._onDidRemovePanel, _this._onDidLayoutFromJSON, _this._onDidDrop, _this._onWillDrop, _this._onDidMovePanel, _this._onDidAddGroup, _this._onDidRemoveGroup, _this._onDidActiveGroupChange, _this._onUnhandledDragOverEvent, _this._onDidMaximizedGroupChange, _this.onDidViewVisibilityChangeMicroTaskQueue(function () {
             _this.updateWatermark();
         }), _this.onDidAdd(function (event) {
             if (!_this._moving) {
@@ -365,6 +369,10 @@ var DockviewComponent = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    DockviewComponent.prototype.dispose = function () {
+        this.clear(); // explicitly clear the layout before cleaning up
+        _super.prototype.dispose.call(this);
+    };
     DockviewComponent.prototype.setVisible = function (panel, visible) {
         switch (panel.api.location.type) {
             case 'grid':
@@ -424,6 +432,7 @@ var DockviewComponent = /** @class */ (function (_super) {
         return _window
             .open()
             .then(function (popoutContainer) {
+            var _a;
             if (_window.isDisposed) {
                 return false;
             }
@@ -456,6 +465,7 @@ var DockviewComponent = /** @class */ (function (_super) {
             }
             group.model.renderContainer = overlayRenderContainer;
             group.layout(_window.window.innerWidth, _window.window.innerHeight);
+            var floatingBox;
             if (!(options === null || options === void 0 ? void 0 : options.overridePopoutGroup) && isGroupAddedToDom) {
                 if (itemToPopout instanceof dockviewPanel_1.DockviewPanel) {
                     _this.movingLock(function () {
@@ -476,6 +486,11 @@ var DockviewComponent = /** @class */ (function (_super) {
                             break;
                         case 'floating':
                         case 'popout':
+                            floatingBox = (_a = _this._floatingGroups
+                                .find(function (value) {
+                                return value.group.api.id ===
+                                    itemToPopout.api.id;
+                            })) === null || _a === void 0 ? void 0 : _a.overlay.toJSON();
                             _this.removeGroup(referenceGroup);
                             break;
                     }
@@ -548,18 +563,30 @@ var DockviewComponent = /** @class */ (function (_super) {
                     }
                 }
                 else if (_this.getPanel(group.id)) {
-                    _this.doRemoveGroup(group, {
-                        skipDispose: true,
-                        skipActive: true,
-                        skipPopoutReturn: true,
-                    });
-                    var removedGroup = group;
-                    removedGroup.model.renderContainer =
-                        _this.overlayRenderContainer;
-                    removedGroup.model.location = { type: 'grid' };
-                    returnedGroup = removedGroup;
-                    _this.doAddGroup(removedGroup, [0]);
-                    _this.doSetGroupAndPanelActive(removedGroup);
+                    var removedGroup_1 = group;
+                    if (floatingBox) {
+                        _this.addFloatingGroup(removedGroup_1, {
+                            height: floatingBox.height,
+                            width: floatingBox.width,
+                            position: floatingBox,
+                        });
+                    }
+                    else {
+                        _this.doRemoveGroup(removedGroup_1, {
+                            skipDispose: true,
+                            skipActive: true,
+                            skipPopoutReturn: true,
+                        });
+                        removedGroup_1.model.renderContainer =
+                            _this.overlayRenderContainer;
+                        removedGroup_1.model.location = { type: 'grid' };
+                        returnedGroup = removedGroup_1;
+                        _this.movingLock(function () {
+                            // suppress group add events since the group already exists
+                            _this.doAddGroup(removedGroup_1, [0]);
+                        });
+                    }
+                    _this.doSetGroupAndPanelActive(removedGroup_1);
                 }
             }));
             _this._popoutGroups.push(value);
@@ -942,6 +969,7 @@ var DockviewComponent = /** @class */ (function (_super) {
                     locked: !!locked,
                     hideHeader: !!hideHeader,
                 });
+                _this._onDidAddGroup.fire(group);
                 var createdPanels = [];
                 try {
                     for (var views_1 = __values(views), views_1_1 = views_1.next(); !views_1_1.done; views_1_1 = views_1.next()) {
@@ -962,7 +990,6 @@ var DockviewComponent = /** @class */ (function (_super) {
                     }
                     finally { if (e_12) throw e_12.error; }
                 }
-                _this._onDidAddGroup.fire(group);
                 for (var i = 0; i < views.length; i++) {
                     var panel = createdPanels[i];
                     var isActive = typeof activeView === 'string' &&
@@ -1608,9 +1635,7 @@ var DockviewComponent = /** @class */ (function (_super) {
                     this.doRemoveGroup(sourceGroup, { skipActive: true });
                     var newGroup_1 = this.createGroupAtLocation(targetLocation);
                     this.movingLock(function () {
-                        return newGroup_1.model.openPanel(removedPanel_2, {
-                            skipSetActive: true,
-                        });
+                        return newGroup_1.model.openPanel(removedPanel_2);
                     });
                     this.doSetGroupAndPanelActive(newGroup_1);
                     this._onDidMovePanel.fire({

package/dist/cjs/dockview/dockviewGroupPanelModel.js

@@ -262,7 +262,7 @@ var DockviewGroupPanelModel = /** @class */ (function (_super) {
                 group: _this.groupPanel,
                 getData: dataTransfer_1.getPanelData,
             }));
-        }), _this._onMove, _this._onDidChange, _this._onDidDrop, _this._onWillDrop, _this._onDidAddPanel, _this._onDidRemovePanel, _this._onDidActivePanelChange, _this._onUnhandledDragOverEvent);
+        }), _this._onMove, _this._onDidChange, _this._onDidDrop, _this._onWillDrop, _this._onDidAddPanel, _this._onDidRemovePanel, _this._onDidActivePanelChange, _this._onUnhandledDragOverEvent, _this._onDidPanelTitleChange, _this._onDidPanelParametersChange);
         return _this;
     }
     Object.defineProperty(DockviewGroupPanelModel.prototype, "element", {

package/dist/cjs/dockview/strictEventsSequencing.d.ts

@@ -0,0 +1,7 @@
+import { CompositeDisposable } from '../lifecycle';
+import { DockviewComponent } from './dockviewComponent';
+export declare class StrictEventsSequencing extends CompositeDisposable {
+    private readonly accessor;
+    constructor(accessor: DockviewComponent);
+    private init;
+}

package/dist/cjs/dockview/strictEventsSequencing.js

@@ -0,0 +1,63 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StrictEventsSequencing = void 0;
+var lifecycle_1 = require("../lifecycle");
+var StrictEventsSequencing = /** @class */ (function (_super) {
+    __extends(StrictEventsSequencing, _super);
+    function StrictEventsSequencing(accessor) {
+        var _this = _super.call(this) || this;
+        _this.accessor = accessor;
+        _this.init();
+        return _this;
+    }
+    StrictEventsSequencing.prototype.init = function () {
+        var panels = new Set();
+        var groups = new Set();
+        this.addDisposables(this.accessor.onDidAddPanel(function (panel) {
+            if (panels.has(panel.api.id)) {
+                throw new Error("dockview: Invalid event sequence. [onDidAddPanel] called for panel ".concat(panel.api.id, " but panel already exists"));
+            }
+            else {
+                panels.add(panel.api.id);
+            }
+        }), this.accessor.onDidRemovePanel(function (panel) {
+            if (!panels.has(panel.api.id)) {
+                throw new Error("dockview: Invalid event sequence. [onDidRemovePanel] called for panel ".concat(panel.api.id, " but panel does not exists"));
+            }
+            else {
+                panels.delete(panel.api.id);
+            }
+        }), this.accessor.onDidAddGroup(function (group) {
+            if (groups.has(group.api.id)) {
+                throw new Error("dockview: Invalid event sequence. [onDidAddGroup] called for group ".concat(group.api.id, " but group already exists"));
+            }
+            else {
+                groups.add(group.api.id);
+            }
+        }), this.accessor.onDidRemoveGroup(function (group) {
+            if (!groups.has(group.api.id)) {
+                throw new Error("dockview: Invalid event sequence. [onDidRemoveGroup] called for group ".concat(group.api.id, " but group does not exists"));
+            }
+            else {
+                groups.delete(group.api.id);
+            }
+        }));
+    };
+    return StrictEventsSequencing;
+}(lifecycle_1.CompositeDisposable));
+exports.StrictEventsSequencing = StrictEventsSequencing;

package/dist/cjs/gridview/baseComponentGridview.js

@@ -95,7 +95,7 @@ var BaseGrid = /** @class */ (function (_super) {
             _this._bufferOnDidLayoutChange.fire();
         }), events_1.Event.any(_this.onDidAdd, _this.onDidRemove, _this.onDidActiveChange)(function () {
             _this._bufferOnDidLayoutChange.fire();
-        }), _this._bufferOnDidLayoutChange);
+        }), _this._onDidMaximizedChange, _this._onDidViewVisibilityChangeMicroTaskQueue, _this._bufferOnDidLayoutChange);
         return _this;
     }
     Object.defineProperty(BaseGrid.prototype, "id", {

package/dist/dockview-core.amd.js

@@ -1,6 +1,6 @@
 /**
  * dockview-core
- * @version 2.1.1
+ * @version 2.1.3
  * @link https://github.com/mathuo/dockview
  * @license MIT
  */
@@ -2796,7 +2796,7 @@ define(['exports'], (function (exports) { 'use strict';
               this._bufferOnDidLayoutChange.fire();
           }), exports.DockviewEvent.any(this.onDidAdd, this.onDidRemove, this.onDidActiveChange)(() => {
               this._bufferOnDidLayoutChange.fire();
-          }), this._bufferOnDidLayoutChange);
+          }), this._onDidMaximizedChange, this._onDidViewVisibilityChangeMicroTaskQueue, this._bufferOnDidLayoutChange);
       }
       setVisible(panel, visible) {
           this.gridview.setViewVisible(getGridLocation(panel.element), visible);
@@ -5397,7 +5397,7 @@ define(['exports'], (function (exports) { 'use strict';
                   group: this.groupPanel,
                   getData: getPanelData,
               }));
-          }), this._onMove, this._onDidChange, this._onDidDrop, this._onWillDrop, this._onDidAddPanel, this._onDidRemovePanel, this._onDidActivePanelChange, this._onUnhandledDragOverEvent);
+          }), this._onMove, this._onDidChange, this._onDidDrop, this._onWillDrop, this._onDidAddPanel, this._onDidRemovePanel, this._onDidActivePanelChange, this._onUnhandledDragOverEvent, this._onDidPanelTitleChange, this._onDidPanelParametersChange);
       }
       focusContent() {
           this.contentContainer.element.focus();
@@ -7399,6 +7399,47 @@ define(['exports'], (function (exports) { 'use strict';
       }
   }
 
+  class StrictEventsSequencing extends CompositeDisposable {
+      constructor(accessor) {
+          super();
+          this.accessor = accessor;
+          this.init();
+      }
+      init() {
+          const panels = new Set();
+          const groups = new Set();
+          this.addDisposables(this.accessor.onDidAddPanel((panel) => {
+              if (panels.has(panel.api.id)) {
+                  throw new Error(`dockview: Invalid event sequence. [onDidAddPanel] called for panel ${panel.api.id} but panel already exists`);
+              }
+              else {
+                  panels.add(panel.api.id);
+              }
+          }), this.accessor.onDidRemovePanel((panel) => {
+              if (!panels.has(panel.api.id)) {
+                  throw new Error(`dockview: Invalid event sequence. [onDidRemovePanel] called for panel ${panel.api.id} but panel does not exists`);
+              }
+              else {
+                  panels.delete(panel.api.id);
+              }
+          }), this.accessor.onDidAddGroup((group) => {
+              if (groups.has(group.api.id)) {
+                  throw new Error(`dockview: Invalid event sequence. [onDidAddGroup] called for group ${group.api.id} but group already exists`);
+              }
+              else {
+                  groups.add(group.api.id);
+              }
+          }), this.accessor.onDidRemoveGroup((group) => {
+              if (!groups.has(group.api.id)) {
+                  throw new Error(`dockview: Invalid event sequence. [onDidRemoveGroup] called for group ${group.api.id} but group does not exists`);
+              }
+              else {
+                  groups.delete(group.api.id);
+              }
+          }));
+      }
+  }
+
   const DEFAULT_ROOT_OVERLAY_MODEL = {
       activationSize: { type: 'pixels', value: 10 },
       size: { type: 'pixels', value: 20 },
@@ -7502,7 +7543,10 @@ define(['exports'], (function (exports) { 'use strict';
           this.overlayRenderContainer = new OverlayRenderContainer(this.gridview.element, this);
           toggleClass(this.gridview.element, 'dv-dockview', true);
           toggleClass(this.element, 'dv-debug', !!options.debug);
-          this.addDisposables(this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
+          if (options.debug) {
+              this.addDisposables(new StrictEventsSequencing(this));
+          }
+          this.addDisposables(this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this._onDidMaximizedGroupChange, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
               this.updateWatermark();
           }), this.onDidAdd((event) => {
               if (!this._moving) {
@@ -7619,6 +7663,10 @@ define(['exports'], (function (exports) { 'use strict';
           this._api = new DockviewApi(this);
           this.updateWatermark();
       }
+      dispose() {
+          this.clear(); // explicitly clear the layout before cleaning up
+          super.dispose();
+      }
       setVisible(panel, visible) {
           switch (panel.api.location.type) {
               case 'grid':
@@ -7677,6 +7725,7 @@ define(['exports'], (function (exports) { 'use strict';
           return _window
               .open()
               .then((popoutContainer) => {
+              var _a;
               if (_window.isDisposed) {
                   return false;
               }
@@ -7709,6 +7758,7 @@ define(['exports'], (function (exports) { 'use strict';
               }
               group.model.renderContainer = overlayRenderContainer;
               group.layout(_window.window.innerWidth, _window.window.innerHeight);
+              let floatingBox;
               if (!(options === null || options === void 0 ? void 0 : options.overridePopoutGroup) && isGroupAddedToDom) {
                   if (itemToPopout instanceof DockviewPanel) {
                       this.movingLock(() => {
@@ -7727,6 +7777,9 @@ define(['exports'], (function (exports) { 'use strict';
                               break;
                           case 'floating':
                           case 'popout':
+                              floatingBox = (_a = this._floatingGroups
+                                  .find((value) => value.group.api.id ===
+                                  itemToPopout.api.id)) === null || _a === void 0 ? void 0 : _a.overlay.toJSON();
                               this.removeGroup(referenceGroup);
                               break;
                       }
@@ -7797,17 +7850,29 @@ define(['exports'], (function (exports) { 'use strict';
                       }
                   }
                   else if (this.getPanel(group.id)) {
-                      this.doRemoveGroup(group, {
-                          skipDispose: true,
-                          skipActive: true,
-                          skipPopoutReturn: true,
-                      });
                       const removedGroup = group;
-                      removedGroup.model.renderContainer =
-                          this.overlayRenderContainer;
-                      removedGroup.model.location = { type: 'grid' };
-                      returnedGroup = removedGroup;
-                      this.doAddGroup(removedGroup, [0]);
+                      if (floatingBox) {
+                          this.addFloatingGroup(removedGroup, {
+                              height: floatingBox.height,
+                              width: floatingBox.width,
+                              position: floatingBox,
+                          });
+                      }
+                      else {
+                          this.doRemoveGroup(removedGroup, {
+                              skipDispose: true,
+                              skipActive: true,
+                              skipPopoutReturn: true,
+                          });
+                          removedGroup.model.renderContainer =
+                              this.overlayRenderContainer;
+                          removedGroup.model.location = { type: 'grid' };
+                          returnedGroup = removedGroup;
+                          this.movingLock(() => {
+                              // suppress group add events since the group already exists
+                              this.doAddGroup(removedGroup, [0]);
+                          });
+                      }
                       this.doSetGroupAndPanelActive(removedGroup);
                   }
               }));
@@ -8155,6 +8220,7 @@ define(['exports'], (function (exports) { 'use strict';
                       locked: !!locked,
                       hideHeader: !!hideHeader,
                   });
+                  this._onDidAddGroup.fire(group);
                   const createdPanels = [];
                   for (const child of views) {
                       /**
@@ -8165,7 +8231,6 @@ define(['exports'], (function (exports) { 'use strict';
                       const panel = this._deserializer.fromJSON(panels[child], group);
                       createdPanels.push(panel);
                   }
-                  this._onDidAddGroup.fire(group);
                   for (let i = 0; i < views.length; i++) {
                       const panel = createdPanels[i];
                       const isActive = typeof activeView === 'string' &&
@@ -8699,9 +8764,7 @@ define(['exports'], (function (exports) { 'use strict';
                       }));
                       this.doRemoveGroup(sourceGroup, { skipActive: true });
                       const newGroup = this.createGroupAtLocation(targetLocation);
-                      this.movingLock(() => newGroup.model.openPanel(removedPanel, {
-                          skipSetActive: true,
-                      }));
+                      this.movingLock(() => newGroup.model.openPanel(removedPanel));
                       this.doSetGroupAndPanelActive(newGroup);
                       this._onDidMovePanel.fire({
                           panel: this.getGroupPanel(sourceItemId),