dockview-react 4.0.1 → 4.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dockview-react.amd.js +165 -66
- package/dist/dockview-react.amd.js.map +1 -1
- package/dist/dockview-react.amd.min.js +2 -2
- package/dist/dockview-react.amd.min.js.map +1 -1
- package/dist/dockview-react.amd.min.noStyle.js +2 -2
- package/dist/dockview-react.amd.min.noStyle.js.map +1 -1
- package/dist/dockview-react.amd.noStyle.js +164 -65
- package/dist/dockview-react.amd.noStyle.js.map +1 -1
- package/dist/dockview-react.cjs.js +165 -66
- package/dist/dockview-react.cjs.js.map +1 -1
- package/dist/dockview-react.esm.js +165 -66
- package/dist/dockview-react.esm.js.map +1 -1
- package/dist/dockview-react.esm.min.js +2 -2
- package/dist/dockview-react.esm.min.js.map +1 -1
- package/dist/dockview-react.js +165 -66
- package/dist/dockview-react.js.map +1 -1
- package/dist/dockview-react.min.js +2 -2
- package/dist/dockview-react.min.js.map +1 -1
- package/dist/dockview-react.min.noStyle.js +2 -2
- package/dist/dockview-react.min.noStyle.js.map +1 -1
- package/dist/dockview-react.noStyle.js +164 -65
- package/dist/dockview-react.noStyle.js.map +1 -1
- package/dist/styles/dockview.css +8 -2
- package/package.json +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-react
|
|
3
|
-
* @version 4.0
|
|
3
|
+
* @version 4.2.0
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -34,7 +34,7 @@ function styleInject(css, ref) {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
var css_248z = ".dv-scrollable {\n position: relative;\n overflow: hidden;\n width: 100%;\n}\n.dv-scrollable .dv-scrollbar-horizontal {\n position: absolute;\n bottom: 0px;\n left: 0px;\n height: 4px;\n border-radius: 2px;\n background-color: transparent;\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: 1s;\n transition-delay: 0s;\n}\n.dv-scrollable:hover .dv-scrollbar-horizontal, .dv-scrollable.dv-scrollable-resizing .dv-scrollbar-horizontal, .dv-scrollable.dv-scrollable-scrolling .dv-scrollbar-horizontal {\n background-color: var(--dv-scrollbar-background-color, rgba(255, 255, 255, 0.25));\n}\n.dv-svg {\n display: inline-block;\n fill: currentcolor;\n line-height: 1;\n stroke: currentcolor;\n stroke-width: 0;\n}\n.dockview-theme-dark {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n}\n.dockview-theme-dark .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-light {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: white;\n --dv-tabs-and-actions-container-background-color: #f3f3f3;\n --dv-activegroup-visiblepanel-tab-background-color: white;\n --dv-activegroup-hiddenpanel-tab-background-color: #ececec;\n --dv-inactivegroup-visiblepanel-tab-background-color: white;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #ececec;\n --dv-tab-divider-color: white;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.7);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(51, 51, 51, 0.7);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.35);\n --dv-separator-border: rgba(128, 128, 128, 0.35);\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n}\n.dockview-theme-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-vs {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n --dv-tabs-and-actions-container-background-color: #2d2d30;\n --dv-tabs-and-actions-container-height: 20px;\n --dv-tabs-and-actions-container-font-size: 11px;\n --dv-activegroup-visiblepanel-tab-background-color: #007acc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #3f3f46;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: white;\n --dv-inactivegroup-visiblepanel-tab-color: white;\n --dv-inactivegroup-hiddenpanel-tab-color: white;\n}\n.dockview-theme-vs .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n}\n\n.dockview-theme-abyss {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-color-abyss-dark: #000c18;\n --dv-color-abyss: #10192c;\n --dv-color-abyss-light: #1c1c2a;\n --dv-color-abyss-lighter: #2b2b4a;\n --dv-color-abyss-accent: rgb(91, 30, 207);\n --dv-color-abyss-primary-text: white;\n --dv-color-abyss-secondary-text: rgb(148, 151, 169);\n --dv-group-view-background-color: var(--dv-color-abyss-dark);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-abyss-light\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-dark\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-dark\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);\n --dv-tab-divider-color: var(--dv-color-abyss-lighter);\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.5);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(255, 255, 255, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.25);\n --dv-separator-border: var(--dv-color-abyss-lighter);\n --dv-paneview-header-border-color: var(--dv-color-abyss-lighter);\n --dv-paneview-active-outline-color: #596f99;\n}\n.dockview-theme-abyss .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-dracula {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #282a36;\n --dv-tabs-and-actions-container-background-color: #191a21;\n --dv-activegroup-visiblepanel-tab-background-color: #282a36;\n --dv-activegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-inactivegroup-visiblepanel-tab-background-color: #282a36;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-tab-divider-color: #191a21;\n --dv-activegroup-visiblepanel-tab-color: rgb(248, 248, 242);\n --dv-activegroup-hiddenpanel-tab-color: rgb(98, 114, 164);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(98, 114, 164, 0.5);\n --dv-separator-border: #bd93f9;\n --dv-paneview-header-border-color: #bd93f9;\n --dv-paneview-active-outline-color: #6272a4;\n}\n.dockview-theme-dracula .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n top: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n bottom: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #5e3d5a;\n z-index: 999;\n}\n\n.dockview-theme-replit {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n padding: 10px;\n background-color: #ebeced;\n --dv-group-view-background-color: #ebeced;\n --dv-tabs-and-actions-container-background-color: #fcfcfc;\n --dv-activegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-activegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-sash-color: #cfd1d3;\n --dv-active-sash-color: #babbbb;\n}\n.dockview-theme-replit .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-replit .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-resize-container {\n border-radius: 10px !important;\n border: none;\n}\n.dockview-theme-replit .dv-groupview {\n overflow: hidden;\n border-radius: 10px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container {\n border-bottom: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab {\n margin: 4px;\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab:hover {\n background-color: #e4e5e6 !important;\n}\n.dockview-theme-replit .dv-groupview .dv-content-container {\n background-color: #fcfcfc;\n}\n.dockview-theme-replit .dv-groupview.dv-active-group {\n border: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview.dv-inactive-group {\n border: 1px solid transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled)::after {\n content: \"\";\n height: 4px;\n width: 40px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-sash-color);\n position: absolute;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):hover, .dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):active {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):hover::after, .dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):active::after {\n background-color: var(--dv-active-sash-color);\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled)::after {\n content: \"\";\n height: 40px;\n width: 4px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-sash-color);\n position: absolute;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):hover, .dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):active {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):hover::after, .dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):active::after {\n background-color: var(--dv-active-sash-color);\n}\n\n.dockview-theme-abyss-spaced {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 20px;\n --dv-tab-margin: 0.5rem 0.25rem;\n --dv-tabs-and-actions-container-height: 44px;\n --dv-border-radius: 20px;\n --dv-color-abyss-dark: rgb(11, 6, 17);\n --dv-color-abyss: #16121f;\n --dv-color-abyss-light: #201d2b;\n --dv-color-abyss-lighter: #2a2837;\n --dv-color-abyss-accent: rgb(91, 30, 207);\n --dv-color-abyss-primary-text: white;\n --dv-color-abyss-secondary-text: rgb(148, 151, 169);\n --dv-drag-over-border: 2px solid var(--dv-color-abyss-accent);\n --dv-drag-over-background-color: \"\";\n --dv-group-view-background-color: var(--dv-color-abyss-dark);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-abyss);\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-lighter\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-abyss-light\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-lighter\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-abyss-light\n );\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-abyss-primary-text);\n --dv-activegroup-hiddenpanel-tab-color: var(\n --dv-color-abyss-secondary-text\n );\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-abyss-primary-text\n );\n --dv-inactivegroup-hiddenpanel-tab-color: var(\n --dv-color-abyss-secondary-text\n );\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-active-sash-color: var(--dv-color-abyss-accent);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(0, 0, 0, 0.5);\n padding: 10px;\n background-color: var(--dv-color-abyss-dark);\n}\n.dockview-theme-abyss-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-abyss-spaced .dv-sash {\n border-radius: 4px;\n}\n.dockview-theme-abyss-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-abyss-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-abyss-spaced .dv-tabs-overflow-container,\n.dockview-theme-abyss-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: 8px;\n height: unset !important;\n}\n.dockview-theme-abyss-spaced .dv-tab {\n border-radius: 8px;\n}\n.dockview-theme-abyss-spaced .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-abyss-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n}\n.dockview-theme-abyss-spaced .dv-resize-container .dv-groupview {\n border: 2px solid var(--dv-color-abyss-dark);\n}\n\n.dockview-theme-light-spaced {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 20px;\n --dv-tab-margin: 0.5rem 0.25rem;\n --dv-tabs-and-actions-container-height: 44px;\n --dv-border-radius: 20px;\n --dv-drag-over-border: 2px solid rgb(91, 30, 207);\n --dv-drag-over-background-color: \"\";\n --dv-group-view-background-color: #f6f5f9;\n --dv-tabs-and-actions-container-background-color: white;\n --dv-activegroup-visiblepanel-tab-background-color: #ededf0;\n --dv-activegroup-hiddenpanel-tab-background-color: #f9f9fa;\n --dv-inactivegroup-visiblepanel-tab-background-color: #ededf0;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #f9f9fa;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(104, 107, 130);\n --dv-activegroup-hiddenpanel-tab-color: rgb(148, 151, 169);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(104, 107, 130);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(148, 151, 169);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-active-sash-color: rgb(91, 30, 207);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(0, 0, 0, 0.1);\n padding: 10px;\n background-color: #f6f5f9;\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n}\n.dockview-theme-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-light-spaced .dv-sash {\n border-radius: 4px;\n}\n.dockview-theme-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: 8px;\n height: unset !important;\n}\n.dockview-theme-light-spaced .dv-tab {\n border-radius: 8px;\n}\n.dockview-theme-light-spaced .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n}\n.dockview-theme-light-spaced .dv-resize-container .dv-groupview {\n border: 2px solid rgba(255, 255, 255, 0.1);\n}\n.dv-drop-target-container {\n position: absolute;\n z-index: 9999;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n pointer-events: none;\n overflow: hidden;\n --dv-transition-duration: 300ms;\n}\n.dv-drop-target-container .dv-drop-target-anchor {\n position: relative;\n border: var(--dv-drag-over-border);\n transition: opacity var(--dv-transition-duration) ease-in, top var(--dv-transition-duration) ease-out, left var(--dv-transition-duration) ease-out, width var(--dv-transition-duration) ease-out, height var(--dv-transition-duration) ease-out;\n background-color: var(--dv-drag-over-background-color);\n opacity: 1;\n}\n.dv-drop-target {\n position: relative;\n --dv-transition-duration: 70ms;\n}\n.dv-drop-target > .dv-drop-target-dropzone {\n position: absolute;\n left: 0px;\n top: 0px;\n height: 100%;\n width: 100%;\n z-index: 1000;\n pointer-events: none;\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection {\n position: relative;\n box-sizing: border-box;\n height: 100%;\n width: 100%;\n border: var(--dv-drag-over-border);\n background-color: var(--dv-drag-over-background-color);\n transition: top var(--dv-transition-duration) ease-out, left var(--dv-transition-duration) ease-out, width var(--dv-transition-duration) ease-out, height var(--dv-transition-duration) ease-out, opacity var(--dv-transition-duration) ease-out;\n will-change: transform;\n pointer-events: none;\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-top.dv-drop-target-small-vertical {\n border-top: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-bottom.dv-drop-target-small-vertical {\n border-bottom: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-left.dv-drop-target-small-horizontal {\n border-left: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-right.dv-drop-target-small-horizontal {\n border-right: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-dockview {\n position: relative;\n background-color: var(--dv-group-view-background-color);\n}\n.dv-dockview .dv-watermark-container {\n position: absolute;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n z-index: 1;\n}\n.dv-dockview .dv-overlay-render-container {\n position: relative;\n}\n\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-inactivegroup-visiblepanel-tab-background-color);\n color: var(--dv-inactivegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n color: var(--dv-inactivegroup-hiddenpanel-tab-color);\n}\n\n/**\n * when a tab is dragged we lose the above stylings because they are conditional on parent elements\n * therefore we also set some stylings for the dragging event\n **/\n.dv-tab.dv-tab-dragging {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview {\n display: flex;\n flex-direction: column;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n}\n.dv-groupview:focus {\n outline: none;\n}\n.dv-groupview > .dv-content-container {\n flex-grow: 1;\n min-height: 0;\n outline: none;\n}\n.dv-root-wrapper {\n height: 100%;\n width: 100%;\n}\n.dv-grid-view,\n.dv-branch-node {\n height: 100%;\n width: 100%;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-top {\n background-color: red;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-bottom {\n background-color: green;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-left {\n background-color: yellow;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-right {\n background-color: blue;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-topleft,\n.dv-debug .dv-resize-container .dv-resize-handle-topright,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomleft,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomright {\n background-color: cyan;\n}\n\n.dv-resize-container {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: calc(var(--dv-overlay-z-index) - 2);\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: var(--dv-floating-box-shadow);\n}\n.dv-resize-container.dv-hidden {\n display: none;\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: 0.5;\n}\n.dv-resize-container .dv-resize-handle-top {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-bottom {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-left {\n height: calc(100% - 8px);\n width: 4px;\n left: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-right {\n height: calc(100% - 8px);\n width: 4px;\n right: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-topleft {\n height: 4px;\n width: 4px;\n top: -2px;\n left: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: nw-resize;\n}\n.dv-resize-container .dv-resize-handle-topright {\n height: 4px;\n width: 4px;\n right: -2px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ne-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomleft {\n height: 4px;\n width: 4px;\n left: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: sw-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomright {\n height: 4px;\n width: 4px;\n right: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: se-resize;\n}\n.dv-render-overlay {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: 1;\n height: 100%;\n}\n.dv-render-overlay.dv-render-overlay-float {\n z-index: calc(var(--dv-overlay-z-index) - 1);\n}\n\n.dv-debug .dv-render-overlay {\n outline: 1px solid red;\n outline-offset: -1;\n}\n.dv-pane-container {\n height: 100%;\n width: 100%;\n}\n.dv-pane-container.dv-animated .dv-view {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-pane-container .dv-view {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n padding: 0px !important;\n}\n.dv-pane-container .dv-view:not(:first-child)::before {\n background-color: transparent !important;\n}\n.dv-pane-container .dv-view:not(:first-child) .dv-pane > .dv-pane-header {\n border-top: 1px solid var(--dv-paneview-header-border-color);\n}\n.dv-pane-container .dv-view .dv-default-header {\n background-color: var(--dv-group-view-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n display: flex;\n padding: 0px 8px;\n cursor: pointer;\n}\n.dv-pane-container .dv-view .dv-default-header .dv-pane-header-icon {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.dv-pane-container .dv-view .dv-default-header > span {\n padding-left: 8px;\n flex-grow: 1;\n}\n.dv-pane-container:first-of-type > .dv-pane > .dv-pane-header {\n border-top: none !important;\n}\n.dv-pane-container .dv-pane {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n height: 100%;\n}\n.dv-pane-container .dv-pane .dv-pane-header {\n box-sizing: border-box;\n user-select: none;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-header.dv-pane-draggable {\n cursor: pointer;\n}\n.dv-pane-container .dv-pane .dv-pane-header:focus:before, .dv-pane-container .dv-pane .dv-pane-header:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-pane-container .dv-pane .dv-pane-body {\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-body:focus:before, .dv-pane-container .dv-pane .dv-pane-body:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-enabled {\n background-color: black;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-disabled {\n background-color: orange;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-maximum {\n background-color: green;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-minimum {\n background-color: red;\n}\n\n.dv-split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container.dv-splitview-disabled > .dv-sash-container > .dv-sash {\n pointer-events: none;\n}\n.dv-split-view-container.dv-animation .dv-view,\n.dv-split-view-container.dv-animation .dv-sash {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-split-view-container.dv-horizontal {\n height: 100%;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash {\n height: 100%;\n width: 4px;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ew-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: w-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: e-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 100%;\n width: 1px;\n}\n.dv-split-view-container.dv-vertical {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash {\n width: 100%;\n height: 4px;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ns-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: n-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: s-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 1px;\n width: 100%;\n}\n.dv-split-view-container .dv-sash-container {\n height: 100%;\n width: 100%;\n position: absolute;\n}\n.dv-split-view-container .dv-sash-container .dv-sash {\n position: absolute;\n z-index: 99;\n outline: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n touch-action: none;\n background-color: var(--dv-sash-color, transparent);\n}\n.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):active, .dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):hover {\n background-color: var(--dv-active-sash-color, transparent);\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: var(--dv-active-sash-transition-duration, 0.1s);\n transition-delay: var(--dv-active-sash-transition-delay, 0.5s);\n}\n.dv-split-view-container .dv-view-container {\n position: relative;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container .dv-view-container .dv-view {\n height: 100%;\n box-sizing: border-box;\n overflow: auto;\n position: absolute;\n}\n.dv-split-view-container.dv-separator-border .dv-view:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-separator-border);\n}\n.dv-dragged {\n transform: translate3d(0px, 0px, 0px); /* forces tab to be drawn on a separate layer (see https://github.com/microsoft/vscode/issues/18733) */\n}\n\n.dv-tab {\n flex-shrink: 0;\n}\n.dv-tab:focus-within, .dv-tab:focus {\n position: relative;\n}\n.dv-tab:focus-within::after, .dv-tab:focus::after {\n position: absolute;\n content: \"\";\n height: 100%;\n width: 100%;\n top: 0px;\n left: 0px;\n pointer-events: none;\n outline: 1px solid var(--dv-tab-divider-color) !important;\n outline-offset: -1px;\n z-index: 5;\n}\n.dv-tab.dv-tab-dragging .dv-default-tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-tab.dv-active-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: hidden;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab:hover .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab .dv-default-tab {\n position: relative;\n height: 100%;\n display: flex;\n align-items: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.dv-tab .dv-default-tab .dv-default-tab-content {\n flex-grow: 1;\n margin-right: 4px;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-overflow-dropdown-default {\n height: 100%;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n margin: var(--dv-tab-margin);\n display: flex;\n align-items: center;\n flex-shrink: 0;\n padding: 0.25rem 0.5rem;\n cursor: pointer;\n}\n.dv-tabs-overflow-dropdown-default > span {\n padding-left: 0.25rem;\n}\n.dv-tabs-overflow-dropdown-default > svg {\n transform: rotate(90deg);\n}\n.dv-tabs-container {\n display: flex;\n height: 100%;\n overflow: hidden;\n scrollbar-width: thin;\n /* Track */\n /* Handle */\n}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-tab-divider-color);\n width: 1px;\n height: 100%;\n}\n.dv-tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.dv-tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n}\n\n.dv-tab {\n -webkit-user-drag: element;\n outline: none;\n padding: 0.25rem 0.5rem;\n cursor: pointer;\n position: relative;\n box-sizing: border-box;\n font-size: var(--dv-tab-font-size);\n margin: var(--dv-tab-margin);\n}\n\n.dv-tabs-overflow-container {\n flex-direction: column;\n height: unset;\n border: 1px solid var(--dv-tab-divider-color);\n background-color: var(--dv-group-view-background-color);\n}\n.dv-tabs-overflow-container .dv-tab:not(:last-child) {\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-tabs-overflow-container .dv-inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-tabs-and-actions-container {\n display: flex;\n background-color: var(--dv-tabs-and-actions-container-background-color);\n flex-shrink: 0;\n box-sizing: border-box;\n height: var(--dv-tabs-and-actions-container-height);\n font-size: var(--dv-tabs-and-actions-container-font-size);\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container {\n flex-grow: 1;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container .dv-tab {\n flex-grow: 1;\n padding: 0px;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-void-container {\n flex-grow: 0;\n}\n.dv-tabs-and-actions-container .dv-void-container {\n display: flex;\n flex-grow: 1;\n cursor: grab;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container {\n display: flex;\n}\n.dv-watermark {\n display: flex;\n height: 100%;\n}";
|
|
37
|
+
var css_248z = ".dv-scrollable {\n position: relative;\n overflow: hidden;\n}\n.dv-scrollable .dv-scrollbar-horizontal {\n position: absolute;\n bottom: 0px;\n left: 0px;\n height: 4px;\n border-radius: 2px;\n background-color: transparent;\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: 1s;\n transition-delay: 0s;\n}\n.dv-scrollable:hover .dv-scrollbar-horizontal, .dv-scrollable.dv-scrollable-resizing .dv-scrollbar-horizontal, .dv-scrollable.dv-scrollable-scrolling .dv-scrollbar-horizontal {\n background-color: var(--dv-scrollbar-background-color, rgba(255, 255, 255, 0.25));\n}\n.dv-svg {\n display: inline-block;\n fill: currentcolor;\n line-height: 1;\n stroke: currentcolor;\n stroke-width: 0;\n}\n.dockview-theme-dark {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n}\n.dockview-theme-dark .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-light {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: white;\n --dv-tabs-and-actions-container-background-color: #f3f3f3;\n --dv-activegroup-visiblepanel-tab-background-color: white;\n --dv-activegroup-hiddenpanel-tab-background-color: #ececec;\n --dv-inactivegroup-visiblepanel-tab-background-color: white;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #ececec;\n --dv-tab-divider-color: white;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.7);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(51, 51, 51, 0.7);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(51, 51, 51, 0.35);\n --dv-separator-border: rgba(128, 128, 128, 0.35);\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n}\n.dockview-theme-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-vs {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n --dv-tabs-and-actions-container-background-color: #2d2d30;\n --dv-tabs-and-actions-container-height: 20px;\n --dv-tabs-and-actions-container-font-size: 11px;\n --dv-activegroup-visiblepanel-tab-background-color: #007acc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #3f3f46;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: white;\n --dv-inactivegroup-visiblepanel-tab-color: white;\n --dv-inactivegroup-hiddenpanel-tab-color: white;\n}\n.dockview-theme-vs .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n}\n\n.dockview-theme-abyss {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-color-abyss-dark: #000c18;\n --dv-color-abyss: #10192c;\n --dv-color-abyss-light: #1c1c2a;\n --dv-color-abyss-lighter: #2b2b4a;\n --dv-color-abyss-accent: rgb(91, 30, 207);\n --dv-color-abyss-primary-text: white;\n --dv-color-abyss-secondary-text: rgb(148, 151, 169);\n --dv-group-view-background-color: var(--dv-color-abyss-dark);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-abyss-light\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-dark\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-dark\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(--dv-color-abyss);\n --dv-tab-divider-color: var(--dv-color-abyss-lighter);\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.5);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(255, 255, 255, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(255, 255, 255, 0.25);\n --dv-separator-border: var(--dv-color-abyss-lighter);\n --dv-paneview-header-border-color: var(--dv-color-abyss-lighter);\n --dv-paneview-active-outline-color: #596f99;\n}\n.dockview-theme-abyss .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n\n.dockview-theme-dracula {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-group-view-background-color: #282a36;\n --dv-tabs-and-actions-container-background-color: #191a21;\n --dv-activegroup-visiblepanel-tab-background-color: #282a36;\n --dv-activegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-inactivegroup-visiblepanel-tab-background-color: #282a36;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-tab-divider-color: #191a21;\n --dv-activegroup-visiblepanel-tab-color: rgb(248, 248, 242);\n --dv-activegroup-hiddenpanel-tab-color: rgb(98, 114, 164);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(98, 114, 164, 0.5);\n --dv-separator-border: #bd93f9;\n --dv-paneview-header-border-color: #bd93f9;\n --dv-paneview-active-outline-color: #6272a4;\n}\n.dockview-theme-dracula .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n top: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n bottom: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #5e3d5a;\n z-index: 999;\n}\n\n.dockview-theme-replit {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n padding: 10px;\n background-color: #ebeced;\n --dv-group-view-background-color: #ebeced;\n --dv-tabs-and-actions-container-background-color: #fcfcfc;\n --dv-activegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-activegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-sash-color: #cfd1d3;\n --dv-active-sash-color: #babbbb;\n}\n.dockview-theme-replit .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-replit .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-resize-container {\n border-radius: 10px !important;\n border: none;\n}\n.dockview-theme-replit .dv-groupview {\n overflow: hidden;\n border-radius: 10px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container {\n border-bottom: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab {\n margin: 4px;\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab:hover {\n background-color: #e4e5e6 !important;\n}\n.dockview-theme-replit .dv-groupview .dv-content-container {\n background-color: #fcfcfc;\n}\n.dockview-theme-replit .dv-groupview.dv-active-group {\n border: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview.dv-inactive-group {\n border: 1px solid transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled)::after {\n content: \"\";\n height: 4px;\n width: 40px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-sash-color);\n position: absolute;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):hover, .dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):active {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):hover::after, .dockview-theme-replit .dv-vertical > .dv-sash-container > .dv-sash:not(.disabled):active::after {\n background-color: var(--dv-active-sash-color);\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled)::after {\n content: \"\";\n height: 40px;\n width: 4px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-sash-color);\n position: absolute;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):hover, .dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):active {\n background-color: transparent;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):hover::after, .dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):active::after {\n background-color: var(--dv-active-sash-color);\n}\n\n.dockview-theme-abyss-spaced {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 20px;\n --dv-tab-margin: 0.5rem 0.25rem;\n --dv-tabs-and-actions-container-height: 44px;\n --dv-border-radius: 20px;\n --dv-color-abyss-dark: rgb(11, 6, 17);\n --dv-color-abyss: #16121f;\n --dv-color-abyss-light: #201d2b;\n --dv-color-abyss-lighter: #2a2837;\n --dv-color-abyss-accent: rgb(91, 30, 207);\n --dv-color-abyss-primary-text: white;\n --dv-color-abyss-secondary-text: rgb(148, 151, 169);\n --dv-drag-over-border: 2px solid var(--dv-color-abyss-accent);\n --dv-drag-over-background-color: \"\";\n --dv-group-view-background-color: var(--dv-color-abyss-dark);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-abyss);\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-lighter\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-abyss-light\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-abyss-lighter\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-abyss-light\n );\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-abyss-primary-text);\n --dv-activegroup-hiddenpanel-tab-color: var(\n --dv-color-abyss-secondary-text\n );\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-abyss-primary-text\n );\n --dv-inactivegroup-hiddenpanel-tab-color: var(\n --dv-color-abyss-secondary-text\n );\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-active-sash-color: var(--dv-color-abyss-accent);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(0, 0, 0, 0.5);\n padding: 10px;\n background-color: var(--dv-color-abyss-dark);\n}\n.dockview-theme-abyss-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-abyss-spaced .dv-sash {\n border-radius: 4px;\n}\n.dockview-theme-abyss-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-abyss-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-abyss-spaced .dv-tabs-overflow-container,\n.dockview-theme-abyss-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: 8px;\n height: unset !important;\n}\n.dockview-theme-abyss-spaced .dv-tab {\n border-radius: 8px;\n}\n.dockview-theme-abyss-spaced .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-abyss-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n}\n.dockview-theme-abyss-spaced .dv-resize-container .dv-groupview {\n border: 2px solid var(--dv-color-abyss-dark);\n}\n\n.dockview-theme-light-spaced {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: transparent;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-overlay-z-index: 999;\n --dv-tab-font-size: inherit;\n --dv-border-radius: 0px;\n --dv-tab-margin: 0;\n --dv-sash-color: transparent;\n --dv-active-sash-color: transparent;\n --dv-active-sash-transition-duration: 0.1s;\n --dv-active-sash-transition-delay: 0.5s;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 20px;\n --dv-tab-margin: 0.5rem 0.25rem;\n --dv-tabs-and-actions-container-height: 44px;\n --dv-border-radius: 20px;\n --dv-drag-over-border: 2px solid rgb(91, 30, 207);\n --dv-drag-over-background-color: \"\";\n --dv-group-view-background-color: #f6f5f9;\n --dv-tabs-and-actions-container-background-color: white;\n --dv-activegroup-visiblepanel-tab-background-color: #ededf0;\n --dv-activegroup-hiddenpanel-tab-background-color: #f9f9fa;\n --dv-inactivegroup-visiblepanel-tab-background-color: #ededf0;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #f9f9fa;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(104, 107, 130);\n --dv-activegroup-hiddenpanel-tab-color: rgb(148, 151, 169);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(104, 107, 130);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(148, 151, 169);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-active-sash-color: rgb(91, 30, 207);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(0, 0, 0, 0.1);\n padding: 10px;\n background-color: #f6f5f9;\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n}\n.dockview-theme-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-light-spaced .dv-sash {\n border-radius: 4px;\n}\n.dockview-theme-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: 8px;\n height: unset !important;\n}\n.dockview-theme-light-spaced .dv-tab {\n border-radius: 8px;\n}\n.dockview-theme-light-spaced .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n}\n.dockview-theme-light-spaced .dv-resize-container .dv-groupview {\n border: 2px solid rgba(255, 255, 255, 0.1);\n}\n.dv-drop-target-container {\n position: absolute;\n z-index: 9999;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n pointer-events: none;\n overflow: hidden;\n --dv-transition-duration: 300ms;\n}\n.dv-drop-target-container .dv-drop-target-anchor {\n position: relative;\n border: var(--dv-drag-over-border);\n transition: opacity var(--dv-transition-duration) ease-in, top var(--dv-transition-duration) ease-out, left var(--dv-transition-duration) ease-out, width var(--dv-transition-duration) ease-out, height var(--dv-transition-duration) ease-out;\n background-color: var(--dv-drag-over-background-color);\n opacity: 1;\n}\n.dv-drop-target {\n position: relative;\n --dv-transition-duration: 70ms;\n}\n.dv-drop-target > .dv-drop-target-dropzone {\n position: absolute;\n left: 0px;\n top: 0px;\n height: 100%;\n width: 100%;\n z-index: 1000;\n pointer-events: none;\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection {\n position: relative;\n box-sizing: border-box;\n height: 100%;\n width: 100%;\n border: var(--dv-drag-over-border);\n background-color: var(--dv-drag-over-background-color);\n transition: top var(--dv-transition-duration) ease-out, left var(--dv-transition-duration) ease-out, width var(--dv-transition-duration) ease-out, height var(--dv-transition-duration) ease-out, opacity var(--dv-transition-duration) ease-out;\n will-change: transform;\n pointer-events: none;\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-top.dv-drop-target-small-vertical {\n border-top: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-bottom.dv-drop-target-small-vertical {\n border-bottom: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-left.dv-drop-target-small-horizontal {\n border-left: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-right.dv-drop-target-small-horizontal {\n border-right: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-dockview {\n position: relative;\n background-color: var(--dv-group-view-background-color);\n}\n.dv-dockview .dv-watermark-container {\n position: absolute;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n z-index: 1;\n}\n.dv-dockview .dv-overlay-render-container {\n position: relative;\n}\n\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-inactivegroup-visiblepanel-tab-background-color);\n color: var(--dv-inactivegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-scrollable > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n color: var(--dv-inactivegroup-hiddenpanel-tab-color);\n}\n\n/**\n * when a tab is dragged we lose the above stylings because they are conditional on parent elements\n * therefore we also set some stylings for the dragging event\n **/\n.dv-tab.dv-tab-dragging {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview {\n display: flex;\n flex-direction: column;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n}\n.dv-groupview:focus {\n outline: none;\n}\n.dv-groupview > .dv-content-container {\n flex-grow: 1;\n min-height: 0;\n outline: none;\n}\n.dv-root-wrapper {\n height: 100%;\n width: 100%;\n}\n.dv-grid-view,\n.dv-branch-node {\n height: 100%;\n width: 100%;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-top {\n background-color: red;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-bottom {\n background-color: green;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-left {\n background-color: yellow;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-right {\n background-color: blue;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-topleft,\n.dv-debug .dv-resize-container .dv-resize-handle-topright,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomleft,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomright {\n background-color: cyan;\n}\n\n.dv-resize-container {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: calc(var(--dv-overlay-z-index) - 2);\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: var(--dv-floating-box-shadow);\n}\n.dv-resize-container.dv-hidden {\n display: none;\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: 0.5;\n}\n.dv-resize-container .dv-resize-handle-top {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-bottom {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-left {\n height: calc(100% - 8px);\n width: 4px;\n left: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-right {\n height: calc(100% - 8px);\n width: 4px;\n right: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-topleft {\n height: 4px;\n width: 4px;\n top: -2px;\n left: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: nw-resize;\n}\n.dv-resize-container .dv-resize-handle-topright {\n height: 4px;\n width: 4px;\n right: -2px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ne-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomleft {\n height: 4px;\n width: 4px;\n left: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: sw-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomright {\n height: 4px;\n width: 4px;\n right: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: se-resize;\n}\n.dv-render-overlay {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: 1;\n height: 100%;\n}\n.dv-render-overlay.dv-render-overlay-float {\n z-index: calc(var(--dv-overlay-z-index) - 1);\n}\n\n.dv-debug .dv-render-overlay {\n outline: 1px solid red;\n outline-offset: -1;\n}\n.dv-pane-container {\n height: 100%;\n width: 100%;\n}\n.dv-pane-container.dv-animated .dv-view {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-pane-container .dv-view {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n padding: 0px !important;\n}\n.dv-pane-container .dv-view:not(:first-child)::before {\n background-color: transparent !important;\n}\n.dv-pane-container .dv-view:not(:first-child) .dv-pane > .dv-pane-header {\n border-top: 1px solid var(--dv-paneview-header-border-color);\n}\n.dv-pane-container .dv-view .dv-default-header {\n background-color: var(--dv-group-view-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n display: flex;\n padding: 0px 8px;\n cursor: pointer;\n}\n.dv-pane-container .dv-view .dv-default-header .dv-pane-header-icon {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.dv-pane-container .dv-view .dv-default-header > span {\n padding-left: 8px;\n flex-grow: 1;\n}\n.dv-pane-container:first-of-type > .dv-pane > .dv-pane-header {\n border-top: none !important;\n}\n.dv-pane-container .dv-pane {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n height: 100%;\n}\n.dv-pane-container .dv-pane .dv-pane-header {\n box-sizing: border-box;\n user-select: none;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-header.dv-pane-draggable {\n cursor: pointer;\n}\n.dv-pane-container .dv-pane .dv-pane-header:focus:before, .dv-pane-container .dv-pane .dv-pane-header:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-pane-container .dv-pane .dv-pane-body {\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-body:focus:before, .dv-pane-container .dv-pane .dv-pane-body:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-enabled {\n background-color: black;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-disabled {\n background-color: orange;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-maximum {\n background-color: green;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-minimum {\n background-color: red;\n}\n\n.dv-split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container.dv-splitview-disabled > .dv-sash-container > .dv-sash {\n pointer-events: none;\n}\n.dv-split-view-container.dv-animation .dv-view,\n.dv-split-view-container.dv-animation .dv-sash {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-split-view-container.dv-horizontal {\n height: 100%;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash {\n height: 100%;\n width: 4px;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ew-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: w-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: e-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 100%;\n width: 1px;\n}\n.dv-split-view-container.dv-vertical {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash {\n width: 100%;\n height: 4px;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ns-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: n-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: s-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 1px;\n width: 100%;\n}\n.dv-split-view-container .dv-sash-container {\n height: 100%;\n width: 100%;\n position: absolute;\n}\n.dv-split-view-container .dv-sash-container .dv-sash {\n position: absolute;\n z-index: 99;\n outline: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n touch-action: none;\n background-color: var(--dv-sash-color, transparent);\n}\n.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):active, .dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):hover {\n background-color: var(--dv-active-sash-color, transparent);\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: var(--dv-active-sash-transition-duration, 0.1s);\n transition-delay: var(--dv-active-sash-transition-delay, 0.5s);\n}\n.dv-split-view-container .dv-view-container {\n position: relative;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container .dv-view-container .dv-view {\n height: 100%;\n box-sizing: border-box;\n overflow: auto;\n position: absolute;\n}\n.dv-split-view-container.dv-separator-border .dv-view:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-separator-border);\n}\n.dv-dragged {\n transform: translate3d(0px, 0px, 0px); /* forces tab to be drawn on a separate layer (see https://github.com/microsoft/vscode/issues/18733) */\n}\n\n.dv-tab {\n flex-shrink: 0;\n}\n.dv-tab:focus-within, .dv-tab:focus {\n position: relative;\n}\n.dv-tab:focus-within::after, .dv-tab:focus::after {\n position: absolute;\n content: \"\";\n height: 100%;\n width: 100%;\n top: 0px;\n left: 0px;\n pointer-events: none;\n outline: 1px solid var(--dv-tab-divider-color) !important;\n outline-offset: -1px;\n z-index: 5;\n}\n.dv-tab.dv-tab-dragging .dv-default-tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-tab.dv-active-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: hidden;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab:hover .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab .dv-default-tab {\n position: relative;\n height: 100%;\n display: flex;\n align-items: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.dv-tab .dv-default-tab .dv-default-tab-content {\n flex-grow: 1;\n margin-right: 4px;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-overflow-dropdown-default {\n height: 100%;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n margin: var(--dv-tab-margin);\n display: flex;\n align-items: center;\n flex-shrink: 0;\n padding: 0.25rem 0.5rem;\n cursor: pointer;\n}\n.dv-tabs-overflow-dropdown-default > span {\n padding-left: 0.25rem;\n}\n.dv-tabs-overflow-dropdown-default > svg {\n transform: rotate(90deg);\n}\n.dv-tabs-container {\n display: flex;\n height: 100%;\n overflow: auto;\n scrollbar-width: thin;\n /* Track */\n /* Handle */\n}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-tab-divider-color);\n width: 1px;\n height: 100%;\n}\n.dv-tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.dv-tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n}\n\n.dv-scrollable > .dv-tabs-container {\n overflow: hidden;\n}\n\n.dv-tab {\n -webkit-user-drag: element;\n outline: none;\n padding: 0.25rem 0.5rem;\n cursor: pointer;\n position: relative;\n box-sizing: border-box;\n font-size: var(--dv-tab-font-size);\n margin: var(--dv-tab-margin);\n}\n\n.dv-tabs-overflow-container {\n flex-direction: column;\n height: unset;\n border: 1px solid var(--dv-tab-divider-color);\n background-color: var(--dv-group-view-background-color);\n}\n.dv-tabs-overflow-container .dv-tab:not(:last-child) {\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-tabs-overflow-container .dv-inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-tabs-and-actions-container {\n display: flex;\n background-color: var(--dv-tabs-and-actions-container-background-color);\n flex-shrink: 0;\n box-sizing: border-box;\n height: var(--dv-tabs-and-actions-container-height);\n font-size: var(--dv-tabs-and-actions-container-font-size);\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-scrollable {\n flex-grow: 1;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container {\n flex-grow: 1;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container .dv-tab {\n flex-grow: 1;\n padding: 0px;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-void-container {\n flex-grow: 0;\n}\n.dv-tabs-and-actions-container .dv-void-container {\n display: flex;\n flex-grow: 1;\n cursor: grab;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container {\n display: flex;\n}\n.dv-watermark {\n display: flex;\n height: 100%;\n}";
|
|
38
38
|
styleInject(css_248z);
|
|
39
39
|
|
|
40
40
|
class TransferObject {
|
|
@@ -246,14 +246,6 @@ class Emitter {
|
|
|
246
246
|
}
|
|
247
247
|
Emitter.ENABLE_TRACKING = false;
|
|
248
248
|
Emitter.MEMORY_LEAK_WATCHER = new LeakageMonitor();
|
|
249
|
-
function addDisposableWindowListener(element, type, listener, options) {
|
|
250
|
-
element.addEventListener(type, listener, options);
|
|
251
|
-
return {
|
|
252
|
-
dispose: () => {
|
|
253
|
-
element.removeEventListener(type, listener, options);
|
|
254
|
-
},
|
|
255
|
-
};
|
|
256
|
-
}
|
|
257
249
|
function addDisposableListener(element, type, listener, options) {
|
|
258
250
|
element.addEventListener(type, listener, options);
|
|
259
251
|
return {
|
|
@@ -432,9 +424,6 @@ function isAncestor(testChild, testAncestor) {
|
|
|
432
424
|
}
|
|
433
425
|
return false;
|
|
434
426
|
}
|
|
435
|
-
function getElementsByTagName(tag) {
|
|
436
|
-
return Array.prototype.slice.call(document.getElementsByTagName(tag), 0);
|
|
437
|
-
}
|
|
438
427
|
function trackFocus(element) {
|
|
439
428
|
return new FocusTracker(element);
|
|
440
429
|
}
|
|
@@ -481,14 +470,8 @@ class FocusTracker extends CompositeDisposable {
|
|
|
481
470
|
}
|
|
482
471
|
}
|
|
483
472
|
};
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
this.addDisposables(addDisposableListener(element, 'blur', onBlur, true));
|
|
487
|
-
}
|
|
488
|
-
else {
|
|
489
|
-
this.addDisposables(addDisposableWindowListener(element, 'focus', onFocus, true));
|
|
490
|
-
this.addDisposables(addDisposableWindowListener(element, 'blur', onBlur, true));
|
|
491
|
-
}
|
|
473
|
+
this.addDisposables(addDisposableListener(element, 'focus', onFocus, true));
|
|
474
|
+
this.addDisposables(addDisposableListener(element, 'blur', onBlur, true));
|
|
492
475
|
}
|
|
493
476
|
refreshState() {
|
|
494
477
|
this._refreshStateHandler();
|
|
@@ -562,11 +545,30 @@ function isInDocument(element) {
|
|
|
562
545
|
function addTestId(element, id) {
|
|
563
546
|
element.setAttribute('data-testid', id);
|
|
564
547
|
}
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
548
|
+
/**
|
|
549
|
+
* Should be more efficient than element.querySelectorAll("*") since there
|
|
550
|
+
* is no need to store every element in-memory using this approach
|
|
551
|
+
*/
|
|
552
|
+
function allTagsNamesInclusiveOfShadowDoms(tagNames) {
|
|
553
|
+
const iframes = [];
|
|
554
|
+
function findIframesInNode(node) {
|
|
555
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
556
|
+
if (tagNames.includes(node.tagName)) {
|
|
557
|
+
iframes.push(node);
|
|
558
|
+
}
|
|
559
|
+
if (node.shadowRoot) {
|
|
560
|
+
findIframesInNode(node.shadowRoot);
|
|
561
|
+
}
|
|
562
|
+
for (const child of node.children) {
|
|
563
|
+
findIframesInNode(child);
|
|
564
|
+
}
|
|
565
|
+
}
|
|
566
|
+
}
|
|
567
|
+
findIframesInNode(document.documentElement);
|
|
568
|
+
return iframes;
|
|
569
|
+
}
|
|
570
|
+
function disableIframePointEvents(rootNode = document) {
|
|
571
|
+
const iframes = allTagsNamesInclusiveOfShadowDoms(['IFRAME', 'WEBVIEW']);
|
|
570
572
|
const original = new WeakMap(); // don't hold onto HTMLElement references longer than required
|
|
571
573
|
for (const iframe of iframes) {
|
|
572
574
|
original.set(iframe, iframe.style.pointerEvents);
|
|
@@ -618,6 +620,7 @@ class Classnames {
|
|
|
618
620
|
}
|
|
619
621
|
}
|
|
620
622
|
}
|
|
623
|
+
const DEBOUCE_DELAY = 100;
|
|
621
624
|
function isChildEntirelyVisibleWithinParent(child, parent) {
|
|
622
625
|
//
|
|
623
626
|
const childPosition = getDomNodePagePosition(child);
|
|
@@ -631,6 +634,41 @@ function isChildEntirelyVisibleWithinParent(child, parent) {
|
|
|
631
634
|
}
|
|
632
635
|
return true;
|
|
633
636
|
}
|
|
637
|
+
function onDidWindowMoveEnd(window) {
|
|
638
|
+
const emitter = new Emitter();
|
|
639
|
+
let previousScreenX = window.screenX;
|
|
640
|
+
let previousScreenY = window.screenY;
|
|
641
|
+
let timeout;
|
|
642
|
+
const checkMovement = () => {
|
|
643
|
+
if (window.closed) {
|
|
644
|
+
return;
|
|
645
|
+
}
|
|
646
|
+
const currentScreenX = window.screenX;
|
|
647
|
+
const currentScreenY = window.screenY;
|
|
648
|
+
if (currentScreenX !== previousScreenX ||
|
|
649
|
+
currentScreenY !== previousScreenY) {
|
|
650
|
+
clearTimeout(timeout);
|
|
651
|
+
timeout = setTimeout(() => {
|
|
652
|
+
emitter.fire();
|
|
653
|
+
}, DEBOUCE_DELAY);
|
|
654
|
+
previousScreenX = currentScreenX;
|
|
655
|
+
previousScreenY = currentScreenY;
|
|
656
|
+
}
|
|
657
|
+
requestAnimationFrame(checkMovement);
|
|
658
|
+
};
|
|
659
|
+
checkMovement();
|
|
660
|
+
return emitter;
|
|
661
|
+
}
|
|
662
|
+
function onDidWindowResizeEnd(element, cb) {
|
|
663
|
+
let resizeTimeout;
|
|
664
|
+
const disposable = new CompositeDisposable(addDisposableListener(element, 'resize', () => {
|
|
665
|
+
clearTimeout(resizeTimeout);
|
|
666
|
+
resizeTimeout = setTimeout(() => {
|
|
667
|
+
cb();
|
|
668
|
+
}, DEBOUCE_DELAY);
|
|
669
|
+
}));
|
|
670
|
+
return disposable;
|
|
671
|
+
}
|
|
634
672
|
|
|
635
673
|
function tail(arr) {
|
|
636
674
|
if (arr.length === 0) {
|
|
@@ -3570,6 +3608,12 @@ class DockviewApi {
|
|
|
3570
3608
|
get onUnhandledDragOverEvent() {
|
|
3571
3609
|
return this.component.onUnhandledDragOverEvent;
|
|
3572
3610
|
}
|
|
3611
|
+
get onDidPopoutGroupSizeChange() {
|
|
3612
|
+
return this.component.onDidPopoutGroupSizeChange;
|
|
3613
|
+
}
|
|
3614
|
+
get onDidPopoutGroupPositionChange() {
|
|
3615
|
+
return this.component.onDidPopoutGroupPositionChange;
|
|
3616
|
+
}
|
|
3573
3617
|
/**
|
|
3574
3618
|
* All panel objects.
|
|
3575
3619
|
*/
|
|
@@ -4535,26 +4579,25 @@ class PaneviewPanel extends BasePanelView {
|
|
|
4535
4579
|
this._headerVisible = value;
|
|
4536
4580
|
this.header.style.display = value ? '' : 'none';
|
|
4537
4581
|
}
|
|
4538
|
-
constructor(
|
|
4539
|
-
super(id, component, new PaneviewPanelApiImpl(id, component));
|
|
4540
|
-
this.headerComponent = headerComponent;
|
|
4582
|
+
constructor(options) {
|
|
4583
|
+
super(options.id, options.component, new PaneviewPanelApiImpl(options.id, options.component));
|
|
4541
4584
|
this._onDidChangeExpansionState = new Emitter({ replay: true });
|
|
4542
4585
|
this.onDidChangeExpansionState = this._onDidChangeExpansionState.event;
|
|
4543
4586
|
this._onDidChange = new Emitter();
|
|
4544
4587
|
this.onDidChange = this._onDidChange.event;
|
|
4545
|
-
this.headerSize = 22;
|
|
4546
4588
|
this._orthogonalSize = 0;
|
|
4547
4589
|
this._size = 0;
|
|
4548
|
-
this._minimumBodySize = 100;
|
|
4549
|
-
this._maximumBodySize = Number.POSITIVE_INFINITY;
|
|
4550
4590
|
this._isExpanded = false;
|
|
4551
|
-
this.expandedSize = 0;
|
|
4552
4591
|
this.api.pane = this; // TODO cannot use 'this' before 'super'
|
|
4553
4592
|
this.api.initialize(this);
|
|
4554
|
-
this.
|
|
4555
|
-
this.
|
|
4593
|
+
this.headerSize = options.headerSize;
|
|
4594
|
+
this.headerComponent = options.headerComponent;
|
|
4595
|
+
this._minimumBodySize = options.minimumBodySize;
|
|
4596
|
+
this._maximumBodySize = options.maximumBodySize;
|
|
4597
|
+
this._isExpanded = options.isExpanded;
|
|
4598
|
+
this._headerVisible = options.isHeaderVisible;
|
|
4556
4599
|
this._onDidChangeExpansionState.fire(this.isExpanded()); // initialize value
|
|
4557
|
-
this._orientation = orientation;
|
|
4600
|
+
this._orientation = options.orientation;
|
|
4558
4601
|
this.element.classList.add('dv-pane');
|
|
4559
4602
|
this.addDisposables(this.api.onWillVisibilityChange((event) => {
|
|
4560
4603
|
const { isVisible } = event;
|
|
@@ -4621,9 +4664,6 @@ class PaneviewPanel extends BasePanelView {
|
|
|
4621
4664
|
const [width, height] = this.orientation === Orientation.HORIZONTAL
|
|
4622
4665
|
? [size, orthogonalSize]
|
|
4623
4666
|
: [orthogonalSize, size];
|
|
4624
|
-
if (this.isExpanded()) {
|
|
4625
|
-
this.expandedSize = width;
|
|
4626
|
-
}
|
|
4627
4667
|
super.layout(width, height);
|
|
4628
4668
|
}
|
|
4629
4669
|
init(parameters) {
|
|
@@ -4680,15 +4720,25 @@ class PaneviewPanel extends BasePanelView {
|
|
|
4680
4720
|
}
|
|
4681
4721
|
|
|
4682
4722
|
class DraggablePaneviewPanel extends PaneviewPanel {
|
|
4683
|
-
constructor(
|
|
4684
|
-
super(
|
|
4685
|
-
|
|
4723
|
+
constructor(options) {
|
|
4724
|
+
super({
|
|
4725
|
+
id: options.id,
|
|
4726
|
+
component: options.component,
|
|
4727
|
+
headerComponent: options.headerComponent,
|
|
4728
|
+
orientation: options.orientation,
|
|
4729
|
+
isExpanded: options.isExpanded,
|
|
4730
|
+
isHeaderVisible: true,
|
|
4731
|
+
headerSize: options.headerSize,
|
|
4732
|
+
minimumBodySize: options.minimumBodySize,
|
|
4733
|
+
maximumBodySize: options.maximumBodySize,
|
|
4734
|
+
});
|
|
4686
4735
|
this._onDidDrop = new Emitter();
|
|
4687
4736
|
this.onDidDrop = this._onDidDrop.event;
|
|
4688
4737
|
this._onUnhandledDragOverEvent = new Emitter();
|
|
4689
4738
|
this.onUnhandledDragOverEvent = this._onUnhandledDragOverEvent.event;
|
|
4739
|
+
this.accessor = options.accessor;
|
|
4690
4740
|
this.addDisposables(this._onDidDrop, this._onUnhandledDragOverEvent);
|
|
4691
|
-
if (!disableDnd) {
|
|
4741
|
+
if (!options.disableDnd) {
|
|
4692
4742
|
this.initDragFeatures();
|
|
4693
4743
|
}
|
|
4694
4744
|
}
|
|
@@ -5201,9 +5251,15 @@ class Tabs extends CompositeDisposable {
|
|
|
5201
5251
|
this._tabsList = document.createElement('div');
|
|
5202
5252
|
this._tabsList.className = 'dv-tabs-container dv-horizontal';
|
|
5203
5253
|
this.showTabsOverflowControl = options.showTabsOverflowControl;
|
|
5204
|
-
|
|
5205
|
-
|
|
5206
|
-
|
|
5254
|
+
if (accessor.options.scrollbars === 'native') {
|
|
5255
|
+
this._element = this._tabsList;
|
|
5256
|
+
}
|
|
5257
|
+
else {
|
|
5258
|
+
const scrollbar = new Scrollbar(this._tabsList);
|
|
5259
|
+
this._element = scrollbar.element;
|
|
5260
|
+
this.addDisposables(scrollbar);
|
|
5261
|
+
}
|
|
5262
|
+
this.addDisposables(this._onOverflowTabsChange, this._observerDisposable, this._onWillShowOverlay, this._onDrop, this._onTabDragStart, addDisposableListener(this.element, 'pointerdown', (event) => {
|
|
5207
5263
|
if (event.defaultPrevented) {
|
|
5208
5264
|
return;
|
|
5209
5265
|
}
|
|
@@ -5628,6 +5684,7 @@ const PROPERTY_KEYS_DOCKVIEW = (() => {
|
|
|
5628
5684
|
dndEdges: undefined,
|
|
5629
5685
|
theme: undefined,
|
|
5630
5686
|
disableTabsOverflowList: undefined,
|
|
5687
|
+
scrollbars: undefined,
|
|
5631
5688
|
};
|
|
5632
5689
|
return Object.keys(properties);
|
|
5633
5690
|
})();
|
|
@@ -7322,7 +7379,7 @@ class Overlay extends CompositeDisposable {
|
|
|
7322
7379
|
dispose: () => {
|
|
7323
7380
|
iframes.release();
|
|
7324
7381
|
},
|
|
7325
|
-
},
|
|
7382
|
+
}, addDisposableListener(window, 'pointermove', (e) => {
|
|
7326
7383
|
const containerRect = this.options.container.getBoundingClientRect();
|
|
7327
7384
|
const x = e.clientX - containerRect.left;
|
|
7328
7385
|
const y = e.clientY - containerRect.top;
|
|
@@ -7359,7 +7416,7 @@ class Overlay extends CompositeDisposable {
|
|
|
7359
7416
|
bounds.right = right;
|
|
7360
7417
|
}
|
|
7361
7418
|
this.setBounds(bounds);
|
|
7362
|
-
}),
|
|
7419
|
+
}), addDisposableListener(window, 'pointerup', () => {
|
|
7363
7420
|
toggleClass(this._element, 'dv-resize-container-dragging', false);
|
|
7364
7421
|
move.dispose();
|
|
7365
7422
|
this._onDidChangeEnd.fire();
|
|
@@ -7404,7 +7461,7 @@ class Overlay extends CompositeDisposable {
|
|
|
7404
7461
|
e.preventDefault();
|
|
7405
7462
|
let startPosition = null;
|
|
7406
7463
|
const iframes = disableIframePointEvents();
|
|
7407
|
-
move.value = new CompositeDisposable(
|
|
7464
|
+
move.value = new CompositeDisposable(addDisposableListener(window, 'pointermove', (e) => {
|
|
7408
7465
|
const containerRect = this.options.container.getBoundingClientRect();
|
|
7409
7466
|
const overlayRect = this._element.getBoundingClientRect();
|
|
7410
7467
|
const y = e.clientY - containerRect.top;
|
|
@@ -7528,7 +7585,7 @@ class Overlay extends CompositeDisposable {
|
|
|
7528
7585
|
dispose: () => {
|
|
7529
7586
|
iframes.release();
|
|
7530
7587
|
},
|
|
7531
|
-
},
|
|
7588
|
+
}, addDisposableListener(window, 'pointerup', () => {
|
|
7532
7589
|
move.dispose();
|
|
7533
7590
|
this._onDidChangeEnd.fire();
|
|
7534
7591
|
}));
|
|
@@ -7811,7 +7868,7 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7811
7868
|
this._window = { value: externalWindow, disposable };
|
|
7812
7869
|
disposable.addDisposables(Disposable.from(() => {
|
|
7813
7870
|
externalWindow.close();
|
|
7814
|
-
}),
|
|
7871
|
+
}), addDisposableListener(window, 'beforeunload', () => {
|
|
7815
7872
|
/**
|
|
7816
7873
|
* before the main window closes we should close this popup too
|
|
7817
7874
|
* to be good citizens
|
|
@@ -7846,7 +7903,7 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7846
7903
|
* beforeunload must be registered after load for reasons I could not determine
|
|
7847
7904
|
* otherwise the beforeunload event will not fire when the window is closed
|
|
7848
7905
|
*/
|
|
7849
|
-
|
|
7906
|
+
addDisposableListener(externalWindow, 'beforeunload', () => {
|
|
7850
7907
|
/**
|
|
7851
7908
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
7852
7909
|
*/
|
|
@@ -7943,7 +8000,7 @@ class PopupService extends CompositeDisposable {
|
|
|
7943
8000
|
wrapper.style.left = `${position.x - offsetX}px`;
|
|
7944
8001
|
this._element.appendChild(wrapper);
|
|
7945
8002
|
this._active = wrapper;
|
|
7946
|
-
this._activeDisposable.value = new CompositeDisposable(
|
|
8003
|
+
this._activeDisposable.value = new CompositeDisposable(addDisposableListener(window, 'pointerdown', (event) => {
|
|
7947
8004
|
var _a;
|
|
7948
8005
|
const target = event.target;
|
|
7949
8006
|
if (!(target instanceof HTMLElement)) {
|
|
@@ -8122,6 +8179,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8122
8179
|
this.onDidRemovePanel = this._onDidRemovePanel.event;
|
|
8123
8180
|
this._onDidAddPanel = new Emitter();
|
|
8124
8181
|
this.onDidAddPanel = this._onDidAddPanel.event;
|
|
8182
|
+
this._onDidPopoutGroupSizeChange = new Emitter();
|
|
8183
|
+
this.onDidPopoutGroupSizeChange = this._onDidPopoutGroupSizeChange.event;
|
|
8184
|
+
this._onDidPopoutGroupPositionChange = new Emitter();
|
|
8185
|
+
this.onDidPopoutGroupPositionChange = this._onDidPopoutGroupPositionChange.event;
|
|
8125
8186
|
this._onDidLayoutFromJSON = new Emitter();
|
|
8126
8187
|
this.onDidLayoutFromJSON = this._onDidLayoutFromJSON.event;
|
|
8127
8188
|
this._onDidActivePanelChange = new Emitter();
|
|
@@ -8151,7 +8212,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8151
8212
|
if (options.debug) {
|
|
8152
8213
|
this.addDisposables(new StrictEventsSequencing(this));
|
|
8153
8214
|
}
|
|
8154
|
-
this.addDisposables(this.rootDropTargetContainer, this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this._onDidMaximizedGroupChange, this._onDidOptionsChange, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
|
|
8215
|
+
this.addDisposables(this.rootDropTargetContainer, this.overlayRenderContainer, this._onWillDragPanel, this._onWillDragGroup, this._onWillShowOverlay, this._onDidActivePanelChange, this._onDidAddPanel, this._onDidRemovePanel, this._onDidLayoutFromJSON, this._onDidDrop, this._onWillDrop, this._onDidMovePanel, this._onDidAddGroup, this._onDidRemoveGroup, this._onDidActiveGroupChange, this._onUnhandledDragOverEvent, this._onDidMaximizedGroupChange, this._onDidOptionsChange, this._onDidPopoutGroupSizeChange, this._onDidPopoutGroupPositionChange, this.onDidViewVisibilityChangeMicroTaskQueue(() => {
|
|
8155
8216
|
this.updateWatermark();
|
|
8156
8217
|
}), this.onDidAdd((event) => {
|
|
8157
8218
|
if (!this._moving) {
|
|
@@ -8172,7 +8233,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8172
8233
|
});
|
|
8173
8234
|
}), Event.any(this.onDidAdd, this.onDidRemove)(() => {
|
|
8174
8235
|
this.updateWatermark();
|
|
8175
|
-
}), Event.any(this.onDidAddPanel, this.onDidRemovePanel, this.onDidAddGroup, this.onDidRemove, this.onDidMovePanel, this.onDidActivePanelChange)(() => {
|
|
8236
|
+
}), Event.any(this.onDidAddPanel, this.onDidRemovePanel, this.onDidAddGroup, this.onDidRemove, this.onDidMovePanel, this.onDidActivePanelChange, this.onDidPopoutGroupPositionChange, this.onDidPopoutGroupSizeChange)(() => {
|
|
8176
8237
|
this._bufferOnDidLayoutChange.fire();
|
|
8177
8238
|
}), Disposable.from(() => {
|
|
8178
8239
|
// iterate over a copy of the array since .dispose() mutates the original array
|
|
@@ -8433,13 +8494,26 @@ class DockviewComponent extends BaseGrid {
|
|
|
8433
8494
|
},
|
|
8434
8495
|
},
|
|
8435
8496
|
};
|
|
8436
|
-
|
|
8497
|
+
const _onDidWindowPositionChange = onDidWindowMoveEnd(_window.window);
|
|
8498
|
+
popoutWindowDisposable.addDisposables(_onDidWindowPositionChange, onDidWindowResizeEnd(_window.window, () => {
|
|
8499
|
+
this._onDidPopoutGroupSizeChange.fire({
|
|
8500
|
+
width: _window.window.innerWidth,
|
|
8501
|
+
height: _window.window.innerHeight,
|
|
8502
|
+
group,
|
|
8503
|
+
});
|
|
8504
|
+
}), _onDidWindowPositionChange.event(() => {
|
|
8505
|
+
this._onDidPopoutGroupPositionChange.fire({
|
|
8506
|
+
screenX: _window.window.screenX,
|
|
8507
|
+
screenY: _window.window.screenX,
|
|
8508
|
+
group,
|
|
8509
|
+
});
|
|
8510
|
+
}),
|
|
8437
8511
|
/**
|
|
8438
8512
|
* ResizeObserver seems slow here, I do not know why but we don't need it
|
|
8439
8513
|
* since we can reply on the window resize event as we will occupy the full
|
|
8440
8514
|
* window dimensions
|
|
8441
8515
|
*/
|
|
8442
|
-
|
|
8516
|
+
addDisposableListener(_window.window, 'resize', () => {
|
|
8443
8517
|
group.layout(_window.window.innerWidth, _window.window.innerHeight);
|
|
8444
8518
|
}), overlayRenderContainer, Disposable.from(() => {
|
|
8445
8519
|
if (this.isDisposed) {
|
|
@@ -8653,7 +8727,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8653
8727
|
}
|
|
8654
8728
|
this.updateWatermark();
|
|
8655
8729
|
}
|
|
8656
|
-
orthogonalize(position) {
|
|
8730
|
+
orthogonalize(position, options) {
|
|
8657
8731
|
switch (position) {
|
|
8658
8732
|
case 'top':
|
|
8659
8733
|
case 'bottom':
|
|
@@ -8676,10 +8750,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8676
8750
|
case 'top':
|
|
8677
8751
|
case 'left':
|
|
8678
8752
|
case 'center':
|
|
8679
|
-
return this.createGroupAtLocation([0]); // insert into first position
|
|
8753
|
+
return this.createGroupAtLocation([0], undefined, options); // insert into first position
|
|
8680
8754
|
case 'bottom':
|
|
8681
8755
|
case 'right':
|
|
8682
|
-
return this.createGroupAtLocation([this.gridview.length]); // insert into last position
|
|
8756
|
+
return this.createGroupAtLocation([this.gridview.length], undefined, options); // insert into last position
|
|
8683
8757
|
default:
|
|
8684
8758
|
throw new Error(`unsupported position ${position}`);
|
|
8685
8759
|
}
|
|
@@ -9175,7 +9249,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
9175
9249
|
}
|
|
9176
9250
|
}
|
|
9177
9251
|
else {
|
|
9178
|
-
const group = this.orthogonalize(directionToPosition(options.direction));
|
|
9252
|
+
const group = this.orthogonalize(directionToPosition(options.direction), options);
|
|
9179
9253
|
if (!options.skipSetActive) {
|
|
9180
9254
|
this.doSetGroupAndPanelActive(group);
|
|
9181
9255
|
}
|
|
@@ -9617,8 +9691,8 @@ class DockviewComponent extends BaseGrid {
|
|
|
9617
9691
|
});
|
|
9618
9692
|
return panel;
|
|
9619
9693
|
}
|
|
9620
|
-
createGroupAtLocation(location, size) {
|
|
9621
|
-
const group = this.createGroup();
|
|
9694
|
+
createGroupAtLocation(location, size, options) {
|
|
9695
|
+
const group = this.createGroup(options);
|
|
9622
9696
|
this.doAddGroup(group, location, size);
|
|
9623
9697
|
return group;
|
|
9624
9698
|
}
|
|
@@ -9952,6 +10026,9 @@ class SplitviewComponent extends Resizable {
|
|
|
9952
10026
|
return this._splitview;
|
|
9953
10027
|
}
|
|
9954
10028
|
set splitview(value) {
|
|
10029
|
+
if (this._splitview) {
|
|
10030
|
+
this._splitview.dispose();
|
|
10031
|
+
}
|
|
9955
10032
|
this._splitview = value;
|
|
9956
10033
|
this._splitviewChangeDisposable.value = new CompositeDisposable(this._splitview.onDidSashEnd(() => {
|
|
9957
10034
|
this._onDidLayoutChange.fire(undefined);
|
|
@@ -10255,9 +10332,23 @@ class DefaultHeader extends CompositeDisposable {
|
|
|
10255
10332
|
}
|
|
10256
10333
|
|
|
10257
10334
|
const nextLayoutId = sequentialNumberGenerator();
|
|
10335
|
+
const HEADER_SIZE = 22;
|
|
10336
|
+
const MINIMUM_BODY_SIZE = 0;
|
|
10337
|
+
const MAXIMUM_BODY_SIZE = Number.MAX_SAFE_INTEGER;
|
|
10258
10338
|
class PaneFramework extends DraggablePaneviewPanel {
|
|
10259
10339
|
constructor(options) {
|
|
10260
|
-
super(
|
|
10340
|
+
super({
|
|
10341
|
+
accessor: options.accessor,
|
|
10342
|
+
id: options.id,
|
|
10343
|
+
component: options.component,
|
|
10344
|
+
headerComponent: options.headerComponent,
|
|
10345
|
+
orientation: options.orientation,
|
|
10346
|
+
isExpanded: options.isExpanded,
|
|
10347
|
+
disableDnd: options.disableDnd,
|
|
10348
|
+
headerSize: options.headerSize,
|
|
10349
|
+
minimumBodySize: options.minimumBodySize,
|
|
10350
|
+
maximumBodySize: options.maximumBodySize,
|
|
10351
|
+
});
|
|
10261
10352
|
this.options = options;
|
|
10262
10353
|
}
|
|
10263
10354
|
getBodyComponent() {
|
|
@@ -10352,7 +10443,7 @@ class PaneviewComponent extends Resizable {
|
|
|
10352
10443
|
this._options = Object.assign(Object.assign({}, this.options), options);
|
|
10353
10444
|
}
|
|
10354
10445
|
addPanel(options) {
|
|
10355
|
-
var _a;
|
|
10446
|
+
var _a, _b;
|
|
10356
10447
|
const body = this.options.createComponent({
|
|
10357
10448
|
id: options.id,
|
|
10358
10449
|
name: options.component,
|
|
@@ -10377,12 +10468,15 @@ class PaneviewComponent extends Resizable {
|
|
|
10377
10468
|
isExpanded: !!options.isExpanded,
|
|
10378
10469
|
disableDnd: !!this.options.disableDnd,
|
|
10379
10470
|
accessor: this,
|
|
10471
|
+
headerSize: (_a = options.headerSize) !== null && _a !== void 0 ? _a : HEADER_SIZE,
|
|
10472
|
+
minimumBodySize: MINIMUM_BODY_SIZE,
|
|
10473
|
+
maximumBodySize: MAXIMUM_BODY_SIZE,
|
|
10380
10474
|
});
|
|
10381
10475
|
this.doAddPanel(view);
|
|
10382
10476
|
const size = typeof options.size === 'number' ? options.size : Sizing.Distribute;
|
|
10383
10477
|
const index = typeof options.index === 'number' ? options.index : undefined;
|
|
10384
10478
|
view.init({
|
|
10385
|
-
params: (
|
|
10479
|
+
params: (_b = options.params) !== null && _b !== void 0 ? _b : {},
|
|
10386
10480
|
minimumBodySize: options.minimumBodySize,
|
|
10387
10481
|
maximumBodySize: options.maximumBodySize,
|
|
10388
10482
|
isExpanded: options.isExpanded,
|
|
@@ -10427,6 +10521,7 @@ class PaneviewComponent extends Resizable {
|
|
|
10427
10521
|
data: view.toJSON(),
|
|
10428
10522
|
minimumSize: minimum(view.minimumBodySize),
|
|
10429
10523
|
maximumSize: maximum(view.maximumBodySize),
|
|
10524
|
+
headerSize: view.headerSize,
|
|
10430
10525
|
expanded: view.isExpanded(),
|
|
10431
10526
|
};
|
|
10432
10527
|
});
|
|
@@ -10447,6 +10542,7 @@ class PaneviewComponent extends Resizable {
|
|
|
10447
10542
|
descriptor: {
|
|
10448
10543
|
size,
|
|
10449
10544
|
views: views.map((view) => {
|
|
10545
|
+
var _a, _b, _c;
|
|
10450
10546
|
const data = view.data;
|
|
10451
10547
|
const body = this.options.createComponent({
|
|
10452
10548
|
id: data.id,
|
|
@@ -10473,6 +10569,9 @@ class PaneviewComponent extends Resizable {
|
|
|
10473
10569
|
isExpanded: !!view.expanded,
|
|
10474
10570
|
disableDnd: !!this.options.disableDnd,
|
|
10475
10571
|
accessor: this,
|
|
10572
|
+
headerSize: (_a = view.headerSize) !== null && _a !== void 0 ? _a : HEADER_SIZE,
|
|
10573
|
+
minimumBodySize: (_b = view.minimumSize) !== null && _b !== void 0 ? _b : MINIMUM_BODY_SIZE,
|
|
10574
|
+
maximumBodySize: (_c = view.maximumSize) !== null && _c !== void 0 ? _c : MAXIMUM_BODY_SIZE,
|
|
10476
10575
|
});
|
|
10477
10576
|
this.doAddPanel(panel);
|
|
10478
10577
|
queue.push(() => {
|