dockview 1.13.0 → 1.13.1

package/dist/dockview.amd.noStyle.js

@@ -1,6 +1,6 @@
 /**
  * dockview
- * @version 1.13.0
+ * @version 1.13.1
  * @link https://github.com/mathuo/dockview
  * @license MIT
  */
@@ -220,18 +220,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() {
@@ -2549,15 +2580,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);
@@ -2572,13 +2602,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));
@@ -2684,7 +2712,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();
             }
@@ -7910,7 +7937,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)) {
@@ -7944,6 +7970,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);
@@ -7951,6 +7978,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;