dockview-core 6.6.1 → 7.0.2

package/dist/styles/dockview.css

@@ -62,6 +62,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -124,6 +129,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -190,6 +200,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -281,6 +296,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -357,6 +377,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -398,7 +423,7 @@
 .dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
   position: absolute;
   left: 0px;
-  top: 0px;
+  bottom: 0px;
   content: "";
   width: 100%;
   height: 1px;
@@ -446,6 +471,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -553,6 +583,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -569,7 +604,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -577,6 +612,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -603,6 +642,17 @@
 .dockview-theme-nord-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-nord-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-nord-spaced .dv-tabs-overflow-container,
 .dockview-theme-nord-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -627,6 +677,8 @@
 }
 .dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -699,6 +751,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -760,7 +817,7 @@
 .dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
   position: absolute;
   left: 0px;
-  top: 0px;
+  bottom: 0px;
   content: "";
   width: 100%;
   height: 2px;
@@ -773,7 +830,7 @@
 .dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
   position: absolute;
   left: 0px;
-  top: 0px;
+  bottom: 0px;
   content: "";
   width: 100%;
   height: 2px;
@@ -808,6 +865,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -824,7 +886,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -832,6 +894,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -858,6 +924,17 @@
 .dockview-theme-catppuccin-mocha-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-catppuccin-mocha-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-container,
 .dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -882,6 +959,8 @@
 }
 .dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -956,6 +1035,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1056,6 +1140,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1133,6 +1222,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1149,7 +1243,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -1157,6 +1251,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -1183,6 +1281,17 @@
 .dockview-theme-solarized-light-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-solarized-light-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-solarized-light-spaced .dv-tabs-overflow-container,
 .dockview-theme-solarized-light-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -1207,6 +1316,8 @@
 }
 .dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -1275,6 +1386,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1358,6 +1474,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1374,7 +1495,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -1382,6 +1503,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -1408,6 +1533,17 @@
 .dockview-theme-github-dark-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-github-dark-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-github-dark-spaced .dv-tabs-overflow-container,
 .dockview-theme-github-dark-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -1432,6 +1568,8 @@
 }
 .dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -1506,6 +1644,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1595,6 +1738,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1611,7 +1759,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -1619,6 +1767,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -1645,6 +1797,17 @@
 .dockview-theme-github-light-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-github-light-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-github-light-spaced .dv-tabs-overflow-container,
 .dockview-theme-github-light-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -1669,6 +1832,8 @@
 }
 .dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -1748,6 +1913,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1764,7 +1934,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -1772,6 +1942,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -1798,6 +1972,17 @@
 .dockview-theme-abyss-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-abyss-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-abyss-spaced .dv-tabs-overflow-container,
 .dockview-theme-abyss-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -1822,6 +2007,8 @@
 }
 .dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -1898,6 +2085,11 @@
   --dv-floating-group-border: none;
   --dv-drag-over-border: none;
   --dv-floating-group-dragging-opacity: 0.5;
+  --dv-floating-titlebar-height: 22px;
+  --dv-floating-titlebar-background-color: var(
+      --dv-tabs-and-actions-container-background-color
+  );
+  --dv-floating-titlebar-border-bottom: var(--dv-floating-border);
   --dv-tab-group-color-grey: #5f6368;
   --dv-tab-group-color-blue: #1a73e8;
   --dv-tab-group-color-red: #d93025;
@@ -1914,7 +2106,7 @@
   --dv-tab-group-line-opacity: 0.6;
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -1922,6 +2114,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -1948,6 +2144,17 @@
 .dockview-theme-light-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-theme-light-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-theme-light-spaced .dv-tabs-overflow-container,
 .dockview-theme-light-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -1972,6 +2179,8 @@
 }
 .dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -2007,7 +2216,7 @@
 .dockview-spaced {
   --dv-spacing-padding: 10px;
   --dv-tab-font-size: 12px;
-  --dv-border-radius: 20px;
+  --dv-border-radius: 12px;
   --dv-tab-margin: 0.5rem 0.25rem;
   --dv-tabs-and-actions-container-height: 44px;
   --dv-tab-border-radius: 8px;
@@ -2015,6 +2224,10 @@
   --dv-dropdown-border-radius: 8px;
   --dv-tab-close-icon-size: 8px;
   --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);
+  --dv-floating-titlebar-background-color: var(
+      --dv-group-view-background-color
+  );
+  --dv-floating-titlebar-border-bottom: none;
   box-sizing: border-box;
   padding: var(--dv-spacing-padding);
   background-color: var(--dv-group-view-background-color);
@@ -2041,6 +2254,17 @@
 .dockview-spaced .dv-resize-container .dv-groupview {
   border: var(--dv-floating-group-border);
 }
+.dockview-spaced .dv-resize-container > .dv-grid-view {
+  box-sizing: border-box;
+  padding: var(--dv-spacing-padding);
+}
+.dockview-spaced .dv-resize-container-with-titlebar > .dv-grid-view {
+  padding-top: 0;
+}
+.dockview-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
+}
 .dockview-spaced .dv-tabs-overflow-container,
 .dockview-spaced .dv-tabs-overflow-dropdown-default {
   border-radius: var(--dv-dropdown-border-radius);
@@ -2065,6 +2289,8 @@
 }
 .dockview-spaced .dv-groupview .dv-tabs-and-actions-container {
   padding: 0px calc(var(--dv-border-radius) / 2);
+  border-top-left-radius: var(--dv-border-radius);
+  border-top-right-radius: var(--dv-border-radius);
 }
 .dockview-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {
   padding: calc(var(--dv-border-radius) / 2) 0;
@@ -2162,6 +2388,11 @@
   top: auto;
   bottom: 0;
 }
+
+.dv-groupview.dv-groupview-header-bottom.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after, .dv-groupview.dv-groupview-header-bottom.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {
+  top: 0px;
+  bottom: auto;
+}
 .dv-drop-target-container {
   position: absolute;
   z-index: 9999;
@@ -2325,10 +2556,42 @@
   pointer-events: auto;
 }
 
+.dv-resize-container > .dv-grid-view {
+  width: 100%;
+  height: 100%;
+}
+
+.dv-resize-container-with-titlebar {
+  display: flex;
+  flex-direction: column;
+}
+.dv-resize-container-with-titlebar > .dv-floating-titlebar {
+  flex: 0 0 auto;
+}
+.dv-resize-container-with-titlebar > .dv-grid-view {
+  height: auto;
+  flex: 1 1 0;
+  min-height: 0;
+}
+
+.dv-floating-titlebar {
+  box-sizing: border-box;
+  flex-shrink: 0;
+  height: var(--dv-floating-titlebar-height, 22px);
+  background-color: var(--dv-floating-titlebar-background-color);
+  border-bottom: var(--dv-floating-titlebar-border-bottom, none);
+  user-select: none;
+  touch-action: none;
+}
+.dv-floating-titlebar.dv-draggable {
+  cursor: grab;
+}
+
 .dv-resize-container {
   --dv-overlay-z-index: var(--dv-overlay-z-index, 999);
   position: absolute;
   z-index: calc(var(--dv-overlay-z-index) - 2);
+  background-color: var(--dv-group-view-background-color);
   border: var(--dv-floating-border);
   box-shadow: var(--dv-floating-box-shadow);
   /* GPU optimizations for floating group movement */
@@ -2836,7 +3099,6 @@
   border-radius: 2px;
   background-color: var(--dv-icon-hover-background-color);
 }
-@charset "UTF-8";
 .dv-tabs-container {
   display: flex;
   position: relative;
@@ -2858,7 +3120,7 @@
    * Empty space between tabs (and the scrollbar lane) keeps pan-x so a
    * flick on those areas produces native momentum scroll. The tab and
    * chip elements themselves opt out (`touch-action: none`) so the
-   * pointer drag source owns the gesture from pointerdown — a flick on
+   * pointer drag source owns the gesture from pointerdown - a flick on
    * a tab or chip always becomes a drag, regardless of direction.
    */
   touch-action: pan-x;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "dockview-core",
-    "version": "6.6.1",
+    "version": "7.0.2",
     "description": "Zero dependency layout manager supporting tabs, groups, grids and splitviews for vanilla TypeScript",
     "keywords": [
         "splitview",
@@ -45,6 +45,15 @@
     "main": "./dist/package/main.cjs.js",
     "module": "./dist/package/main.esm.mjs",
     "types": "./dist/cjs/index.d.ts",
+    "exports": {
+        ".": {
+            "types": "./dist/cjs/index.d.ts",
+            "import": "./dist/package/main.esm.mjs",
+            "require": "./dist/package/main.cjs.js"
+        },
+        "./dist/styles/*": "./dist/styles/*",
+        "./package.json": "./package.json"
+    },
     "sideEffects": [
         "**/*.css",
         "**/*.scss"