dockview 1.13.0 → 1.13.1

package/dist/dockview.amd.js

@@ -1,6 +1,6 @@
 /**
  * dockview
- * @version 1.13.0
+ * @version 1.13.1
  * @link https://github.com/mathuo/dockview
  * @license MIT
  */
@@ -250,18 +250,49 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
           },
       };
   }
-  class TickDelayedEvent {
+  /**
+   *
+   * Event Emitter that fires events from a Microtask callback, only one event will fire per event-loop cycle.
+   *
+   * It's kind of like using an `asapScheduler` in RxJs with additional logic to only fire once per event-loop cycle.
+   * This implementation exists to avoid external dependencies.
+   *
+   * @see https://developer.mozilla.org/en-US/docs/Web/API/queueMicrotask
+   * @see https://rxjs.dev/api/index/const/asapScheduler
+   */
+  class AsapEvent {
       constructor() {
           this._onFired = new Emitter();
-          this.onEvent = this._onFired.event;
+          this._currentFireCount = 0;
+          this._queued = false;
+          this.onEvent = (e) => {
+              /**
+               * when the event is first subscribed to take note of the current fire count
+               */
+              const fireCountAtTimeOfEventSubscription = this._currentFireCount;
+              return this._onFired.event(() => {
+                  /**
+                   * if the current fire count is greater than the fire count at event subscription
+                   * then the event has been fired since we subscribed and it's ok to "on_next" the event.
+                   *
+                   * if the count is not greater then what we are recieving is an event from the microtask
+                   * queue that was triggered before we actually subscribed and therfore we should ignore it.
+                   */
+                  if (this._currentFireCount > fireCountAtTimeOfEventSubscription) {
+                      e();
+                  }
+              });
+          };
       }
       fire() {
-          if (this.timer) {
-              clearTimeout(this.timer);
+          this._currentFireCount++;
+          if (this._queued) {
+              return;
           }
-          this.timer = setTimeout(() => {
+          this._queued = true;
+          queueMicrotask(() => {
+              this._queued = false;
               this._onFired.fire();
-              clearTimeout(this.timer);
           });
       }
       dispose() {
@@ -2579,15 +2610,14 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
           super(document.createElement('div'), options.disableAutoResizing);
           this._id = nextLayoutId$1.next();
           this._groups = new Map();
-          this._onDidLayoutChange = new Emitter();
-          this.onDidLayoutChange = this._onDidLayoutChange.event;
           this._onDidRemove = new Emitter();
           this.onDidRemove = this._onDidRemove.event;
           this._onDidAdd = new Emitter();
           this.onDidAdd = this._onDidAdd.event;
           this._onDidActiveChange = new Emitter();
           this.onDidActiveChange = this._onDidActiveChange.event;
-          this._bufferOnDidLayoutChange = new TickDelayedEvent();
+          this._bufferOnDidLayoutChange = new AsapEvent();
+          this.onDidLayoutChange = this._bufferOnDidLayoutChange.onEvent;
           this.element.style.height = '100%';
           this.element.style.width = '100%';
           options.parentElement.appendChild(this.element);
@@ -2602,13 +2632,11 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
               this._bufferOnDidLayoutChange.fire();
           }), exports.DockviewEvent.any(this.onDidAdd, this.onDidRemove, this.onDidActiveChange)(() => {
               this._bufferOnDidLayoutChange.fire();
-          }), this._bufferOnDidLayoutChange.onEvent(() => {
-              this._onDidLayoutChange.fire();
           }), this._bufferOnDidLayoutChange);
       }
       setVisible(panel, visible) {
           this.gridview.setViewVisible(getGridLocation(panel.element), visible);
-          this._onDidLayoutChange.fire();
+          this._bufferOnDidLayoutChange.fire();
       }
       isVisible(panel) {
           return this.gridview.isViewVisible(getGridLocation(panel.element));
@@ -2714,7 +2742,6 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
           this._onDidActiveChange.dispose();
           this._onDidAdd.dispose();
           this._onDidRemove.dispose();
-          this._onDidLayoutChange.dispose();
           for (const group of this.groups) {
               group.dispose();
           }
@@ -7940,7 +7967,6 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
       }
       addGroup(options) {
           var _a;
-          const group = this.createGroup(options);
           if (options) {
               let referenceGroup;
               if (isGroupOptionsWithPanel(options)) {
@@ -7974,6 +8000,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
               const target = toTarget(options.direction || 'within');
               const location = getGridLocation(referenceGroup.element);
               const relativeLocation = getRelativeLocation(this.gridview.orientation, location, target);
+              const group = this.createGroup(options);
               this.doAddGroup(group, relativeLocation);
               if (!options.skipSetActive) {
                   this.doSetGroupAndPanelActive(group);
@@ -7981,6 +8008,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
               return group;
           }
           else {
+              const group = this.createGroup(options);
               this.doAddGroup(group);
               this.doSetGroupAndPanelActive(group);
               return group;