dockview-core 3.1.0 → 3.2.0

package/dist/esm/dockview/components/tab/tab.d.ts

@@ -12,8 +12,8 @@ export declare class Tab extends CompositeDisposable {
     private readonly _element;
     private readonly dropTarget;
     private content;
-    private readonly _onChanged;
-    readonly onChanged: Event<MouseEvent>;
+    private readonly _onPointDown;
+    readonly onPointerDown: Event<MouseEvent>;
     private readonly _onDropped;
     readonly onDrop: Event<DroptargetEvent>;
     private readonly _onDragStart;

package/dist/esm/dockview/components/tab/tab.js

@@ -31,8 +31,8 @@ export class Tab extends CompositeDisposable {
         this.accessor = accessor;
         this.group = group;
         this.content = undefined;
-        this._onChanged = new Emitter();
-        this.onChanged = this._onChanged.event;
+        this._onPointDown = new Emitter();
+        this.onPointerDown = this._onPointDown.event;
         this._onDropped = new Emitter();
         this.onDrop = this._onDropped.event;
         this._onDragStart = new Emitter();
@@ -62,13 +62,10 @@ export class Tab extends CompositeDisposable {
             },
         });
         this.onWillShowOverlay = this.dropTarget.onWillShowOverlay;
-        this.addDisposables(this._onChanged, this._onDropped, this._onDragStart, dragHandler.onDragStart((event) => {
+        this.addDisposables(this._onPointDown, this._onDropped, this._onDragStart, dragHandler.onDragStart((event) => {
             this._onDragStart.fire(event);
         }), dragHandler, addDisposableListener(this._element, 'pointerdown', (event) => {
-            if (event.defaultPrevented) {
-                return;
-            }
-            this._onChanged.fire(event);
+            this._onPointDown.fire(event);
         }), this.dropTarget.onDrop((event) => {
             this._onDropped.fire(event);
         }), this.dropTarget);

package/dist/esm/dockview/components/titlebar/tabsContainer.js

@@ -179,7 +179,7 @@ export class TabsContainer extends CompositeDisposable {
         tab.setContent(panel.view.tab);
         const disposable = new CompositeDisposable(tab.onDragStart((event) => {
             this._onTabDragStart.fire({ nativeEvent: event, panel });
-        }), tab.onChanged((event) => {
+        }), tab.onPointerDown((event) => {
             if (event.defaultPrevented) {
                 return;
             }
@@ -206,9 +206,6 @@ export class TabsContainer extends CompositeDisposable {
                         this.group.model.openPanel(panel);
                     }
                     break;
-                case 1: // middle click
-                    panel.api.close();
-                    break;
             }
         }), tab.onDrop((event) => {
             this._onDrop.fire({

package/dist/styles/dockview.css

@@ -15,6 +15,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: #1e1e1e;
   --dv-tabs-and-actions-container-background-color: #252526;
   --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;
@@ -40,6 +42,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: white;
   --dv-tabs-and-actions-container-background-color: #f3f3f3;
   --dv-activegroup-visiblepanel-tab-background-color: white;
@@ -65,6 +69,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: #1e1e1e;
   --dv-tabs-and-actions-container-background-color: #252526;
   --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;
@@ -119,6 +125,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: #000c18;
   --dv-tabs-and-actions-container-background-color: #1c1c2a;
   --dv-activegroup-visiblepanel-tab-background-color: #000c18;
@@ -145,6 +153,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: #282a36;
   --dv-tabs-and-actions-container-background-color: #191a21;
   --dv-activegroup-visiblepanel-tab-background-color: #282a36;
@@ -197,6 +207,8 @@
   --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);
   --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);
   --dv-overlay-z-index: 999;
+  --dv-active-sash-transition-duration: 0.1s;
+  --dv-active-sash-transition-delay: 0.5s;
   --dv-group-view-background-color: #ebeced;
   --dv-tabs-and-actions-container-background-color: #fcfcfc;
   --dv-activegroup-visiblepanel-tab-background-color: #f0f1f2;
@@ -670,14 +682,12 @@
   -ms-user-select: none;
   touch-action: none;
 }
-.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):active {
-  transition: background-color 0.1s ease-in-out;
+.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):active, .dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):hover {
   background-color: var(--dv-active-sash-color, transparent);
-}
-.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):hover {
-  background-color: var(--dv-active-sash-color, transparent);
-  transition: background-color 0.1s ease-in-out;
-  transition-delay: 0.5s;
+  transition-property: background-color;
+  transition-timing-function: ease-in-out;
+  transition-duration: var(--dv-active-sash-transition-duration, 0.1s);
+  transition-delay: var(--dv-active-sash-transition-delay, 0.5s);
 }
 .dv-split-view-container .dv-view-container {
   position: relative;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dockview-core",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "description": "Zero dependency layout manager supporting tabs, grids and splitviews",
   "keywords": [
     "splitview",