dockview-react 4.4.1 → 4.6.2

package/dist/dockview-react.noStyle.js

@@ -1,6 +1,6 @@
 /**
  * dockview-react
- * @version 4.4.1
+ * @version 4.6.2
  * @link https://github.com/mathuo/dockview
  * @license MIT
  */
@@ -5053,6 +5053,40 @@
         }
     }
 
+    class WillShowOverlayLocationEvent {
+        get kind() {
+            return this.options.kind;
+        }
+        get nativeEvent() {
+            return this.event.nativeEvent;
+        }
+        get position() {
+            return this.event.position;
+        }
+        get defaultPrevented() {
+            return this.event.defaultPrevented;
+        }
+        get panel() {
+            return this.options.panel;
+        }
+        get api() {
+            return this.options.api;
+        }
+        get group() {
+            return this.options.group;
+        }
+        preventDefault() {
+            this.event.preventDefault();
+        }
+        getData() {
+            return this.options.getData();
+        }
+        constructor(event, options) {
+            this.event = event;
+            this.options = options;
+        }
+    }
+
     class GroupDragHandler extends DragHandler {
         constructor(element, accessor, group) {
             super(element);
@@ -5120,6 +5154,7 @@
             this._element = document.createElement('div');
             this._element.className = 'dv-void-container';
             this._element.draggable = !this.accessor.options.disableDnd;
+            toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
             this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
                 this.accessor.doSetGroupActive(this.group);
             }));
@@ -5144,6 +5179,7 @@
         }
         updateDragAndDropState() {
             this._element.draggable = !this.accessor.options.disableDnd;
+            toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
         }
     }
 
@@ -5664,8 +5700,11 @@
                     toggleClass(wrapper, 'dv-tab', true);
                     toggleClass(wrapper, 'dv-active-tab', panelObject.api.isActive);
                     toggleClass(wrapper, 'dv-inactive-tab', !panelObject.api.isActive);
-                    wrapper.addEventListener('pointerdown', () => {
+                    wrapper.addEventListener('click', (event) => {
                         this.accessor.popupService.close();
+                        if (event.defaultPrevented) {
+                            return;
+                        }
                         tab.element.scrollIntoView();
                         tab.panel.api.setActive();
                     });
@@ -5782,39 +5821,6 @@
             this._kind = options.kind;
         }
     }
-    class WillShowOverlayLocationEvent {
-        get kind() {
-            return this.options.kind;
-        }
-        get nativeEvent() {
-            return this.event.nativeEvent;
-        }
-        get position() {
-            return this.event.position;
-        }
-        get defaultPrevented() {
-            return this.event.defaultPrevented;
-        }
-        get panel() {
-            return this.options.panel;
-        }
-        get api() {
-            return this.options.api;
-        }
-        get group() {
-            return this.options.group;
-        }
-        preventDefault() {
-            this.event.preventDefault();
-        }
-        getData() {
-            return this.options.getData();
-        }
-        constructor(event, options) {
-            this.event = event;
-            this.options = options;
-        }
-    }
     class DockviewGroupPanelModel extends CompositeDisposable {
         get element() {
             throw new Error('dockview: not supported');
@@ -6639,23 +6645,24 @@
                 : window;
         }
         moveTo(options) {
-            var _a, _b, _c;
+            var _a, _b, _c, _d;
             if (!this._group) {
                 throw new Error(NOT_INITIALIZED_MESSAGE);
             }
             const group = (_a = options.group) !== null && _a !== void 0 ? _a : this.accessor.addGroup({
                 direction: positionToDirection((_b = options.position) !== null && _b !== void 0 ? _b : 'right'),
-                skipSetActive: true,
+                skipSetActive: (_c = options.skipSetActive) !== null && _c !== void 0 ? _c : false,
             });
             this.accessor.moveGroupOrPanel({
                 from: { groupId: this._group.id },
                 to: {
                     group,
                     position: options.group
-                        ? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
+                        ? (_d = options.position) !== null && _d !== void 0 ? _d : 'center'
                         : 'center',
                     index: options.index,
                 },
+                skipSetActive: options.skipSetActive,
             });
         }
         maximize() {
@@ -6887,6 +6894,7 @@
                         : 'center',
                     index: options.index,
                 },
+                skipSetActive: options.skipSetActive,
             });
         }
         setTitle(title) {
@@ -9456,6 +9464,7 @@
                         group: destinationGroup,
                         position: destinationTarget,
                     },
+                    skipSetActive: options.skipSetActive,
                 });
                 return;
             }
@@ -9474,11 +9483,17 @@
                     // remove the group and do not set a new group as active
                     this.doRemoveGroup(sourceGroup, { skipActive: true });
                 }
-                this.movingLock(() => destinationGroup.model.openPanel(removedPanel, {
-                    index: destinationIndex,
-                    skipSetGroupActive: true,
-                }));
-                this.doSetGroupAndPanelActive(destinationGroup);
+                this.movingLock(() => {
+                    var _a;
+                    return destinationGroup.model.openPanel(removedPanel, {
+                        index: destinationIndex,
+                        skipSetActive: (_a = options.skipSetActive) !== null && _a !== void 0 ? _a : false,
+                        skipSetGroupActive: true,
+                    });
+                });
+                if (!options.skipSetActive) {
+                    this.doSetGroupAndPanelActive(destinationGroup);
+                }
                 this._onDidMovePanel.fire({
                     panel: removedPanel,
                     from: sourceGroup,
@@ -9581,6 +9596,7 @@
             const target = options.to.position;
             if (target === 'center') {
                 const activePanel = from.activePanel;
+                const targetActivePanel = to.activePanel;
                 const panels = this.movingLock(() => [...from.panels].map((p) => from.model.removePanel(p.id, {
                     skipSetActive: true,
                 })));
@@ -9590,12 +9606,23 @@
                 this.movingLock(() => {
                     for (const panel of panels) {
                         to.model.openPanel(panel, {
-                            skipSetActive: panel !== activePanel,
+                            skipSetActive: true, // Always skip setting panels active during move
                             skipSetGroupActive: true,
                         });
                     }
                 });
-                this.doSetGroupAndPanelActive(to);
+                if (!options.skipSetActive) {
+                    // Make the moved panel (from the source group) active
+                    if (activePanel) {
+                        this.doSetGroupAndPanelActive(to);
+                    }
+                }
+                else if (targetActivePanel) {
+                    // Ensure the target group's original active panel remains active
+                    to.model.openPanel(targetActivePanel, {
+                        skipSetGroupActive: true
+                    });
+                }
             }
             else {
                 switch (from.api.location.type) {
@@ -9615,12 +9642,39 @@
                         if (!selectedPopoutGroup) {
                             throw new Error('failed to find popout group');
                         }
-                        selectedPopoutGroup.disposable.dispose();
+                        // Remove from popout groups list to prevent automatic restoration
+                        const index = this._popoutGroups.indexOf(selectedPopoutGroup);
+                        if (index >= 0) {
+                            this._popoutGroups.splice(index, 1);
+                        }
+                        // Clean up the reference group (ghost) if it exists and is hidden
+                        if (selectedPopoutGroup.referenceGroup) {
+                            const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
+                            if (referenceGroup && !referenceGroup.api.isVisible) {
+                                this.doRemoveGroup(referenceGroup, { skipActive: true });
+                            }
+                        }
+                        // Manually dispose the window without triggering restoration
+                        selectedPopoutGroup.window.dispose();
+                        // Update group's location and containers for target
+                        if (to.api.location.type === 'grid') {
+                            from.model.renderContainer = this.overlayRenderContainer;
+                            from.model.dropTargetContainer = this.rootDropTargetContainer;
+                            from.model.location = { type: 'grid' };
+                        }
+                        else if (to.api.location.type === 'floating') {
+                            from.model.renderContainer = this.overlayRenderContainer;
+                            from.model.dropTargetContainer = this.rootDropTargetContainer;
+                            from.model.location = { type: 'floating' };
+                        }
+                        break;
                     }
                 }
-                if (from.api.location.type !== 'popout') {
+                // For moves to grid locations
+                if (to.api.location.type === 'grid') {
                     const referenceLocation = getGridLocation(to.element);
                     const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
+                    // Add to grid for all moves targeting grid location
                     let size;
                     switch (this.gridview.orientation) {
                         case exports.Orientation.VERTICAL:
@@ -9638,10 +9692,49 @@
                     }
                     this.gridview.addView(from, size, dropLocation);
                 }
+                else if (to.api.location.type === 'floating') {
+                    // For moves to floating locations, add as floating group
+                    // Get the position/size from the target floating group
+                    const targetFloatingGroup = this._floatingGroups.find((x) => x.group === to);
+                    if (targetFloatingGroup) {
+                        const box = targetFloatingGroup.overlay.toJSON();
+                        // Calculate position based on available properties
+                        let left, top;
+                        if ('left' in box) {
+                            left = box.left + 50;
+                        }
+                        else if ('right' in box) {
+                            left = Math.max(0, box.right - box.width - 50);
+                        }
+                        else {
+                            left = 50; // Default fallback
+                        }
+                        if ('top' in box) {
+                            top = box.top + 50;
+                        }
+                        else if ('bottom' in box) {
+                            top = Math.max(0, box.bottom - box.height - 50);
+                        }
+                        else {
+                            top = 50; // Default fallback
+                        }
+                        this.addFloatingGroup(from, {
+                            height: box.height,
+                            width: box.width,
+                            position: {
+                                left,
+                                top,
+                            },
+                        });
+                    }
+                }
             }
             from.panels.forEach((panel) => {
                 this._onDidMovePanel.fire({ panel, from });
             });
+            if (!options.skipSetActive) {
+                this.doSetGroupAndPanelActive(from);
+            }
         }
         doSetGroupActive(group) {
             super.doSetGroupActive(group);
@@ -11382,7 +11475,7 @@
         }, [onPointerLeave]);
         return (React.createElement("div", Object.assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onPointerDown: _onPointerDown, onPointerUp: _onPointerUp, onPointerLeave: _onPointerLeave, className: "dv-default-tab" }),
             React.createElement("span", { className: "dv-default-tab-content" }, title),
-            !hideClose && tabLocation !== 'headerOverflow' && (React.createElement("div", { className: "dv-default-tab-action", onPointerDown: onBtnPointerDown, onClick: onClose },
+            !hideClose && (React.createElement("div", { className: "dv-default-tab-action", onPointerDown: onBtnPointerDown, onClick: onClose },
                 React.createElement(CloseButton, null)))));
     };
 
@@ -11729,7 +11822,6 @@
     exports.SplitviewPanel = SplitviewPanel;
     exports.SplitviewReact = SplitviewReact;
     exports.Tab = Tab;
-    exports.WillShowOverlayLocationEvent = WillShowOverlayLocationEvent;
     exports.createDockview = createDockview;
     exports.createGridview = createGridview;
     exports.createPaneview = createPaneview;