dockview-core 8.3.1 → 8.4.1
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/cjs/api/component.api.d.ts +26 -1
- package/dist/cjs/dismissableLayer.d.ts +19 -7
- package/dist/cjs/dnd/ghost.d.ts +3 -0
- package/dist/cjs/dnd/pointer/pointerDragController.d.ts +1 -0
- package/dist/cjs/dnd/pointer/pointerDragSource.d.ts +1 -0
- package/dist/cjs/dnd/pointer/pointerGhost.d.ts +6 -2
- package/dist/cjs/dockview/components/popupService.d.ts +2 -0
- package/dist/cjs/dockview/components/titlebar/tabGroups.d.ts +3 -1
- package/dist/cjs/dockview/components/titlebar/tabReorderController.d.ts +52 -21
- package/dist/cjs/dockview/dndCapabilities.d.ts +3 -4
- package/dist/cjs/dockview/dockviewComponent.d.ts +34 -16
- package/dist/cjs/dockview/dockviewShell.d.ts +12 -0
- package/dist/cjs/dockview/moduleContracts.d.ts +2 -0
- package/dist/cjs/dockview/options.d.ts +13 -0
- package/dist/cjs/dockview/popoutWindowService.d.ts +8 -2
- package/dist/cjs/dom.d.ts +61 -1
- package/dist/cjs/gridview/branchNode.d.ts +2 -1
- package/dist/cjs/gridview/gridview.d.ts +2 -1
- package/dist/cjs/index.d.ts +5 -1
- package/dist/cjs/popoutWindow.d.ts +57 -12
- package/dist/cjs/resizable.d.ts +12 -0
- package/dist/cjs/splitview/splitview.d.ts +3 -1
- package/dist/dockview-core.js +979 -469
- package/dist/dockview-core.min.js +11 -4
- package/dist/dockview-core.min.noStyle.js +2 -2
- package/dist/dockview-core.noStyle.js +978 -468
- package/dist/package/main.cjs.js +978 -468
- package/dist/package/main.cjs.min.js +2 -2
- package/dist/package/main.esm.min.mjs +2 -2
- package/dist/package/main.esm.mjs +977 -469
- package/package.json +1 -1
package/dist/dockview-core.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-core
|
|
3
|
-
* @version 8.
|
|
3
|
+
* @version 8.4.1
|
|
4
4
|
* @link https://github.com/dockview/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -14,7 +14,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14
14
|
//#region \0cssinject:/home/runner/work/dockview/dockview/packages/dockview-core/dist/styles/dockview.css.mjs
|
|
15
15
|
if (typeof document !== "undefined") {
|
|
16
16
|
const s = document.createElement("style");
|
|
17
|
-
s.textContent = ".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 background-color: var(--dv-drag-over-background-color);\n opacity: 1;\n /* GPU optimizations */\n will-change: transform, opacity;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n contain: layout paint;\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}\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\n.dv-dnd-compass {\n z-index: 1001;\n}\n\n.dv-dnd-compass-cell {\n box-sizing: border-box;\n border-radius: 2px;\n border: 1px solid var(--dv-dnd-compass-color, #1f9cf0);\n background-color: var(--dv-dnd-compass-cell-color, rgba(31, 156, 240, 0.25));\n}\n\n.dv-dnd-compass-cell-edge {\n border-style: dashed;\n background-color: var(--dv-dnd-compass-edge-cell-color, rgba(31, 156, 240, 0.12));\n}\n\n.dv-dnd-compass-cell-active {\n background-color: var(--dv-dnd-compass-active-cell-color, rgba(31, 156, 240, 0.5));\n border-style: solid;\n}\n\n.dv-dnd-compass-edge-preview {\n z-index: 1000;\n box-sizing: border-box;\n background-color: var(--dv-drag-over-background-color);\n border: var(--dv-drag-over-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/* Applied to the ghost tab clone during drag so it shows the same border as a focused tab */\n.dv-tab-ghost-drag {\n position: relative;\n}\n.dv-tab-ghost-drag::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\n.dv-tab {\n flex-shrink: 0;\n}\n.dv-tab:focus-visible, .dv-tab:has(:focus-visible) {\n position: relative;\n}\n.dv-tab:focus-visible::after, .dv-tab:has(:focus-visible)::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@media (hover: none) {\n .dv-tab.dv-inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n }\n}\n.dv-tab .dv-default-tab {\n position: relative;\n height: 100%;\n width: 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 border: none;\n background: none;\n color: inherit;\n font: inherit;\n cursor: pointer;\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@media (pointer: coarse) {\n .dv-tab .dv-default-tab .dv-default-tab-action {\n padding: 8px;\n }\n}\n.dv-tabs-overflow-dropdown-default {\n height: 100%;\n box-sizing: border-box;\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-overflow-dropdown-default:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-container {\n display: flex;\n position: relative;\n height: 100%;\n overflow: auto;\n scrollbar-width: thin;\n /**\n * Multi-row (wrapping) tabs. Inert until the `MultiRowTabsModule` toggles\n * `.dv-tabs-container--wrap` on this element (`overflow.mode: 'wrap'`):\n * tabs wrap onto multiple rows instead of clipping into the dropdown, and\n * the strip grows to fit (the header grows via the `:has()` rule in\n * tabsContainer.scss; the free header-aware content-sizing seam then shrinks\n * the content area to match). Restricted to horizontal headers in v1.\n */\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) {\n flex-wrap: wrap;\n height: auto;\n overflow: visible;\n align-content: flex-start;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical).dv-tabs-container--wrap-capped {\n max-height: calc(var(--dv-tabs-and-actions-container-height) * var(--dv-max-tab-rows));\n overflow: hidden;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-before::after,\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-after::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-before::after {\n left: 0;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-after::after {\n right: 0;\n}\n.dv-tabs-container {\n /**\n * Multi-column (wrapping) tabs for a vertical (edge-group) header: the\n * mirror of the horizontal rule above with the axes swapped. The main axis\n * is vertical (bounded by the header height, so overflowing tabs wrap) and\n * the cross axis is horizontal (grows into additional columns). The header\n * grows in width via the `:has()` rule in tabsContainer.scss.\n *\n * Column flow direction under `writing-mode: vertical-rl` differs\n * between left and right header positions; this needs visual verification\n * in a real browser (jsdom lays out neither writing-mode nor flex-wrap).\n */\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical {\n flex-wrap: wrap;\n width: auto;\n height: 100%;\n max-height: 100%;\n overflow: visible;\n align-content: flex-start;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: var(--dv-tabs-and-actions-container-height);\n height: var(--dv-wrap-vertical-tab-height, auto);\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical.dv-tabs-container--wrap-capped {\n max-width: calc(var(--dv-tabs-and-actions-container-height) * var(--dv-max-tab-rows));\n overflow: hidden;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-before::after,\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-after::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n height: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-before::after {\n top: 0;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-after::after {\n bottom: 0;\n}\n.dv-tabs-container {\n /* GPU optimizations for smooth scrolling */\n will-change: scroll-position;\n transform: translate3d(0, 0, 0);\n /**\n * Stop scroll-chaining at the tab strip so that wheel / trackpad\n * overscroll past the strip's edges doesn't trigger the browser's\n * swipe-to-go-back-or-forward gesture (and doesn't scroll the page\n * either). `contain` keeps the native bounce visuals; `none` would\n * also disable them.\n */\n overscroll-behavior: contain;\n /**\n * Empty space between tabs (and the scrollbar lane) keeps pan-x so a\n * flick on those areas produces native momentum scroll. The tab and\n * chip elements themselves opt out (`touch-action: none`) so the\n * pointer drag source owns the gesture from pointerdown - a flick on\n * a tab or chip always becomes a drag, regardless of direction.\n */\n touch-action: pan-x;\n}\n.dv-tabs-container.dv-tabs-container-vertical {\n width: 100%;\n height: fit-content;\n max-height: 100%;\n writing-mode: vertical-rl;\n touch-action: pan-y;\n}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before, .dv-tabs-container.dv-vertical .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}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before {\n width: 1px;\n height: 100%;\n}\n.dv-tabs-container.dv-vertical .dv-tab:not(:first-child)::before {\n width: 100%;\n height: 1px;\n}\n.dv-tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.dv-tabs-container {\n /* Track */\n}\n.dv-tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-container {\n /* Handle */\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 user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\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 touch-action: none;\n}\n.dv-tab.dv-tab--shifting {\n will-change: transform, margin-left, margin-right, margin-top, margin-bottom;\n transition: transform var(--dv-transition-duration, 200ms) ease-out, margin-left var(--dv-transition-duration, 200ms) ease-out, margin-right var(--dv-transition-duration, 200ms) ease-out, margin-top var(--dv-transition-duration, 200ms) ease-out, margin-bottom var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--dragging {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--group-collapsed {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--group-expanding {\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n\n.dv-tab.dv-tab--pinned:has(.dv-tab-pin) {\n display: flex;\n align-items: center;\n}\n.dv-tab.dv-tab--pinned .dv-tab-pin {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n margin-right: 4px;\n opacity: 0.7;\n pointer-events: none;\n}\n.dv-tab.dv-tab--pinned .dv-tab-pin .dv-svg {\n width: 11px;\n height: 11px;\n}\n.dv-tab.dv-tab--pinned .dv-default-tab {\n min-width: 0;\n}\n.dv-tab.dv-tab--pinned .dv-default-tab-action {\n display: none;\n}\n\n.dv-tab.dv-tab--pinned-compact .dv-default-tab-content {\n display: none;\n}\n.dv-tab.dv-tab--pinned-compact .dv-tab-pin {\n margin-right: 0;\n}\n\n.dv-tabs-container:not(.dv-tabs-container--wrap):not(.dv-tabs-container-vertical) > .dv-tab.dv-tab--pinned-sticky {\n position: sticky;\n left: var(--dv-pinned-sticky-left, 0);\n z-index: 2;\n}\n\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row {\n flex-wrap: wrap;\n height: auto;\n min-height: var(--dv-tabs-and-actions-container-height);\n align-content: flex-start;\n}\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row .dv-pinned-row {\n flex: 0 0 100%;\n order: -1;\n}\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row .dv-tab.dv-tab--pinned {\n display: none;\n}\n\n.dv-pinned-row {\n display: flex;\n align-items: center;\n gap: 2px;\n box-sizing: border-box;\n width: 100%;\n min-height: var(--dv-tabs-and-actions-container-height);\n padding: 2px 4px;\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n\n.dv-pinned-tab {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n box-sizing: border-box;\n padding: 0.25rem 0.5rem;\n font-size: var(--dv-tab-font-size);\n cursor: pointer;\n user-select: none;\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-pinned-tab.dv-pinned-tab--active {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-pinned-tab .dv-pinned-tab-label {\n max-width: 120px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.dv-pinned-tab .dv-pinned-tab-unpin {\n flex-shrink: 0;\n opacity: 0.6;\n}\n.dv-pinned-tab .dv-pinned-tab-unpin:hover {\n opacity: 1;\n}\n.dv-pinned-tab.dv-pinned-tab--dragging {\n opacity: 0.5;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before, .dv-pinned-tab.dv-pinned-tab--drop-after {\n position: relative;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before::after, .dv-pinned-tab.dv-pinned-tab--drop-after::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before::after {\n left: 0;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-after::after {\n right: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .dv-tab {\n transition: none !important;\n }\n .dv-tab-group-chip {\n transition: none !important;\n }\n}\n.dv-tab-group-chip {\n display: inline-flex;\n align-items: center;\n align-self: center;\n padding: var(--dv-tab-group-chip-padding);\n margin: 0 8px 0 8px;\n border-radius: var(--dv-tab-group-chip-border-radius);\n font-size: var(--dv-tab-group-chip-font-size);\n cursor: pointer;\n user-select: none;\n white-space: nowrap;\n box-sizing: border-box;\n line-height: 1;\n touch-action: none;\n background-color: var(--dv-tab-group-color);\n color: white;\n}\n.dv-tab-group-chip.dv-tab-group-chip--accent-off {\n background-color: transparent;\n color: inherit;\n}\n.dv-tab-group-chip.dv-tab-group-chip--shifting {\n will-change: margin-left;\n transition: margin-left var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab-group-chip.dv-tab-group-chip--dragging {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab-group-chip .dv-tab-group-chip-label--empty {\n display: none;\n}\n.dv-tab-group-chip:has(.dv-tab-group-chip-label--empty) {\n position: relative;\n width: 12px;\n height: 12px;\n padding: 0;\n border-radius: 50%;\n}\n.dv-tab-group-chip:has(.dv-tab-group-chip-label--empty)::before {\n content: \"\";\n position: absolute;\n inset: -8px;\n}\n\n.dv-tab-group-underline {\n position: absolute;\n bottom: 0;\n opacity: var(--dv-tab-group-line-opacity);\n pointer-events: none;\n z-index: 10;\n}\n\n.dv-tab-group-chip-continuation {\n position: absolute;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n opacity: var(--dv-tab-group-line-opacity);\n pointer-events: none;\n z-index: 10;\n}\n\n.dv-groupview-header-bottom .dv-tab-group-underline {\n bottom: auto;\n top: 0;\n}\n\n.dv-tabs-container-vertical .dv-tab-group-underline {\n bottom: auto;\n left: 0;\n}\n\n.dv-tabs-container-vertical .dv-tab-group-chip {\n margin: 8px 0 8px 0;\n}\n.dv-tabs-container-vertical .dv-tab {\n padding: 0.5rem 0.25rem;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--group-collapsed {\n height: 0 !important;\n min-height: 0 !important;\n width: auto !important;\n min-width: initial !important;\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--group-expanding {\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--dragging {\n height: 0 !important;\n min-height: 0 !important;\n width: auto !important;\n min-width: initial !important;\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n\n.dv-tabs-overflow-container {\n flex-direction: column;\n height: unset;\n font-size: var(--dv-tabs-and-actions-container-font-size);\n max-height: min(50vh, 400px);\n overflow-y: auto;\n border: 1px solid var(--dv-tab-divider-color);\n background-color: var(--dv-group-view-background-color);\n /* Scrollbar styling for webkit browsers */\n}\n.dv-tabs-overflow-container::-webkit-scrollbar {\n width: 6px;\n}\n.dv-tabs-overflow-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-overflow-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n border-radius: 3px;\n}\n.dv-tabs-overflow-container {\n /* Firefox scrollbar */\n scrollbar-width: thin;\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-overflow-container .dv-tabs-overflow-group-header {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 8px;\n font-size: 0.8em;\n font-weight: 600;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n cursor: pointer;\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-header:hover {\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-color {\n display: inline-block;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n flex-shrink: 0;\n background-color: var(--dv-tab-group-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-collapsed-badge {\n font-size: 0.75em;\n font-weight: 400;\n opacity: 0.7;\n padding: 1px 4px;\n border-radius: 3px;\n background-color: var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header {\n cursor: default;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header:hover {\n background-color: transparent;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header .dv-tabs-overflow-pinned-icon {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n opacity: 0.7;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header .dv-tabs-overflow-pinned-icon .dv-svg {\n width: 11px;\n height: 11px;\n}\n.dv-tabs-overflow-container .dv-tab.dv-tab--grouped {\n padding-left: 16px;\n}\n\n/*\n * Advanced overflow popover (AdvancedOverflowModule): the same container as the\n * free list, upgraded in place with a search input, a scrollable listbox, and a\n * keyboard-highlighted active row. Styles live in core so the module ships no\n * CSS; they are inert unless the module renders this body.\n */\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced {\n min-width: 220px;\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tabs-overflow-search {\n box-sizing: border-box;\n width: 100%;\n padding: 6px 8px;\n border: none;\n border-bottom: 1px solid var(--dv-tab-divider-color);\n outline: none;\n font-size: inherit;\n font-family: inherit;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n background-color: var(--dv-group-view-background-color);\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tabs-overflow-list {\n display: flex;\n flex-direction: column;\n outline: none;\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tab.dv-tabs-overflow-option--focused {\n outline: 1px solid var(--dv-tab-divider-color);\n outline-offset: -1px;\n background-color: var(--dv-icon-hover-background-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 * Multi-row (wrapping) tabs: when the tab list wraps onto multiple rows\n * (`.dv-tabs-container--wrap`, toggled by the `MultiRowTabsModule`), the\n * header grows to fit instead of clipping. Inert otherwise: the single-row\n * fixed height above is unchanged.\n */\n}\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) {\n height: auto;\n min-height: var(--dv-tabs-and-actions-container-height);\n align-items: flex-start;\n}\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-pre-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-left-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-right-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-void-container {\n height: var(--dv-tabs-and-actions-container-height);\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 user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n touch-action: none;\n}\n.dv-tabs-and-actions-container .dv-void-container.dv-draggable {\n cursor: grab;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container {\n display: flex;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container.dv-right-actions-container-vertical {\n flex-direction: column;\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical {\n flex-direction: column;\n height: auto;\n width: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical:has(.dv-tabs-container--wrap) {\n width: auto;\n min-width: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical:has(.dv-tabs-container--wrap) > .dv-scrollable {\n align-self: stretch;\n}\n.dv-watermark {\n display: flex;\n height: 100%;\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-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-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-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-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\n.dv-keyboard-docking-hint {\n position: absolute;\n left: 50%;\n bottom: 8px;\n transform: translateX(-50%);\n z-index: 100;\n max-width: 90%;\n padding: 4px 10px;\n border-radius: 4px;\n font-size: 12px;\n line-height: 1.4;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n pointer-events: none;\n background-color: var(--dv-context-menu-background-color, var(--dv-group-view-background-color));\n color: var(--dv-activegroup-visiblepanel-tab-color);\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);\n}\n.dv-groupview {\n display: flex;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n flex-direction: column;\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-groupview.dv-groupview-header-bottom {\n flex-direction: column-reverse;\n}\n.dv-groupview.dv-groupview-header-left {\n flex-direction: row;\n}\n.dv-groupview.dv-groupview-header-right {\n flex-direction: row-reverse;\n}\n.dv-groupview.dv-groupview-edge.dv-edge-collapsed > .dv-content-container {\n display: 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-floating-overlay-host {\n position: absolute;\n pointer-events: none;\n}\n.dv-floating-overlay-host > .dv-resize-container {\n pointer-events: auto;\n}\n\n.dv-edge-peek {\n background-color: var(--dv-group-view-background-color);\n border: 1px solid var(--dv-separator-border);\n box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);\n}\n.dv-edge-peek > * {\n width: 100%;\n height: 100%;\n overflow: auto;\n}\n\n.dv-auto-edge-band {\n position: absolute;\n pointer-events: none;\n z-index: var(--dv-overlay-z-index, 999);\n background-color: var(--dv-edge-dock-indicator-color);\n box-shadow: 0 0 6px var(--dv-edge-dock-indicator-color);\n}\n\n.dv-edge-peek-header {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 0 4px 0 8px;\n box-sizing: border-box;\n background-color: var(--dv-group-view-background-color);\n border: 1px solid var(--dv-separator-border);\n border-bottom: none;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n font-size: 12px;\n}\n.dv-edge-peek-header .dv-edge-peek-pin,\n.dv-edge-peek-header .dv-edge-peek-close {\n flex: 0 0 auto;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n cursor: pointer;\n border: none;\n padding: 4px;\n color: inherit;\n background: transparent;\n outline: none;\n}\n.dv-edge-peek-header .dv-edge-peek-pin:hover,\n.dv-edge-peek-header .dv-edge-peek-close:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-edge-peek-header .dv-edge-peek-pin:focus-visible,\n.dv-edge-peek-header .dv-edge-peek-close:focus-visible {\n border-radius: 2px;\n outline: 1px solid var(--dv-tab-divider-color);\n outline-offset: -1px;\n}\n\n.dv-edge-peek-title {\n flex: 1 1 auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.dv-resize-container > .dv-grid-view {\n width: 100%;\n height: 100%;\n}\n\n.dv-resize-container-with-titlebar {\n display: flex;\n flex-direction: column;\n}\n.dv-resize-container-with-titlebar > .dv-floating-titlebar {\n flex: 0 0 auto;\n}\n.dv-resize-container-with-titlebar > .dv-grid-view {\n height: auto;\n flex: 1 1 0;\n min-height: 0;\n}\n\n.dv-floating-titlebar {\n box-sizing: border-box;\n flex-shrink: 0;\n height: var(--dv-floating-titlebar-height, 22px);\n background-color: var(--dv-floating-titlebar-background-color);\n border-bottom: var(--dv-floating-titlebar-border-bottom, none);\n user-select: none;\n touch-action: none;\n}\n.dv-floating-titlebar.dv-draggable {\n cursor: grab;\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 background-color: var(--dv-group-view-background-color);\n border: var(--dv-floating-border);\n box-shadow: var(--dv-floating-box-shadow);\n /* GPU optimizations for floating group movement */\n will-change: transform, opacity;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n}\n.dv-resize-container.dv-hidden {\n display: none;\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: var(--dv-floating-group-dragging-opacity);\n /* Enhanced GPU acceleration during drag */\n will-change: transform, opacity;\n}\n.dv-resize-container .dv-resize-handle-top,\n.dv-resize-container .dv-resize-handle-bottom,\n.dv-resize-container .dv-resize-handle-left,\n.dv-resize-container .dv-resize-handle-right,\n.dv-resize-container .dv-resize-handle-topleft,\n.dv-resize-container .dv-resize-handle-topright,\n.dv-resize-container .dv-resize-handle-bottomleft,\n.dv-resize-container .dv-resize-handle-bottomright {\n touch-action: none;\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@media (pointer: coarse) {\n .dv-resize-container .dv-resize-handle-top,\n .dv-resize-container .dv-resize-handle-bottom {\n height: 16px;\n width: calc(100% - 48px);\n left: 24px;\n }\n .dv-resize-container .dv-resize-handle-top {\n top: -10px;\n }\n .dv-resize-container .dv-resize-handle-bottom {\n bottom: -10px;\n }\n .dv-resize-container .dv-resize-handle-left,\n .dv-resize-container .dv-resize-handle-right {\n width: 16px;\n height: calc(100% - 48px);\n top: 24px;\n }\n .dv-resize-container .dv-resize-handle-left {\n left: -10px;\n }\n .dv-resize-container .dv-resize-handle-right {\n right: -10px;\n }\n .dv-resize-container .dv-resize-handle-topleft,\n .dv-resize-container .dv-resize-handle-topright,\n .dv-resize-container .dv-resize-handle-bottomleft,\n .dv-resize-container .dv-resize-handle-bottomright {\n height: 24px;\n width: 24px;\n }\n .dv-resize-container .dv-resize-handle-topleft {\n top: -12px;\n left: -12px;\n }\n .dv-resize-container .dv-resize-handle-topright {\n top: -12px;\n right: -12px;\n }\n .dv-resize-container .dv-resize-handle-bottomleft {\n bottom: -12px;\n left: -12px;\n }\n .dv-resize-container .dv-resize-handle-bottomright {\n bottom: -12px;\n right: -12px;\n }\n}\n\n.dv-smart-guides {\n pointer-events: none;\n z-index: calc(var(--dv-overlay-z-index, 999) + 100);\n}\n\n.dv-smart-guide {\n background-color: var(--dv-smart-guides-color, #1f9cf0);\n}\n\n.dv-smart-guide-preview {\n box-sizing: border-box;\n background-color: var(--dv-smart-guides-preview-color, rgba(31, 156, 240, 0.18));\n border: 1px solid var(--dv-smart-guides-color, #1f9cf0);\n}\n.dv-render-overlay {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: 1;\n width: 100%;\n height: 100%;\n contain: layout paint;\n isolation: isolate;\n /* GPU optimizations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\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 /* GPU optimizations for smooth pane animations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition: transform 0.15s 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-visible:before, .dv-pane-container .dv-pane .dv-pane-header:has(:focus-visible):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-visible:before, .dv-pane-container .dv-pane .dv-pane-body:has(:focus-visible):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-scrollable {\n position: relative;\n overflow: hidden;\n}\n.dv-scrollable .dv-scrollbar {\n position: absolute;\n border-radius: 2px;\n background-color: transparent;\n /* GPU optimizations */\n will-change: background-color, transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: 1s;\n transition-delay: 0s;\n}\n.dv-scrollable .dv-scrollbar-horizontal {\n bottom: 0px;\n left: 0px;\n height: 4px;\n}\n.dv-scrollable .dv-scrollbar-vertical {\n right: 0px;\n top: 0px;\n width: 4px;\n}\n.dv-scrollable:hover .dv-scrollbar, .dv-scrollable.dv-scrollable-resizing .dv-scrollbar, .dv-scrollable.dv-scrollable-scrolling .dv-scrollbar {\n background-color: var(--dv-scrollbar-background-color, rgba(255, 255, 255, 0.25));\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 /* GPU optimizations for smooth animations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition: transform 0.15s 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@media (pointer: coarse) {\n .dv-split-view-container .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n content: \"\";\n position: absolute;\n background: transparent;\n }\n .dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n top: 0;\n bottom: 0;\n left: -10px;\n right: -10px;\n }\n .dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n left: 0;\n right: 0;\n top: -10px;\n bottom: -10px;\n }\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-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-dark {\n color-scheme: dark;\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\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-light {\n color-scheme: light;\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 --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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 {\n color-scheme: dark;\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-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-abyss {\n color-scheme: dark;\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\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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 {\n color-scheme: dark;\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-groupview.dv-active-group > .dv-tabs-and-actions-container .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-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: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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-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-nord {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-nord .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-nord {\n color-scheme: dark;\n --dv-color-nord-polar-0: #2e3440;\n --dv-color-nord-polar-1: #3b4252;\n --dv-color-nord-polar-2: #434c5e;\n --dv-color-nord-polar-3: #4c566a;\n --dv-color-nord-frost: #88c0d0;\n --dv-color-nord-frost-2: #81a1c1;\n --dv-color-nord-snow-0: #eceff4;\n --dv-color-nord-snow-1: #d8dee9;\n --dv-group-view-background-color: var(--dv-color-nord-polar-0);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-0\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);\n --dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;\n --dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;\n --dv-separator-border: var(--dv-color-nord-polar-3);\n --dv-paneview-active-outline-color: var(--dv-color-nord-frost);\n --dv-active-sash-color: var(--dv-color-nord-frost);\n --dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);\n}\n.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-nord-frost);\n z-index: 999;\n}\n.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-nord-frost-2);\n z-index: 999;\n}\n\n.dockview-theme-nord-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-nord-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-nord-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-nord-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-nord-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-nord-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-nord-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-nord-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tabs-overflow-container,\n.dockview-theme-nord-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-nord-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-nord-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-nord-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-nord-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-nord-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced {\n color-scheme: dark;\n --dv-color-nord-polar-0: #2e3440;\n --dv-color-nord-polar-1: #3b4252;\n --dv-color-nord-polar-2: #434c5e;\n --dv-color-nord-polar-3: #4c566a;\n --dv-color-nord-frost: #88c0d0;\n --dv-color-nord-frost-2: #81a1c1;\n --dv-color-nord-snow-0: #eceff4;\n --dv-color-nord-snow-1: #d8dee9;\n --dv-group-view-background-color: var(--dv-color-nord-polar-0);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);\n --dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;\n --dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-nord-frost);\n --dv-active-sash-color: var(--dv-color-nord-frost);\n --dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);\n --dv-floating-group-border: 2px solid var(--dv-color-nord-polar-0);\n}\n\n.dockview-theme-catppuccin-mocha {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-catppuccin-mocha .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-catppuccin-mocha {\n color-scheme: dark;\n --dv-color-mocha-crust: #11111b;\n --dv-color-mocha-mantle: #181825;\n --dv-color-mocha-base: #1e1e2e;\n --dv-color-mocha-surface0: #313244;\n --dv-color-mocha-surface1: #45475a;\n --dv-color-mocha-text: #cdd6f4;\n --dv-color-mocha-subtext1: #bac2de;\n --dv-color-mocha-subtext0: #a6adc8;\n --dv-color-mocha-mauve: #cba6f7;\n --dv-color-mocha-lavender: #b4befe;\n --dv-group-view-background-color: var(--dv-color-mocha-base);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-base\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-crust\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);\n --dv-separator-border: var(--dv-color-mocha-surface1);\n --dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);\n --dv-active-sash-color: var(--dv-color-mocha-mauve);\n --dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-mocha-mauve);\n z-index: 999;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: rgba(180, 190, 254, 0.4);\n z-index: 999;\n}\n\n.dockview-theme-catppuccin-mocha-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-container,\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced {\n color-scheme: dark;\n --dv-color-mocha-crust: #11111b;\n --dv-color-mocha-mantle: #181825;\n --dv-color-mocha-base: #1e1e2e;\n --dv-color-mocha-surface0: #313244;\n --dv-color-mocha-surface1: #45475a;\n --dv-color-mocha-text: #cdd6f4;\n --dv-color-mocha-subtext1: #bac2de;\n --dv-color-mocha-subtext0: #a6adc8;\n --dv-color-mocha-mauve: #cba6f7;\n --dv-color-mocha-lavender: #b4befe;\n --dv-group-view-background-color: var(--dv-color-mocha-crust);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);\n --dv-active-sash-color: var(--dv-color-mocha-mauve);\n --dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);\n --dv-floating-group-border: 2px solid var(--dv-color-mocha-crust);\n}\n\n.dockview-theme-monokai {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-monokai .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-monokai {\n color-scheme: dark;\n --dv-color-monokai-bg: #272822;\n --dv-color-monokai-bg-light: #3e3d32;\n --dv-color-monokai-comment: #75715e;\n --dv-color-monokai-fg: #f8f8f2;\n --dv-color-monokai-green: #a6e22e;\n --dv-group-view-background-color: var(--dv-color-monokai-bg);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-monokai-bg-light\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-monokai-bg\n );\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2c25;\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-monokai-bg\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2c25;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-monokai-fg);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-monokai-comment);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(117, 113, 94, 0.5);\n --dv-separator-border: var(--dv-color-monokai-bg-light);\n --dv-paneview-active-outline-color: var(--dv-color-monokai-green);\n --dv-active-sash-color: var(--dv-color-monokai-green);\n --dv-scrollbar-background-color: rgba(117, 113, 94, 0.5);\n}\n.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-monokai-green);\n z-index: 999;\n}\n.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: rgba(166, 226, 46, 0.35);\n z-index: 999;\n}\n\n.dockview-theme-solarized-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-solarized-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-solarized-light {\n color-scheme: light;\n --dv-color-sol-base3: #fdf6e3;\n --dv-color-sol-base2: #eee8d5;\n --dv-color-sol-base1: #93a1a1;\n --dv-color-sol-base00: #657b83;\n --dv-color-sol-base01: #586e75;\n --dv-color-sol-blue: #268bd2;\n --dv-group-view-background-color: var(--dv-color-sol-base3);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base2);\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-activegroup-hiddenpanel-tab-background-color: #e8e2d0;\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: #e8e2d0;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);\n --dv-separator-border: var(--dv-color-sol-base2);\n --dv-paneview-active-outline-color: var(--dv-color-sol-blue);\n --dv-active-sash-color: var(--dv-color-sol-blue);\n --dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);\n --dv-drag-over-background-color: rgba(38, 139, 210, 0.15);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.dockview-theme-solarized-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-solarized-light-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-solarized-light-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-solarized-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-solarized-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-solarized-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-solarized-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced {\n color-scheme: light;\n --dv-color-sol-base3: #fdf6e3;\n --dv-color-sol-base2: #eee8d5;\n --dv-color-sol-base1: #93a1a1;\n --dv-color-sol-base00: #657b83;\n --dv-color-sol-base01: #586e75;\n --dv-color-sol-blue: #268bd2;\n --dv-drag-over-background-color: rgba(38, 139, 210, 0.1);\n --dv-group-view-background-color: var(--dv-color-sol-base2);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base3);\n --dv-activegroup-visiblepanel-tab-background-color: #e8e2d0;\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: #e8e2d0;\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-sol-blue);\n --dv-active-sash-color: var(--dv-color-sol-blue);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);\n --dv-floating-group-border: 2px solid rgba(238, 232, 213, 0.5);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-github-dark .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-github-dark {\n color-scheme: dark;\n --dv-color-gh-canvas-default: #0d1117;\n --dv-color-gh-canvas-subtle: #161b22;\n --dv-color-gh-canvas-inset: #010409;\n --dv-color-gh-border: #30363d;\n --dv-color-gh-border-muted: #21262d;\n --dv-color-gh-fg-default: #e6edf3;\n --dv-color-gh-fg-muted: #8b949e;\n --dv-color-gh-fg-subtle: #6e7681;\n --dv-color-gh-accent: #58a6ff;\n --dv-group-view-background-color: var(--dv-color-gh-canvas-default);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-canvas-default\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-canvas-default\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-default);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-subtle);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.5);\n --dv-separator-border: var(--dv-color-gh-border);\n --dv-paneview-active-outline-color: var(--dv-color-gh-accent);\n --dv-active-sash-color: var(--dv-color-gh-accent);\n --dv-scrollbar-background-color: rgba(48, 54, 61, 0.7);\n --dv-drag-over-background-color: rgba(88, 166, 255, 0.15);\n}\n\n.dockview-theme-github-dark-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-github-dark-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-github-dark-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-github-dark-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-overflow-container,\n.dockview-theme-github-dark-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-github-dark-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-dark-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced {\n color-scheme: dark;\n --dv-color-gh-canvas-default: #0d1117;\n --dv-color-gh-canvas-subtle: #161b22;\n --dv-color-gh-canvas-inset: #010409;\n --dv-color-gh-border: #30363d;\n --dv-color-gh-border-muted: #21262d;\n --dv-color-gh-fg-default: #e6edf3;\n --dv-color-gh-fg-muted: #8b949e;\n --dv-color-gh-fg-subtle: #6e7681;\n --dv-color-gh-accent: #58a6ff;\n --dv-drag-over-background-color: rgba(88, 166, 255, 0.1);\n --dv-group-view-background-color: var(--dv-color-gh-canvas-inset);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-border\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-border\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-default);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-subtle);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.5);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-gh-accent);\n --dv-active-sash-color: var(--dv-color-gh-accent);\n --dv-scrollbar-background-color: rgba(48, 54, 61, 0.7);\n --dv-floating-group-border: 2px solid var(--dv-color-gh-canvas-inset);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-github-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-github-light {\n color-scheme: light;\n --dv-color-gh-light-canvas-default: #ffffff;\n --dv-color-gh-light-canvas-subtle: #f6f8fa;\n --dv-color-gh-light-canvas-inset: #f0f6ff;\n --dv-color-gh-light-border: #d0d7de;\n --dv-color-gh-light-fg-default: #1f2328;\n --dv-color-gh-light-fg-muted: #656d76;\n --dv-color-gh-light-fg-subtle: #6e7781;\n --dv-color-gh-light-accent: #0969da;\n --dv-group-view-background-color: var(--dv-color-gh-light-canvas-default);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-default\n );\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-light-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-subtle\n );\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.4);\n --dv-separator-border: var(--dv-color-gh-light-border);\n --dv-paneview-active-outline-color: var(--dv-color-gh-light-accent);\n --dv-active-sash-color: var(--dv-color-gh-light-accent);\n --dv-scrollbar-background-color: rgba(208, 215, 222, 0.5);\n --dv-drag-over-background-color: rgba(9, 105, 218, 0.1);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-github-light-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-github-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-github-light-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-github-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-github-light-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-github-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-github-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-github-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-github-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-github-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced {\n color-scheme: light;\n --dv-color-gh-light-canvas-default: #ffffff;\n --dv-color-gh-light-canvas-subtle: #f6f8fa;\n --dv-color-gh-light-border: #d0d7de;\n --dv-color-gh-light-fg-default: #1f2328;\n --dv-color-gh-light-fg-muted: #656d76;\n --dv-color-gh-light-fg-subtle: #6e7781;\n --dv-color-gh-light-accent: #0969da;\n --dv-drag-over-background-color: rgba(9, 105, 218, 0.08);\n --dv-group-view-background-color: var(--dv-color-gh-light-canvas-subtle);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-border\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-border\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-default\n );\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-light-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-subtle\n );\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.4);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-gh-light-accent);\n --dv-active-sash-color: var(--dv-color-gh-light-accent);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(208, 215, 222, 0.5);\n --dv-floating-group-border: 2px solid rgba(208, 215, 222, 0.5);\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-abyss-spaced .dv-dockview {\n padding: 0;\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: var(--dv-sash-border-radius);\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-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-abyss-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tabs-overflow-container,\n.dockview-theme-abyss-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-abyss-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-abyss-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-abyss-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-abyss-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\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 border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced {\n color-scheme: dark;\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-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-group-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-light-spaced .dv-dockview {\n padding: 0;\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: var(--dv-sash-border-radius);\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-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\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 border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced {\n color-scheme: light;\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:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n --dv-floating-group-border: 2px solid rgba(255, 255, 255, 0.1);\n}\n\n.dockview-spaced {\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-tabs-overflow-container,\n.dockview-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n\n.dv-context-menu {\n min-width: 160px;\n overflow: hidden;\n background: var(--dv-context-menu-background-color, var(--dv-activegroup-hiddenpanel-tab-background-color));\n color: var(--dv-context-menu-color, var(--dv-activegroup-hiddenpanel-tab-color));\n border: 1px solid var(--dv-tab-divider-color);\n border-radius: var(--dv-border-radius);\n box-shadow: var(--dv-floating-box-shadow);\n padding: 4px 0;\n}\n\n.dv-context-menu-item {\n height: 25px;\n padding: 0 12px;\n display: flex;\n align-items: center;\n cursor: pointer;\n font-size: var(--dv-tabs-and-actions-container-font-size);\n white-space: nowrap;\n user-select: none;\n}\n.dv-context-menu-item:hover {\n background: var(--dv-icon-hover-background-color);\n}\n.dv-context-menu-item.dv-context-menu-item--disabled {\n opacity: 0.4;\n cursor: default;\n pointer-events: none;\n}\n\n.dv-context-menu-separator {\n height: 1px;\n background: var(--dv-tab-divider-color);\n margin: 4px 0;\n}\n\n.dv-context-menu-rename {\n padding: 8px 12px 4px;\n}\n\n.dv-context-menu-rename-input {\n width: 100%;\n box-sizing: border-box;\n padding: 8px 10px;\n border: 1px solid var(--dv-tab-divider-color);\n border-radius: var(--dv-border-radius);\n background: inherit;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n font-size: var(--dv-tabs-and-actions-container-font-size);\n outline: none;\n}\n.dv-context-menu-rename-input:focus {\n border-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-context-menu-rename-input::placeholder {\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n\n.dv-context-menu-color-picker {\n display: flex;\n flex-direction: row;\n gap: 6px;\n padding: 8px 12px;\n align-items: center;\n}\n\n.dv-context-menu-color-swatch {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n cursor: pointer;\n border: 2px solid transparent;\n flex-shrink: 0;\n background-color: var(--dv-tab-group-color);\n}\n.dv-context-menu-color-swatch:hover {\n opacity: 0.85;\n}\n.dv-context-menu-color-swatch.dv-context-menu-color-swatch--selected {\n outline: 2px solid var(--dv-tab-divider-color);\n outline-offset: 2px;\n}\n\n.dv-tab-group-indicator-none .dv-groupview-header-bottom .dv-tab-group-underline {\n top: auto;\n bottom: 0;\n}\n\n.dv-groupview.dv-groupview-header-bottom.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after, .dv-groupview.dv-groupview-header-bottom.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {\n top: 0px;\n bottom: auto;\n}";
|
|
17
|
+
s.textContent = ".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 background-color: var(--dv-drag-over-background-color);\n opacity: 1;\n /* GPU optimizations */\n will-change: transform, opacity;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n contain: layout paint;\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}\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\n.dv-dnd-compass {\n z-index: 1001;\n}\n\n.dv-dnd-compass-cell {\n box-sizing: border-box;\n border-radius: 2px;\n border: 1px solid var(--dv-dnd-compass-color, #1f9cf0);\n background-color: var(--dv-dnd-compass-cell-color, rgba(31, 156, 240, 0.25));\n}\n\n.dv-dnd-compass-cell-edge {\n border-style: dashed;\n background-color: var(--dv-dnd-compass-edge-cell-color, rgba(31, 156, 240, 0.12));\n}\n\n.dv-dnd-compass-cell-active {\n background-color: var(--dv-dnd-compass-active-cell-color, rgba(31, 156, 240, 0.5));\n border-style: solid;\n}\n\n.dv-dnd-compass-edge-preview {\n z-index: 1000;\n box-sizing: border-box;\n background-color: var(--dv-drag-over-background-color);\n border: var(--dv-drag-over-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/* Applied to the ghost tab clone during drag so it shows the same border as a focused tab */\n.dv-tab-ghost-drag {\n position: relative;\n}\n.dv-tab-ghost-drag::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\n.dv-tab {\n flex-shrink: 0;\n}\n.dv-tab:focus-visible, .dv-tab:has(:focus-visible) {\n position: relative;\n}\n.dv-tab:focus-visible::after, .dv-tab:has(:focus-visible)::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@media (hover: none) {\n .dv-tab.dv-inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n }\n}\n.dv-tab .dv-default-tab {\n position: relative;\n height: 100%;\n width: 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 border: none;\n background: none;\n color: inherit;\n font: inherit;\n cursor: pointer;\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@media (pointer: coarse) {\n .dv-tab .dv-default-tab .dv-default-tab-action {\n padding: 8px;\n }\n}\n.dv-tabs-overflow-dropdown-default {\n height: 100%;\n box-sizing: border-box;\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-overflow-dropdown-default:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-container {\n display: flex;\n position: relative;\n height: 100%;\n overflow: auto;\n scrollbar-width: thin;\n /**\n * Multi-row (wrapping) tabs. Inert until the `MultiRowTabsModule` toggles\n * `.dv-tabs-container--wrap` on this element (`overflow.mode: 'wrap'`):\n * tabs wrap onto multiple rows instead of clipping into the dropdown, and\n * the strip grows to fit (the header grows via the `:has()` rule in\n * tabsContainer.scss; the free header-aware content-sizing seam then shrinks\n * the content area to match). Restricted to horizontal headers in v1.\n */\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) {\n flex-wrap: wrap;\n height: auto;\n overflow: visible;\n align-content: flex-start;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical).dv-tabs-container--wrap-capped {\n max-height: calc(var(--dv-tabs-and-actions-container-height) * var(--dv-max-tab-rows));\n overflow: hidden;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-before::after,\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-after::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-before::after {\n left: 0;\n}\n.dv-tabs-container.dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab--reorder-after::after {\n right: 0;\n}\n.dv-tabs-container {\n /**\n * Multi-column (wrapping) tabs for a vertical (edge-group) header: the\n * mirror of the horizontal rule above with the axes swapped. The main axis\n * is vertical (bounded by the header height, so overflowing tabs wrap) and\n * the cross axis is horizontal (grows into additional columns). The header\n * grows in width via the `:has()` rule in tabsContainer.scss.\n *\n * Column flow direction under `writing-mode: vertical-rl` differs\n * between left and right header positions; this needs visual verification\n * in a real browser (jsdom lays out neither writing-mode nor flex-wrap).\n */\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical {\n flex-wrap: wrap;\n width: auto;\n height: 100%;\n max-height: 100%;\n overflow: visible;\n align-content: flex-start;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: var(--dv-tabs-and-actions-container-height);\n height: var(--dv-wrap-vertical-tab-height, auto);\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical.dv-tabs-container--wrap-capped {\n max-width: calc(var(--dv-tabs-and-actions-container-height) * var(--dv-max-tab-rows));\n overflow: hidden;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-before::after,\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-after::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n height: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-before::after {\n top: 0;\n}\n.dv-tabs-container.dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab--reorder-after::after {\n bottom: 0;\n}\n.dv-tabs-container {\n /* GPU optimizations for smooth scrolling */\n will-change: scroll-position;\n transform: translate3d(0, 0, 0);\n /**\n * Stop scroll-chaining at the tab strip so that wheel / trackpad\n * overscroll past the strip's edges doesn't trigger the browser's\n * swipe-to-go-back-or-forward gesture (and doesn't scroll the page\n * either). `contain` keeps the native bounce visuals; `none` would\n * also disable them.\n */\n overscroll-behavior: contain;\n /**\n * Empty space between tabs (and the scrollbar lane) keeps pan-x so a\n * flick on those areas produces native momentum scroll. The tab and\n * chip elements themselves opt out (`touch-action: none`) so the\n * pointer drag source owns the gesture from pointerdown - a flick on\n * a tab or chip always becomes a drag, regardless of direction.\n */\n touch-action: pan-x;\n}\n.dv-tabs-container.dv-tabs-container-vertical {\n width: 100%;\n height: fit-content;\n max-height: 100%;\n writing-mode: vertical-rl;\n touch-action: pan-y;\n}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before, .dv-tabs-container.dv-vertical .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}\n.dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before {\n width: 1px;\n height: 100%;\n}\n.dv-tabs-container.dv-vertical .dv-tab:not(:first-child)::before {\n width: 100%;\n height: 1px;\n}\n.dv-tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.dv-tabs-container {\n /* Track */\n}\n.dv-tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-container {\n /* Handle */\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 user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\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 touch-action: none;\n}\n.dv-tab.dv-tab--shifting {\n will-change: transform, margin-left, margin-right, margin-top, margin-bottom;\n transition: transform var(--dv-transition-duration, 200ms) ease-out, margin-left var(--dv-transition-duration, 200ms) ease-out, margin-right var(--dv-transition-duration, 200ms) ease-out, margin-top var(--dv-transition-duration, 200ms) ease-out, margin-bottom var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--dragging {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--group-collapsed {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab.dv-tab--group-expanding {\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n\n.dv-tab.dv-tab--pinned:has(.dv-tab-pin) {\n display: flex;\n align-items: center;\n}\n.dv-tab.dv-tab--pinned .dv-tab-pin {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n margin-right: 4px;\n opacity: 0.7;\n pointer-events: none;\n}\n.dv-tab.dv-tab--pinned .dv-tab-pin .dv-svg {\n width: 11px;\n height: 11px;\n}\n.dv-tab.dv-tab--pinned .dv-default-tab {\n min-width: 0;\n}\n.dv-tab.dv-tab--pinned .dv-default-tab-action {\n display: none;\n}\n\n.dv-tab.dv-tab--pinned-compact .dv-default-tab-content {\n display: none;\n}\n.dv-tab.dv-tab--pinned-compact .dv-tab-pin {\n margin-right: 0;\n}\n\n.dv-tabs-container:not(.dv-tabs-container--wrap):not(.dv-tabs-container-vertical) > .dv-tab.dv-tab--pinned-sticky {\n position: sticky;\n left: var(--dv-pinned-sticky-left, 0);\n z-index: 2;\n}\n\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row {\n flex-wrap: wrap;\n height: auto;\n min-height: var(--dv-tabs-and-actions-container-height);\n align-content: flex-start;\n}\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row .dv-pinned-row {\n flex: 0 0 100%;\n order: -1;\n}\n.dv-tabs-and-actions-container.dv-tabs-and-actions-container--pinned-row .dv-tab.dv-tab--pinned {\n display: none;\n}\n\n.dv-pinned-row {\n display: flex;\n align-items: center;\n gap: 2px;\n box-sizing: border-box;\n width: 100%;\n min-height: var(--dv-tabs-and-actions-container-height);\n padding: 2px 4px;\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n\n.dv-pinned-tab {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n box-sizing: border-box;\n padding: 0.25rem 0.5rem;\n font-size: var(--dv-tab-font-size);\n cursor: pointer;\n user-select: none;\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-pinned-tab.dv-pinned-tab--active {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-pinned-tab .dv-pinned-tab-label {\n max-width: 120px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.dv-pinned-tab .dv-pinned-tab-unpin {\n flex-shrink: 0;\n opacity: 0.6;\n}\n.dv-pinned-tab .dv-pinned-tab-unpin:hover {\n opacity: 1;\n}\n.dv-pinned-tab.dv-pinned-tab--dragging {\n opacity: 0.5;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before, .dv-pinned-tab.dv-pinned-tab--drop-after {\n position: relative;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before::after, .dv-pinned-tab.dv-pinned-tab--drop-after::after {\n content: \"\";\n position: absolute;\n top: 0;\n bottom: 0;\n width: 2px;\n z-index: 10;\n pointer-events: none;\n background-color: var(--dv-drag-over-border-color);\n}\n.dv-pinned-tab.dv-pinned-tab--drop-before::after {\n left: 0;\n}\n.dv-pinned-tab.dv-pinned-tab--drop-after::after {\n right: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .dv-tab {\n transition: none !important;\n }\n .dv-tab-group-chip {\n transition: none !important;\n }\n}\n.dv-tab-group-chip {\n display: inline-flex;\n align-items: center;\n align-self: center;\n padding: var(--dv-tab-group-chip-padding);\n margin: 0 8px 0 8px;\n border-radius: var(--dv-tab-group-chip-border-radius);\n font-size: var(--dv-tab-group-chip-font-size);\n cursor: pointer;\n user-select: none;\n white-space: nowrap;\n box-sizing: border-box;\n line-height: 1;\n touch-action: none;\n background-color: var(--dv-tab-group-color);\n color: white;\n}\n.dv-tab-group-chip.dv-tab-group-chip--accent-off {\n background-color: transparent;\n color: inherit;\n}\n.dv-tab-group-chip.dv-tab-group-chip--shifting {\n will-change: margin-left, margin-top;\n transition: margin-left var(--dv-transition-duration, 200ms) ease-out, margin-top var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab-group-chip.dv-tab-group-chip--dragging {\n width: 0 !important;\n min-width: 0 !important;\n padding: 0 !important;\n margin: 0 !important;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n transition: width var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tab-group-chip .dv-tab-group-chip-label--empty {\n display: none;\n}\n.dv-tab-group-chip:has(.dv-tab-group-chip-label--empty) {\n position: relative;\n width: 12px;\n height: 12px;\n padding: 0;\n border-radius: 50%;\n}\n.dv-tab-group-chip:has(.dv-tab-group-chip-label--empty)::before {\n content: \"\";\n position: absolute;\n inset: -8px;\n}\n\n.dv-tab-group-underline {\n position: absolute;\n bottom: 0;\n opacity: var(--dv-tab-group-line-opacity);\n pointer-events: none;\n z-index: 10;\n}\n\n.dv-tab-group-chip-continuation {\n position: absolute;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n opacity: var(--dv-tab-group-line-opacity);\n pointer-events: none;\n z-index: 10;\n}\n\n.dv-groupview-header-bottom .dv-tab-group-underline {\n bottom: auto;\n top: 0;\n}\n\n.dv-tabs-container-vertical .dv-tab-group-underline {\n bottom: auto;\n left: 0;\n}\n\n.dv-tabs-container-vertical .dv-tab-group-chip {\n margin: 8px 0 8px 0;\n}\n.dv-tabs-container-vertical .dv-tab-group-chip.dv-tab-group-chip--dragging {\n height: 0 !important;\n min-height: 0 !important;\n width: auto !important;\n min-width: initial !important;\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tabs-container-vertical .dv-tab {\n padding: 0.5rem 0.25rem;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--group-collapsed {\n height: 0 !important;\n min-height: 0 !important;\n width: auto !important;\n min-width: initial !important;\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--group-expanding {\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n.dv-tabs-container-vertical .dv-tab.dv-tab--dragging {\n height: 0 !important;\n min-height: 0 !important;\n width: auto !important;\n min-width: initial !important;\n transition: height var(--dv-transition-duration, 200ms) ease-out, padding var(--dv-transition-duration, 200ms) ease-out, margin var(--dv-transition-duration, 200ms) ease-out, opacity var(--dv-transition-duration, 200ms) ease-out;\n}\n\n.dv-tabs-overflow-container {\n flex-direction: column;\n height: unset;\n font-size: var(--dv-tabs-and-actions-container-font-size);\n max-height: min(50vh, 400px);\n overflow-y: auto;\n border: 1px solid var(--dv-tab-divider-color);\n background-color: var(--dv-group-view-background-color);\n /* Scrollbar styling for webkit browsers */\n}\n.dv-tabs-overflow-container::-webkit-scrollbar {\n width: 6px;\n}\n.dv-tabs-overflow-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-overflow-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n border-radius: 3px;\n}\n.dv-tabs-overflow-container {\n /* Firefox scrollbar */\n scrollbar-width: thin;\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-overflow-container .dv-tabs-overflow-group-header {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 8px;\n font-size: 0.8em;\n font-weight: 600;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n cursor: pointer;\n border-bottom: 1px solid var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-header:hover {\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-color {\n display: inline-block;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n flex-shrink: 0;\n background-color: var(--dv-tab-group-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-group-collapsed-badge {\n font-size: 0.75em;\n font-weight: 400;\n opacity: 0.7;\n padding: 1px 4px;\n border-radius: 3px;\n background-color: var(--dv-tab-divider-color);\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header {\n cursor: default;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header:hover {\n background-color: transparent;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header .dv-tabs-overflow-pinned-icon {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n opacity: 0.7;\n}\n.dv-tabs-overflow-container .dv-tabs-overflow-pinned-header .dv-tabs-overflow-pinned-icon .dv-svg {\n width: 11px;\n height: 11px;\n}\n.dv-tabs-overflow-container .dv-tab.dv-tab--grouped {\n padding-left: 16px;\n}\n\n/*\n * Advanced overflow popover (AdvancedOverflowModule): the same container as the\n * free list, upgraded in place with a search input, a scrollable listbox, and a\n * keyboard-highlighted active row. Styles live in core so the module ships no\n * CSS; they are inert unless the module renders this body.\n */\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced {\n min-width: 220px;\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tabs-overflow-search {\n box-sizing: border-box;\n width: 100%;\n padding: 6px 8px;\n border: none;\n border-bottom: 1px solid var(--dv-tab-divider-color);\n outline: none;\n font-size: inherit;\n font-family: inherit;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n background-color: var(--dv-group-view-background-color);\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tabs-overflow-list {\n display: flex;\n flex-direction: column;\n outline: none;\n}\n.dv-tabs-overflow-container.dv-tabs-overflow-advanced .dv-tab.dv-tabs-overflow-option--focused {\n outline: 1px solid var(--dv-tab-divider-color);\n outline-offset: -1px;\n background-color: var(--dv-icon-hover-background-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 * Multi-row (wrapping) tabs: when the tab list wraps onto multiple rows\n * (`.dv-tabs-container--wrap`, toggled by the `MultiRowTabsModule`), the\n * header grows to fit instead of clipping. Inert otherwise: the single-row\n * fixed height above is unchanged.\n */\n}\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) {\n height: auto;\n min-height: var(--dv-tabs-and-actions-container-height);\n align-items: flex-start;\n}\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-pre-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-left-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-right-actions-container,\n.dv-tabs-and-actions-container:has(.dv-tabs-container--wrap) > .dv-void-container {\n height: var(--dv-tabs-and-actions-container-height);\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 user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n touch-action: none;\n}\n.dv-tabs-and-actions-container .dv-void-container.dv-draggable {\n cursor: grab;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container {\n display: flex;\n}\n.dv-tabs-and-actions-container .dv-right-actions-container.dv-right-actions-container-vertical {\n flex-direction: column;\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical {\n flex-direction: column;\n height: auto;\n width: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical:has(.dv-tabs-container--wrap) {\n width: auto;\n min-width: var(--dv-tabs-and-actions-container-height);\n}\n.dv-tabs-and-actions-container.dv-groupview-header-vertical:has(.dv-tabs-container--wrap) > .dv-scrollable {\n align-self: stretch;\n}\n.dv-watermark {\n display: flex;\n height: 100%;\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-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-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-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-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\n.dv-keyboard-docking-hint {\n position: absolute;\n left: 50%;\n bottom: 8px;\n transform: translateX(-50%);\n z-index: 100;\n max-width: 90%;\n padding: 4px 10px;\n border-radius: 4px;\n font-size: 12px;\n line-height: 1.4;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n pointer-events: none;\n background-color: var(--dv-context-menu-background-color, var(--dv-group-view-background-color));\n color: var(--dv-activegroup-visiblepanel-tab-color);\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);\n}\n.dv-groupview {\n display: flex;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n flex-direction: column;\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-groupview.dv-groupview-header-bottom {\n flex-direction: column-reverse;\n}\n.dv-groupview.dv-groupview-header-left {\n flex-direction: row;\n}\n.dv-groupview.dv-groupview-header-right {\n flex-direction: row-reverse;\n}\n.dv-groupview.dv-groupview-edge.dv-edge-collapsed > .dv-content-container {\n display: 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-floating-overlay-host {\n position: absolute;\n pointer-events: none;\n}\n.dv-floating-overlay-host > .dv-resize-container {\n pointer-events: auto;\n}\n\n.dv-edge-peek {\n background-color: var(--dv-group-view-background-color);\n border: 1px solid var(--dv-separator-border);\n box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);\n}\n.dv-edge-peek > * {\n width: 100%;\n height: 100%;\n overflow: auto;\n}\n\n.dv-auto-edge-band {\n position: absolute;\n pointer-events: none;\n z-index: var(--dv-overlay-z-index, 999);\n background-color: var(--dv-edge-dock-indicator-color);\n box-shadow: 0 0 6px var(--dv-edge-dock-indicator-color);\n}\n\n.dv-edge-peek-header {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 0 4px 0 8px;\n box-sizing: border-box;\n background-color: var(--dv-group-view-background-color);\n border: 1px solid var(--dv-separator-border);\n border-bottom: none;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n font-size: 12px;\n}\n.dv-edge-peek-header .dv-edge-peek-pin,\n.dv-edge-peek-header .dv-edge-peek-close {\n flex: 0 0 auto;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n cursor: pointer;\n border: none;\n padding: 4px;\n color: inherit;\n background: transparent;\n outline: none;\n}\n.dv-edge-peek-header .dv-edge-peek-pin:hover,\n.dv-edge-peek-header .dv-edge-peek-close:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-edge-peek-header .dv-edge-peek-pin:focus-visible,\n.dv-edge-peek-header .dv-edge-peek-close:focus-visible {\n border-radius: 2px;\n outline: 1px solid var(--dv-tab-divider-color);\n outline-offset: -1px;\n}\n\n.dv-edge-peek-title {\n flex: 1 1 auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.dv-resize-container > .dv-grid-view {\n width: 100%;\n height: 100%;\n}\n\n.dv-resize-container-with-titlebar {\n display: flex;\n flex-direction: column;\n}\n.dv-resize-container-with-titlebar > .dv-floating-titlebar {\n flex: 0 0 auto;\n}\n.dv-resize-container-with-titlebar > .dv-grid-view {\n height: auto;\n flex: 1 1 0;\n min-height: 0;\n}\n\n.dv-floating-titlebar {\n box-sizing: border-box;\n flex-shrink: 0;\n height: var(--dv-floating-titlebar-height, 22px);\n background-color: var(--dv-floating-titlebar-background-color);\n border-bottom: var(--dv-floating-titlebar-border-bottom, none);\n user-select: none;\n touch-action: none;\n}\n.dv-floating-titlebar.dv-draggable {\n cursor: grab;\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 background-color: var(--dv-group-view-background-color);\n border: var(--dv-floating-border);\n box-shadow: var(--dv-floating-box-shadow);\n /* GPU optimizations for floating group movement */\n will-change: transform, opacity;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n}\n.dv-resize-container.dv-hidden {\n display: none;\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: var(--dv-floating-group-dragging-opacity);\n /* Enhanced GPU acceleration during drag */\n will-change: transform, opacity;\n}\n.dv-resize-container .dv-resize-handle-top,\n.dv-resize-container .dv-resize-handle-bottom,\n.dv-resize-container .dv-resize-handle-left,\n.dv-resize-container .dv-resize-handle-right,\n.dv-resize-container .dv-resize-handle-topleft,\n.dv-resize-container .dv-resize-handle-topright,\n.dv-resize-container .dv-resize-handle-bottomleft,\n.dv-resize-container .dv-resize-handle-bottomright {\n touch-action: none;\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@media (pointer: coarse) {\n .dv-resize-container .dv-resize-handle-top,\n .dv-resize-container .dv-resize-handle-bottom {\n height: 16px;\n width: calc(100% - 48px);\n left: 24px;\n }\n .dv-resize-container .dv-resize-handle-top {\n top: -10px;\n }\n .dv-resize-container .dv-resize-handle-bottom {\n bottom: -10px;\n }\n .dv-resize-container .dv-resize-handle-left,\n .dv-resize-container .dv-resize-handle-right {\n width: 16px;\n height: calc(100% - 48px);\n top: 24px;\n }\n .dv-resize-container .dv-resize-handle-left {\n left: -10px;\n }\n .dv-resize-container .dv-resize-handle-right {\n right: -10px;\n }\n .dv-resize-container .dv-resize-handle-topleft,\n .dv-resize-container .dv-resize-handle-topright,\n .dv-resize-container .dv-resize-handle-bottomleft,\n .dv-resize-container .dv-resize-handle-bottomright {\n height: 24px;\n width: 24px;\n }\n .dv-resize-container .dv-resize-handle-topleft {\n top: -12px;\n left: -12px;\n }\n .dv-resize-container .dv-resize-handle-topright {\n top: -12px;\n right: -12px;\n }\n .dv-resize-container .dv-resize-handle-bottomleft {\n bottom: -12px;\n left: -12px;\n }\n .dv-resize-container .dv-resize-handle-bottomright {\n bottom: -12px;\n right: -12px;\n }\n}\n\n.dv-smart-guides {\n pointer-events: none;\n z-index: calc(var(--dv-overlay-z-index, 999) + 100);\n}\n\n.dv-smart-guide {\n background-color: var(--dv-smart-guides-color, #1f9cf0);\n}\n\n.dv-smart-guide-preview {\n box-sizing: border-box;\n background-color: var(--dv-smart-guides-preview-color, rgba(31, 156, 240, 0.18));\n border: 1px solid var(--dv-smart-guides-color, #1f9cf0);\n}\n.dv-render-overlay {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: 1;\n width: 100%;\n height: 100%;\n contain: layout paint;\n isolation: isolate;\n /* GPU optimizations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\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 /* GPU optimizations for smooth pane animations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition: transform 0.15s 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-visible:before, .dv-pane-container .dv-pane .dv-pane-header:has(:focus-visible):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-visible:before, .dv-pane-container .dv-pane .dv-pane-body:has(:focus-visible):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-scrollable {\n position: relative;\n overflow: hidden;\n}\n.dv-scrollable .dv-scrollbar {\n position: absolute;\n border-radius: 2px;\n background-color: transparent;\n /* GPU optimizations */\n will-change: background-color, transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: 1s;\n transition-delay: 0s;\n}\n.dv-scrollable .dv-scrollbar-horizontal {\n bottom: 0px;\n left: 0px;\n height: 4px;\n}\n.dv-scrollable .dv-scrollbar-vertical {\n right: 0px;\n top: 0px;\n width: 4px;\n}\n.dv-scrollable:hover .dv-scrollbar, .dv-scrollable.dv-scrollable-resizing .dv-scrollbar, .dv-scrollable.dv-scrollable-scrolling .dv-scrollbar {\n background-color: var(--dv-scrollbar-background-color, rgba(255, 255, 255, 0.25));\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 /* GPU optimizations for smooth animations */\n will-change: transform;\n transform: translate3d(0, 0, 0);\n backface-visibility: hidden;\n transition: transform 0.15s 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@media (pointer: coarse) {\n .dv-split-view-container .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n content: \"\";\n position: absolute;\n background: transparent;\n }\n .dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n top: 0;\n bottom: 0;\n left: -10px;\n right: -10px;\n }\n .dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash:not(.dv-disabled)::before {\n left: 0;\n right: 0;\n top: -10px;\n bottom: -10px;\n }\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-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-dark {\n color-scheme: dark;\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\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-light {\n color-scheme: light;\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 --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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 {\n color-scheme: dark;\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-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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.dockview-theme-abyss {\n color-scheme: dark;\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\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\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 {\n color-scheme: dark;\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-groupview.dv-active-group > .dv-tabs-and-actions-container .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-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: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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-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-nord {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-nord .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-nord {\n color-scheme: dark;\n --dv-color-nord-polar-0: #2e3440;\n --dv-color-nord-polar-1: #3b4252;\n --dv-color-nord-polar-2: #434c5e;\n --dv-color-nord-polar-3: #4c566a;\n --dv-color-nord-frost: #88c0d0;\n --dv-color-nord-frost-2: #81a1c1;\n --dv-color-nord-snow-0: #eceff4;\n --dv-color-nord-snow-1: #d8dee9;\n --dv-group-view-background-color: var(--dv-color-nord-polar-0);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-0\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);\n --dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;\n --dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;\n --dv-separator-border: var(--dv-color-nord-polar-3);\n --dv-paneview-active-outline-color: var(--dv-color-nord-frost);\n --dv-active-sash-color: var(--dv-color-nord-frost);\n --dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);\n}\n.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-nord .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-nord-frost);\n z-index: 999;\n}\n.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-nord .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-nord-frost-2);\n z-index: 999;\n}\n\n.dockview-theme-nord-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-nord-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-nord-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-nord-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-nord-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-nord-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-nord-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-nord-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-nord-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tabs-overflow-container,\n.dockview-theme-nord-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-nord-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-nord-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-nord-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-nord-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-nord-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-nord-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-nord-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-nord-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-nord-spaced {\n color-scheme: dark;\n --dv-color-nord-polar-0: #2e3440;\n --dv-color-nord-polar-1: #3b4252;\n --dv-color-nord-polar-2: #434c5e;\n --dv-color-nord-polar-3: #4c566a;\n --dv-color-nord-frost: #88c0d0;\n --dv-color-nord-frost-2: #81a1c1;\n --dv-color-nord-snow-0: #eceff4;\n --dv-color-nord-snow-1: #d8dee9;\n --dv-group-view-background-color: var(--dv-color-nord-polar-0);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-nord-polar-2\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-nord-polar-1\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-nord-snow-0);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-nord-snow-1);\n --dv-inactivegroup-visiblepanel-tab-color: #8a9bbf;\n --dv-inactivegroup-hiddenpanel-tab-color: #5e6f8e;\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-nord-frost);\n --dv-active-sash-color: var(--dv-color-nord-frost);\n --dv-scrollbar-background-color: rgba(76, 86, 106, 0.5);\n --dv-floating-group-border: 2px solid var(--dv-color-nord-polar-0);\n}\n\n.dockview-theme-catppuccin-mocha {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-catppuccin-mocha .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-catppuccin-mocha {\n color-scheme: dark;\n --dv-color-mocha-crust: #11111b;\n --dv-color-mocha-mantle: #181825;\n --dv-color-mocha-base: #1e1e2e;\n --dv-color-mocha-surface0: #313244;\n --dv-color-mocha-surface1: #45475a;\n --dv-color-mocha-text: #cdd6f4;\n --dv-color-mocha-subtext1: #bac2de;\n --dv-color-mocha-subtext0: #a6adc8;\n --dv-color-mocha-mauve: #cba6f7;\n --dv-color-mocha-lavender: #b4befe;\n --dv-group-view-background-color: var(--dv-color-mocha-base);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-base\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-crust\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);\n --dv-separator-border: var(--dv-color-mocha-surface1);\n --dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);\n --dv-active-sash-color: var(--dv-color-mocha-mauve);\n --dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-mocha-mauve);\n z-index: 999;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-catppuccin-mocha .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: rgba(180, 190, 254, 0.4);\n z-index: 999;\n}\n\n.dockview-theme-catppuccin-mocha-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-container,\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-catppuccin-mocha-spaced {\n color-scheme: dark;\n --dv-color-mocha-crust: #11111b;\n --dv-color-mocha-mantle: #181825;\n --dv-color-mocha-base: #1e1e2e;\n --dv-color-mocha-surface0: #313244;\n --dv-color-mocha-surface1: #45475a;\n --dv-color-mocha-text: #cdd6f4;\n --dv-color-mocha-subtext1: #bac2de;\n --dv-color-mocha-subtext0: #a6adc8;\n --dv-color-mocha-mauve: #cba6f7;\n --dv-color-mocha-lavender: #b4befe;\n --dv-group-view-background-color: var(--dv-color-mocha-crust);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-mocha-surface0\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-mocha-mantle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-mocha-text);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-mocha-subtext1);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-mocha-subtext0);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(166, 173, 200, 0.5);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-mocha-mauve);\n --dv-active-sash-color: var(--dv-color-mocha-mauve);\n --dv-scrollbar-background-color: rgba(49, 50, 68, 0.8);\n --dv-floating-group-border: 2px solid var(--dv-color-mocha-crust);\n}\n\n.dockview-theme-monokai {\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-monokai .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-monokai {\n color-scheme: dark;\n --dv-color-monokai-bg: #272822;\n --dv-color-monokai-bg-light: #3e3d32;\n --dv-color-monokai-comment: #75715e;\n --dv-color-monokai-fg: #f8f8f2;\n --dv-color-monokai-green: #a6e22e;\n --dv-group-view-background-color: var(--dv-color-monokai-bg);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-monokai-bg-light\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-monokai-bg\n );\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2c25;\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-monokai-bg\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2c25;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-monokai-fg);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-monokai-comment);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(117, 113, 94, 0.5);\n --dv-separator-border: var(--dv-color-monokai-bg-light);\n --dv-paneview-active-outline-color: var(--dv-color-monokai-green);\n --dv-active-sash-color: var(--dv-color-monokai-green);\n --dv-scrollbar-background-color: rgba(117, 113, 94, 0.5);\n}\n.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-monokai .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: var(--dv-color-monokai-green);\n z-index: 999;\n}\n.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-monokai .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .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: 2px;\n background-color: rgba(166, 226, 46, 0.35);\n z-index: 999;\n}\n\n.dockview-theme-solarized-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-solarized-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-solarized-light {\n color-scheme: light;\n --dv-color-sol-base3: #fdf6e3;\n --dv-color-sol-base2: #eee8d5;\n --dv-color-sol-base1: #93a1a1;\n --dv-color-sol-base00: #657b83;\n --dv-color-sol-base01: #586e75;\n --dv-color-sol-blue: #268bd2;\n --dv-group-view-background-color: var(--dv-color-sol-base3);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base2);\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-activegroup-hiddenpanel-tab-background-color: #e8e2d0;\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: #e8e2d0;\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);\n --dv-separator-border: var(--dv-color-sol-base2);\n --dv-paneview-active-outline-color: var(--dv-color-sol-blue);\n --dv-active-sash-color: var(--dv-color-sol-blue);\n --dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);\n --dv-drag-over-background-color: rgba(38, 139, 210, 0.15);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.dockview-theme-solarized-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-solarized-light-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-solarized-light-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-solarized-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-solarized-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-solarized-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-solarized-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-solarized-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-solarized-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-solarized-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-solarized-light-spaced {\n color-scheme: light;\n --dv-color-sol-base3: #fdf6e3;\n --dv-color-sol-base2: #eee8d5;\n --dv-color-sol-base1: #93a1a1;\n --dv-color-sol-base00: #657b83;\n --dv-color-sol-base01: #586e75;\n --dv-color-sol-blue: #268bd2;\n --dv-drag-over-background-color: rgba(38, 139, 210, 0.1);\n --dv-group-view-background-color: var(--dv-color-sol-base2);\n --dv-tabs-and-actions-container-background-color: var(--dv-color-sol-base3);\n --dv-activegroup-visiblepanel-tab-background-color: #e8e2d0;\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: #e8e2d0;\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-sol-base3\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-sol-base01);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-sol-base00);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-sol-base1);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(147, 161, 161, 0.6);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-sol-blue);\n --dv-active-sash-color: var(--dv-color-sol-blue);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(101, 123, 131, 0.25);\n --dv-floating-group-border: 2px solid rgba(238, 232, 213, 0.5);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-github-dark .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-github-dark {\n color-scheme: dark;\n --dv-color-gh-canvas-default: #0d1117;\n --dv-color-gh-canvas-subtle: #161b22;\n --dv-color-gh-canvas-inset: #010409;\n --dv-color-gh-border: #30363d;\n --dv-color-gh-border-muted: #21262d;\n --dv-color-gh-fg-default: #e6edf3;\n --dv-color-gh-fg-muted: #8b949e;\n --dv-color-gh-fg-subtle: #6e7681;\n --dv-color-gh-accent: #58a6ff;\n --dv-group-view-background-color: var(--dv-color-gh-canvas-default);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-canvas-default\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-canvas-default\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-default);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-subtle);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.5);\n --dv-separator-border: var(--dv-color-gh-border);\n --dv-paneview-active-outline-color: var(--dv-color-gh-accent);\n --dv-active-sash-color: var(--dv-color-gh-accent);\n --dv-scrollbar-background-color: rgba(48, 54, 61, 0.7);\n --dv-drag-over-background-color: rgba(88, 166, 255, 0.15);\n}\n\n.dockview-theme-github-dark-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-github-dark-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-github-dark-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-github-dark-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-github-dark-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-overflow-container,\n.dockview-theme-github-dark-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-github-dark-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-github-dark-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-dark-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-github-dark-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-github-dark-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-dark-spaced {\n color-scheme: dark;\n --dv-color-gh-canvas-default: #0d1117;\n --dv-color-gh-canvas-subtle: #161b22;\n --dv-color-gh-canvas-inset: #010409;\n --dv-color-gh-border: #30363d;\n --dv-color-gh-border-muted: #21262d;\n --dv-color-gh-fg-default: #e6edf3;\n --dv-color-gh-fg-muted: #8b949e;\n --dv-color-gh-fg-subtle: #6e7681;\n --dv-color-gh-accent: #58a6ff;\n --dv-drag-over-background-color: rgba(88, 166, 255, 0.1);\n --dv-group-view-background-color: var(--dv-color-gh-canvas-inset);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-border\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-border\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-default);\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(--dv-color-gh-fg-subtle);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.5);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-gh-accent);\n --dv-active-sash-color: var(--dv-color-gh-accent);\n --dv-scrollbar-background-color: rgba(48, 54, 61, 0.7);\n --dv-floating-group-border: 2px solid var(--dv-color-gh-canvas-inset);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n}\n.dockview-theme-github-light .dv-drop-target-container .dv-drop-target-anchor.dv-drop-target-anchor-container-changed {\n opacity: 0;\n transition: none;\n}\n.dockview-theme-github-light {\n color-scheme: light;\n --dv-color-gh-light-canvas-default: #ffffff;\n --dv-color-gh-light-canvas-subtle: #f6f8fa;\n --dv-color-gh-light-canvas-inset: #f0f6ff;\n --dv-color-gh-light-border: #d0d7de;\n --dv-color-gh-light-fg-default: #1f2328;\n --dv-color-gh-light-fg-muted: #656d76;\n --dv-color-gh-light-fg-subtle: #6e7781;\n --dv-color-gh-light-accent: #0969da;\n --dv-group-view-background-color: var(--dv-color-gh-light-canvas-default);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-subtle\n );\n --dv-activegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-default\n );\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-light-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-subtle\n );\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.4);\n --dv-separator-border: var(--dv-color-gh-light-border);\n --dv-paneview-active-outline-color: var(--dv-color-gh-light-accent);\n --dv-active-sash-color: var(--dv-color-gh-light-accent);\n --dv-scrollbar-background-color: rgba(208, 215, 222, 0.5);\n --dv-drag-over-background-color: rgba(9, 105, 218, 0.1);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.dockview-theme-github-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-github-light-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-theme-github-light-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-github-light-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-theme-github-light-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-theme-github-light-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-github-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-github-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-github-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-github-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-github-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-github-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-github-light-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-github-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-github-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-github-light-spaced {\n color-scheme: light;\n --dv-color-gh-light-canvas-default: #ffffff;\n --dv-color-gh-light-canvas-subtle: #f6f8fa;\n --dv-color-gh-light-border: #d0d7de;\n --dv-color-gh-light-fg-default: #1f2328;\n --dv-color-gh-light-fg-muted: #656d76;\n --dv-color-gh-light-fg-subtle: #6e7781;\n --dv-color-gh-light-accent: #0969da;\n --dv-drag-over-background-color: rgba(9, 105, 218, 0.08);\n --dv-group-view-background-color: var(--dv-color-gh-light-canvas-subtle);\n --dv-tabs-and-actions-container-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-border\n );\n --dv-activegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-inactivegroup-visiblepanel-tab-background-color: var(\n --dv-color-gh-light-border\n );\n --dv-inactivegroup-hiddenpanel-tab-background-color: var(\n --dv-color-gh-light-canvas-default\n );\n --dv-activegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-default\n );\n --dv-activegroup-hiddenpanel-tab-color: var(--dv-color-gh-light-fg-muted);\n --dv-inactivegroup-visiblepanel-tab-color: var(\n --dv-color-gh-light-fg-subtle\n );\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(110, 118, 129, 0.4);\n --dv-separator-border: transparent;\n --dv-paneview-active-outline-color: var(--dv-color-gh-light-accent);\n --dv-active-sash-color: var(--dv-color-gh-light-accent);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(208, 215, 222, 0.5);\n --dv-floating-group-border: 2px solid rgba(208, 215, 222, 0.5);\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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-abyss-spaced .dv-dockview {\n padding: 0;\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: var(--dv-sash-border-radius);\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-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-abyss-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-abyss-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tabs-overflow-container,\n.dockview-theme-abyss-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-abyss-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-abyss-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-abyss-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-abyss-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\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 border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-abyss-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-abyss-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-abyss-spaced {\n color-scheme: dark;\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-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-group-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-edge-dock-indicator-color: rgba(56, 139, 253, 0.9);\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow:\n 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);\n --dv-floating-border: 1px solid rgba(255, 255, 255, 0.1);\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-spacing-padding: 0px;\n --dv-tab-border-radius: 0px;\n --dv-sash-border-radius: 0px;\n --dv-dropdown-border-radius: 0px;\n --dv-tab-close-icon-size: inherit;\n --dv-floating-group-border: none;\n --dv-drag-over-border: none;\n --dv-floating-group-dragging-opacity: 0.5;\n --dv-floating-titlebar-height: 22px;\n --dv-floating-titlebar-background-color: var(\n --dv-tabs-and-actions-container-background-color\n );\n --dv-floating-titlebar-border-bottom: var(--dv-floating-border);\n --dv-tab-group-color-grey: #5f6368;\n --dv-tab-group-color-blue: #1a73e8;\n --dv-tab-group-color-red: #d93025;\n --dv-tab-group-color-yellow: #f9ab00;\n --dv-tab-group-color-green: #188038;\n --dv-tab-group-color-pink: #d01884;\n --dv-tab-group-color-purple: #a142f4;\n --dv-tab-group-color-cyan: #007b83;\n --dv-tab-group-color-orange: #e8710a;\n --dv-tab-group-chip-padding: 4px 8px;\n --dv-tab-group-chip-border-radius: 6px;\n --dv-tab-group-chip-font-size: 11px;\n --dv-tab-group-line-height: 2px;\n --dv-tab-group-line-opacity: 0.6;\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-theme-light-spaced .dv-dockview {\n padding: 0;\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: var(--dv-sash-border-radius);\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-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-theme-light-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-theme-light-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-tabs-overflow-container,\n.dockview-theme-light-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-theme-light-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-theme-light-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-theme-light-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-theme-light-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-theme-light-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\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 border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-theme-light-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-theme-light-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-theme-light-spaced {\n color-scheme: light;\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:\n 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);\n --dv-floating-border: 1px solid rgba(0, 0, 0, 0.1);\n --dv-scrollbar-background-color: rgba(0, 0, 0, 0.25);\n --dv-floating-group-border: 2px solid rgba(255, 255, 255, 0.1);\n}\n\n.dockview-spaced {\n --dv-spacing-padding: 10px;\n --dv-tab-font-size: 12px;\n --dv-border-radius: 12px;\n --dv-tab-margin-block: 0.5rem;\n --dv-tab-margin-inline: 0.25rem;\n --dv-tab-margin: var(--dv-tab-margin-block) var(--dv-tab-margin-inline);\n --dv-tabs-and-actions-container-height: 44px;\n --dv-tab-border-radius: 8px;\n --dv-sash-border-radius: 4px;\n --dv-dropdown-border-radius: 8px;\n --dv-tab-close-icon-size: 8px;\n --dv-floating-group-border: 2px solid var(--dv-group-view-background-color);\n --dv-floating-titlebar-background-color: var(\n --dv-group-view-background-color\n );\n --dv-floating-titlebar-border-bottom: none;\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n background-color: var(--dv-group-view-background-color);\n}\n.dockview-spaced .dv-dockview {\n padding: 0;\n}\n.dockview-spaced .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-spaced .dv-sash {\n border-radius: var(--dv-sash-border-radius);\n}\n.dockview-spaced .dv-drop-target-anchor {\n border-radius: calc(var(--dv-border-radius) / 4);\n}\n.dockview-spaced .dv-drop-target-anchor.dv-drop-target-content {\n border-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-resize-container {\n border-radius: var(--dv-border-radius) !important;\n border: none;\n}\n.dockview-spaced .dv-resize-container .dv-groupview {\n border: var(--dv-floating-group-border);\n}\n.dockview-spaced .dv-resize-container > .dv-grid-view {\n box-sizing: border-box;\n padding: var(--dv-spacing-padding);\n}\n.dockview-spaced .dv-resize-container-with-titlebar > .dv-grid-view {\n padding-top: 0;\n}\n.dockview-spaced .dv-resize-container-with-titlebar > .dv-floating-titlebar {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-tabs-overflow-container,\n.dockview-spaced .dv-tabs-overflow-dropdown-default {\n border-radius: var(--dv-dropdown-border-radius);\n height: unset !important;\n}\n.dockview-spaced .dv-render-overlay {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-tab {\n border-radius: var(--dv-tab-border-radius);\n}\n.dockview-spaced .dv-tab .dv-svg {\n height: var(--dv-tab-close-icon-size);\n width: var(--dv-tab-close-icon-size);\n}\n.dockview-spaced .dv-tabs-container--wrap:not(.dv-tabs-container-vertical) .dv-tab {\n height: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-spaced .dv-tabs-container-vertical .dv-tab {\n margin: var(--dv-tab-margin-inline) var(--dv-tab-margin-block);\n}\n.dockview-spaced .dv-tabs-container--wrap.dv-tabs-container-vertical .dv-tab {\n width: calc(var(--dv-tabs-and-actions-container-height) - 2 * var(--dv-tab-margin-block));\n}\n.dockview-spaced .dv-groupview {\n border-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview .dv-tabs-and-actions-container {\n padding: 0px calc(var(--dv-border-radius) / 2);\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview .dv-tabs-and-actions-container.dv-groupview-header-vertical {\n padding: calc(var(--dv-border-radius) / 2) 0;\n}\n.dockview-spaced .dv-groupview .dv-content-container {\n background-color: var(--dv-tabs-and-actions-container-background-color);\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-content-container {\n border-radius: 0;\n}\n.dockview-spaced .dv-groupview.dv-edge-tool-window .dv-tabs-and-actions-container {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek-clip {\n border-bottom-left-radius: var(--dv-border-radius);\n border-bottom-right-radius: var(--dv-border-radius);\n}\n.dockview-spaced .dv-edge-peek-header {\n border-top-left-radius: var(--dv-border-radius);\n border-top-right-radius: var(--dv-border-radius);\n}\n\n.dv-context-menu {\n min-width: 160px;\n overflow: hidden;\n background: var(--dv-context-menu-background-color, var(--dv-activegroup-hiddenpanel-tab-background-color));\n color: var(--dv-context-menu-color, var(--dv-activegroup-hiddenpanel-tab-color));\n border: 1px solid var(--dv-tab-divider-color);\n border-radius: var(--dv-border-radius);\n box-shadow: var(--dv-floating-box-shadow);\n padding: 4px 0;\n}\n\n.dv-context-menu-item {\n height: 25px;\n padding: 0 12px;\n display: flex;\n align-items: center;\n cursor: pointer;\n font-size: var(--dv-tabs-and-actions-container-font-size);\n white-space: nowrap;\n user-select: none;\n}\n.dv-context-menu-item:hover {\n background: var(--dv-icon-hover-background-color);\n}\n.dv-context-menu-item.dv-context-menu-item--disabled {\n opacity: 0.4;\n cursor: default;\n pointer-events: none;\n}\n\n.dv-context-menu-separator {\n height: 1px;\n background: var(--dv-tab-divider-color);\n margin: 4px 0;\n}\n\n.dv-context-menu-rename {\n padding: 8px 12px 4px;\n}\n\n.dv-context-menu-rename-input {\n width: 100%;\n box-sizing: border-box;\n padding: 8px 10px;\n border: 1px solid var(--dv-tab-divider-color);\n border-radius: var(--dv-border-radius);\n background: inherit;\n color: var(--dv-activegroup-visiblepanel-tab-color);\n font-size: var(--dv-tabs-and-actions-container-font-size);\n outline: none;\n}\n.dv-context-menu-rename-input:focus {\n border-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-context-menu-rename-input::placeholder {\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n\n.dv-context-menu-color-picker {\n display: flex;\n flex-direction: row;\n gap: 6px;\n padding: 8px 12px;\n align-items: center;\n}\n\n.dv-context-menu-color-swatch {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n cursor: pointer;\n border: 2px solid transparent;\n flex-shrink: 0;\n background-color: var(--dv-tab-group-color);\n}\n.dv-context-menu-color-swatch:hover {\n opacity: 0.85;\n}\n.dv-context-menu-color-swatch.dv-context-menu-color-swatch--selected {\n outline: 2px solid var(--dv-tab-divider-color);\n outline-offset: 2px;\n}\n\n.dv-tab-group-indicator-none .dv-groupview-header-bottom .dv-tab-group-underline {\n top: auto;\n bottom: 0;\n}\n\n.dv-groupview.dv-groupview-header-bottom.dv-active-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after, .dv-groupview.dv-groupview-header-bottom.dv-inactive-group > .dv-tabs-and-actions-container .dv-tabs-container > .dv-tab.dv-active-tab::after {\n top: 0px;\n bottom: auto;\n}";
|
|
18
18
|
document.head.appendChild(s);
|
|
19
19
|
}
|
|
20
20
|
|
|
@@ -346,21 +346,29 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
346
346
|
}
|
|
347
347
|
};
|
|
348
348
|
function watchElementResize(element, cb) {
|
|
349
|
+
const pendingFrames = /* @__PURE__ */ new Set();
|
|
349
350
|
const observer = new ResizeObserver((entires) => {
|
|
350
351
|
/**
|
|
351
352
|
* Fast browser window resize produces Error: ResizeObserver loop limit exceeded.
|
|
352
353
|
* The error isn't visible in browser console, doesn't affect functionality, but degrades performance.
|
|
353
354
|
* See https://stackoverflow.com/questions/49384120/resizeobserver-loop-limit-exceeded/58701523#58701523
|
|
354
355
|
*/
|
|
355
|
-
|
|
356
|
+
let ran = false;
|
|
357
|
+
let frame;
|
|
358
|
+
frame = requestAnimationFrame(() => {
|
|
359
|
+
ran = true;
|
|
360
|
+
if (frame !== void 0) pendingFrames.delete(frame);
|
|
356
361
|
const firstEntry = entires[0];
|
|
357
362
|
cb(firstEntry);
|
|
358
363
|
});
|
|
364
|
+
if (!ran) pendingFrames.add(frame);
|
|
359
365
|
});
|
|
360
366
|
observer.observe(element);
|
|
361
367
|
return { dispose: () => {
|
|
362
368
|
observer.unobserve(element);
|
|
363
369
|
observer.disconnect();
|
|
370
|
+
for (const frame of pendingFrames) cancelAnimationFrame(frame);
|
|
371
|
+
pendingFrames.clear();
|
|
364
372
|
} };
|
|
365
373
|
}
|
|
366
374
|
const removeClasses = (element, ...classes) => {
|
|
@@ -395,7 +403,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
395
403
|
this._onDidBlur = new Emitter();
|
|
396
404
|
this.onDidBlur = this._onDidBlur.event;
|
|
397
405
|
this.addDisposables(this._onDidFocus, this._onDidBlur);
|
|
398
|
-
let hasFocus = isAncestor(
|
|
406
|
+
let hasFocus = isAncestor(getActiveElement(element), element);
|
|
399
407
|
let loosingFocus = false;
|
|
400
408
|
const onFocus = () => {
|
|
401
409
|
loosingFocus = false;
|
|
@@ -417,7 +425,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
417
425
|
}
|
|
418
426
|
};
|
|
419
427
|
this._refreshStateHandler = () => {
|
|
420
|
-
if (isAncestor(
|
|
428
|
+
if (isAncestor(getActiveElement(element), element) !== hasFocus) if (hasFocus) onBlur();
|
|
421
429
|
else onFocus();
|
|
422
430
|
};
|
|
423
431
|
this.addDisposables(addDisposableListener(element, "focus", onFocus, true));
|
|
@@ -434,6 +442,49 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
434
442
|
function quasiDefaultPrevented(event) {
|
|
435
443
|
return event[QUASI_PREVENT_DEFAULT_KEY];
|
|
436
444
|
}
|
|
445
|
+
/** Whether the event originated within any of `elements`. Checks the
|
|
446
|
+
* composed path, so it also holds for elements inside a shadow root, which a
|
|
447
|
+
* window or document listener sees retargeted to the shadow host. */
|
|
448
|
+
function isEventWithin(event, elements) {
|
|
449
|
+
var _event$composedPath, _event$composedPath2;
|
|
450
|
+
const path = (_event$composedPath = (_event$composedPath2 = event.composedPath) === null || _event$composedPath2 === void 0 ? void 0 : _event$composedPath2.call(event)) !== null && _event$composedPath !== void 0 ? _event$composedPath : [];
|
|
451
|
+
if (path.length > 0) return elements.some((el) => path.includes(el));
|
|
452
|
+
const target = event.target;
|
|
453
|
+
return target instanceof Node && elements.some((el) => el.contains(target));
|
|
454
|
+
}
|
|
455
|
+
/** Every shadow root between `element` and its document, innermost first. An
|
|
456
|
+
* element in a component nested inside another component sits in more than
|
|
457
|
+
* one, and an event is cut at each boundary. */
|
|
458
|
+
function shadowRootsOf(node) {
|
|
459
|
+
const roots = [];
|
|
460
|
+
let root = node.getRootNode();
|
|
461
|
+
while (isShadowRoot(root)) {
|
|
462
|
+
roots.push(root);
|
|
463
|
+
root = root.host.getRootNode();
|
|
464
|
+
}
|
|
465
|
+
return roots;
|
|
466
|
+
}
|
|
467
|
+
/**
|
|
468
|
+
* `element` as a listener rooted in `scope`'s tree sees it. A node in a shadow
|
|
469
|
+
* root *below* that tree is retargeted to its host there, repeatedly for
|
|
470
|
+
* nested roots; a node already in the same tree is returned unchanged. Omit
|
|
471
|
+
* `scope` (or pass a node in the document) for the document-level view, which
|
|
472
|
+
* is what a window listener gets.
|
|
473
|
+
*
|
|
474
|
+
* The scope matters: a layer living inside a shadow root must be able to tell
|
|
475
|
+
* its own elements apart, and retargeting everything out to the document would
|
|
476
|
+
* collapse them all onto the one host.
|
|
477
|
+
*/
|
|
478
|
+
function retargetInto(element, scope) {
|
|
479
|
+
const scopeRoot = scope === null || scope === void 0 ? void 0 : scope.getRootNode();
|
|
480
|
+
let current = element;
|
|
481
|
+
let root = current.getRootNode();
|
|
482
|
+
while (root !== scopeRoot && isShadowRoot(root)) {
|
|
483
|
+
current = root.host;
|
|
484
|
+
root = current.getRootNode();
|
|
485
|
+
}
|
|
486
|
+
return current;
|
|
487
|
+
}
|
|
437
488
|
function addStyles(document, styleSheetList, options = {}) {
|
|
438
489
|
const styleSheets = Array.from(styleSheetList);
|
|
439
490
|
const { nonce } = options;
|
|
@@ -444,6 +495,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
444
495
|
link.href = styleSheet.href;
|
|
445
496
|
link.type = styleSheet.type;
|
|
446
497
|
link.rel = "stylesheet";
|
|
498
|
+
if (resolvedNonce) link.setAttribute("nonce", resolvedNonce);
|
|
447
499
|
document.head.appendChild(link);
|
|
448
500
|
continue;
|
|
449
501
|
}
|
|
@@ -483,6 +535,23 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
483
535
|
else currentElement = currentElement.parentNode;
|
|
484
536
|
return false;
|
|
485
537
|
}
|
|
538
|
+
/** Duck-typed so it holds for a shadow root from another window's realm. */
|
|
539
|
+
function isShadowRoot(node) {
|
|
540
|
+
return !!node && node.nodeType === Node.DOCUMENT_FRAGMENT_NODE && "host" in node && !!node.host;
|
|
541
|
+
}
|
|
542
|
+
/**
|
|
543
|
+
* The document or shadow root to hit-test (`elementFromPoint` /
|
|
544
|
+
* `elementsFromPoint`) against for `node`. Hit-testing on the document stops
|
|
545
|
+
* at a shadow host, so when dockview is mounted in a shadow root it has to go
|
|
546
|
+
* through that root to reach its own elements. Falls back to the owning
|
|
547
|
+
* document (which may be a popout's) for a detached node.
|
|
548
|
+
*/
|
|
549
|
+
function getHitTestRoot(node) {
|
|
550
|
+
var _node$ownerDocument;
|
|
551
|
+
const root = node.getRootNode();
|
|
552
|
+
if (root !== node && typeof root.elementsFromPoint === "function") return root;
|
|
553
|
+
return (_node$ownerDocument = node.ownerDocument) !== null && _node$ownerDocument !== void 0 ? _node$ownerDocument : document;
|
|
554
|
+
}
|
|
486
555
|
function addTestId(element, id) {
|
|
487
556
|
element.dataset.testid = id;
|
|
488
557
|
}
|
|
@@ -517,6 +586,38 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
517
586
|
iframes.splice(0, iframes.length);
|
|
518
587
|
} };
|
|
519
588
|
}
|
|
589
|
+
/**
|
|
590
|
+
* Suppress text selection for the duration of a pointer drag.
|
|
591
|
+
*
|
|
592
|
+
* A pointer drag is just a held button as far as the browser is concerned, so
|
|
593
|
+
* it selects text under the cursor as it travels. HTML5 drag-and-drop is
|
|
594
|
+
* exempt - the browser owns the gesture - which is why this is only needed on
|
|
595
|
+
* the pointer backend.
|
|
596
|
+
*
|
|
597
|
+
* `user-select: none` alone is not enough on WebKit: it starts the selection
|
|
598
|
+
* gesture from a mousedown on a `user-select: none` element unless that
|
|
599
|
+
* element is also natively draggable, then extends it into whatever the
|
|
600
|
+
* pointer crosses. Cancelling `selectstart` refuses that first extension,
|
|
601
|
+
* which ends the gesture for the rest of the drag.
|
|
602
|
+
*
|
|
603
|
+
* An existing selection is left alone: a mousedown on a `user-select: none`
|
|
604
|
+
* element does not clear one natively, and a pointer drag should not either.
|
|
605
|
+
*/
|
|
606
|
+
function disableTextSelection(rootNode = document) {
|
|
607
|
+
const doc = rootNode instanceof Document ? rootNode : rootNode.ownerDocument;
|
|
608
|
+
const root = doc === null || doc === void 0 ? void 0 : doc.documentElement;
|
|
609
|
+
if (!doc || !root) return { release: () => void 0 };
|
|
610
|
+
const properties = ["user-select", "-webkit-user-select"];
|
|
611
|
+
const previous = properties.map((name) => [name, root.style.getPropertyValue(name)]);
|
|
612
|
+
for (const name of properties) root.style.setProperty(name, "none");
|
|
613
|
+
const onSelectStart = (event) => event.preventDefault();
|
|
614
|
+
doc.addEventListener("selectstart", onSelectStart);
|
|
615
|
+
return { release: () => {
|
|
616
|
+
doc.removeEventListener("selectstart", onSelectStart);
|
|
617
|
+
for (const [name, value] of previous) if (value) root.style.setProperty(name, value);
|
|
618
|
+
else root.style.removeProperty(name);
|
|
619
|
+
} };
|
|
620
|
+
}
|
|
520
621
|
function getDockviewTheme(element) {
|
|
521
622
|
function toClassList(element) {
|
|
522
623
|
const list = [];
|
|
@@ -528,6 +629,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
528
629
|
while (parent !== null) {
|
|
529
630
|
theme = toClassList(parent).find((cls) => cls.startsWith("dockview-theme-"));
|
|
530
631
|
if (typeof theme === "string") break;
|
|
632
|
+
if (parent.parentElement === null) {
|
|
633
|
+
const root = parent.getRootNode();
|
|
634
|
+
parent = isShadowRoot(root) ? root.host : null;
|
|
635
|
+
continue;
|
|
636
|
+
}
|
|
531
637
|
parent = parent.parentElement;
|
|
532
638
|
}
|
|
533
639
|
return theme;
|
|
@@ -639,6 +745,285 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
639
745
|
}
|
|
640
746
|
return "";
|
|
641
747
|
}
|
|
748
|
+
/** The focused element as seen from `node`'s own tree. Unlike
|
|
749
|
+
* `document.activeElement`, which is the shadow host when focus is inside a
|
|
750
|
+
* shadow root, this reaches into the root `node` lives in (and a popout's
|
|
751
|
+
* own document), while a web component nested inside that tree still
|
|
752
|
+
* resolves to its host there. */
|
|
753
|
+
function getActiveElement(node) {
|
|
754
|
+
var _root$activeElement;
|
|
755
|
+
const root = node.getRootNode();
|
|
756
|
+
const doc = root.nodeType === Node.DOCUMENT_NODE ? root : node.ownerDocument;
|
|
757
|
+
if (doc && typeof doc.hasFocus === "function" && !doc.hasFocus()) return null;
|
|
758
|
+
return (_root$activeElement = root.activeElement) !== null && _root$activeElement !== void 0 ? _root$activeElement : null;
|
|
759
|
+
}
|
|
760
|
+
/** Where to append a floating element (e.g. a drag ghost) for `node`: its
|
|
761
|
+
* shadow root when it lives in one, so styles scoped there still apply,
|
|
762
|
+
* otherwise the body of its own document (which may be a popout's). */
|
|
763
|
+
function getOverlayParent(node) {
|
|
764
|
+
var _node$ownerDocument2;
|
|
765
|
+
const root = node.getRootNode();
|
|
766
|
+
if (isShadowRoot(root)) return root;
|
|
767
|
+
return ((_node$ownerDocument2 = node.ownerDocument) !== null && _node$ownerDocument2 !== void 0 ? _node$ownerDocument2 : document).body;
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
//#endregion
|
|
771
|
+
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/asyncToGenerator.js
|
|
772
|
+
function asyncGeneratorStep(n, t, e, r, o, a, c) {
|
|
773
|
+
try {
|
|
774
|
+
var i = n[a](c), u = i.value;
|
|
775
|
+
} catch (n) {
|
|
776
|
+
e(n);
|
|
777
|
+
return;
|
|
778
|
+
}
|
|
779
|
+
i.done ? t(u) : Promise.resolve(u).then(r, o);
|
|
780
|
+
}
|
|
781
|
+
function _asyncToGenerator(n) {
|
|
782
|
+
return function() {
|
|
783
|
+
var t = this, e = arguments;
|
|
784
|
+
return new Promise(function(r, o) {
|
|
785
|
+
var a = n.apply(t, e);
|
|
786
|
+
function _next(n) {
|
|
787
|
+
asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
|
|
788
|
+
}
|
|
789
|
+
function _throw(n) {
|
|
790
|
+
asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
|
|
791
|
+
}
|
|
792
|
+
_next(void 0);
|
|
793
|
+
});
|
|
794
|
+
};
|
|
795
|
+
}
|
|
796
|
+
|
|
797
|
+
//#endregion
|
|
798
|
+
//#region src/popoutWindow.ts
|
|
799
|
+
/**
|
|
800
|
+
* Throwing form of {@link getPopoutUrlError}, for callers with no way to
|
|
801
|
+
* recover from a refused URL.
|
|
802
|
+
*/
|
|
803
|
+
function assertSameOriginPopoutUrl(url) {
|
|
804
|
+
const error = getPopoutUrlError(url);
|
|
805
|
+
if (error) throw error;
|
|
806
|
+
}
|
|
807
|
+
/**
|
|
808
|
+
* Schemes a popout must never open: each runs script in a context the browser
|
|
809
|
+
* still associates with the opener, or (for `file:`) has no origin to check.
|
|
810
|
+
*/
|
|
811
|
+
const UNSAFE_POPOUT_PROTOCOLS = /* @__PURE__ */ new Set([
|
|
812
|
+
"javascript:",
|
|
813
|
+
"data:",
|
|
814
|
+
"blob:",
|
|
815
|
+
"vbscript:",
|
|
816
|
+
"file:"
|
|
817
|
+
]);
|
|
818
|
+
/** How often an open popout window's `closed` flag is checked. */
|
|
819
|
+
const CLOSED_POLL_INTERVAL_MS = 250;
|
|
820
|
+
/**
|
|
821
|
+
* The reason `url` is unusable as a popout target, or `undefined` if it is
|
|
822
|
+
* allowed. Rejects anything that isn't same-origin with the page (scheme and
|
|
823
|
+
* host, so a packaged webview's own scheme such as `tauri://` qualifies), and
|
|
824
|
+
* the `javascript:`, `data:`, `blob:`, `vbscript:` and `file:` schemes that
|
|
825
|
+
* would otherwise execute in a context the browser still associates with the
|
|
826
|
+
* opener via `window.opener`.
|
|
827
|
+
*
|
|
828
|
+
* Callers that can recover from a refusal use this rather than catching, so it
|
|
829
|
+
* can be handled without a rejected promise. `page` is what the URL resolves
|
|
830
|
+
* against, and defaults to this page.
|
|
831
|
+
*/
|
|
832
|
+
function getPopoutUrlError(url, page = globalThis.location) {
|
|
833
|
+
let resolved;
|
|
834
|
+
try {
|
|
835
|
+
resolved = new URL(url, page.href);
|
|
836
|
+
} catch (_unused) {
|
|
837
|
+
return /* @__PURE__ */ new Error(`dockview: invalid popout URL: ${url}`);
|
|
838
|
+
}
|
|
839
|
+
if (UNSAFE_POPOUT_PROTOCOLS.has(resolved.protocol)) return /* @__PURE__ */ new Error(`dockview: popout URL must not use the "${resolved.protocol}" protocol, which would run in the opener's context; got: ${url}`);
|
|
840
|
+
if (!(resolved.protocol === page.protocol && resolved.host === page.host)) return /* @__PURE__ */ new Error(`dockview: popout URL must be same-origin with the page (${page.protocol}//${page.host}); got: ${url}`);
|
|
841
|
+
}
|
|
842
|
+
var PopoutWindow = class extends CompositeDisposable {
|
|
843
|
+
get window() {
|
|
844
|
+
var _this$_window$value, _this$_window;
|
|
845
|
+
return (_this$_window$value = (_this$_window = this._window) === null || _this$_window === void 0 ? void 0 : _this$_window.value) !== null && _this$_window$value !== void 0 ? _this$_window$value : null;
|
|
846
|
+
}
|
|
847
|
+
/** Set when {@link open} resolved `null`, saying which way it failed. */
|
|
848
|
+
get failure() {
|
|
849
|
+
return this._failure;
|
|
850
|
+
}
|
|
851
|
+
constructor(target, className, options) {
|
|
852
|
+
super();
|
|
853
|
+
this.target = target;
|
|
854
|
+
this.className = className;
|
|
855
|
+
this.options = options;
|
|
856
|
+
this._onWillClose = new Emitter();
|
|
857
|
+
this.onWillClose = this._onWillClose.event;
|
|
858
|
+
this._onDidClose = new Emitter();
|
|
859
|
+
this.onDidClose = this._onDidClose.event;
|
|
860
|
+
this._window = null;
|
|
861
|
+
this.addDisposables(this._onWillClose, this._onDidClose, { dispose: () => {
|
|
862
|
+
this.close();
|
|
863
|
+
} });
|
|
864
|
+
}
|
|
865
|
+
dimensions() {
|
|
866
|
+
if (!this._window) return null;
|
|
867
|
+
const left = this._window.value.screenX;
|
|
868
|
+
return {
|
|
869
|
+
top: this._window.value.screenY,
|
|
870
|
+
left,
|
|
871
|
+
width: this._window.value.innerWidth,
|
|
872
|
+
height: this._window.value.innerHeight
|
|
873
|
+
};
|
|
874
|
+
}
|
|
875
|
+
close() {
|
|
876
|
+
var _this$options$onWillC, _this$options;
|
|
877
|
+
const current = this._window;
|
|
878
|
+
if (!current) return;
|
|
879
|
+
this._window = null;
|
|
880
|
+
this._onWillClose.fire();
|
|
881
|
+
(_this$options$onWillC = (_this$options = this.options).onWillClose) === null || _this$options$onWillC === void 0 || _this$options$onWillC.call(_this$options, {
|
|
882
|
+
id: this.target,
|
|
883
|
+
window: current.value
|
|
884
|
+
});
|
|
885
|
+
current.disposable.dispose();
|
|
886
|
+
this._onDidClose.fire();
|
|
887
|
+
}
|
|
888
|
+
open() {
|
|
889
|
+
var _this = this;
|
|
890
|
+
return _asyncToGenerator(function* () {
|
|
891
|
+
var _this$options$onDidOp, _this$options2;
|
|
892
|
+
if (_this._window) throw new Error("instance of popout window is already open");
|
|
893
|
+
const url = `${_this.options.url}`;
|
|
894
|
+
assertSameOriginPopoutUrl(url);
|
|
895
|
+
const features = Object.entries({
|
|
896
|
+
top: _this.options.top,
|
|
897
|
+
left: _this.options.left,
|
|
898
|
+
width: _this.options.width,
|
|
899
|
+
height: _this.options.height
|
|
900
|
+
}).map(([key, value]) => `${key}=${value}`).join(",");
|
|
901
|
+
/**
|
|
902
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/open
|
|
903
|
+
*/
|
|
904
|
+
const externalWindow = window.open(url, _this.target, features);
|
|
905
|
+
if (!externalWindow) {
|
|
906
|
+
_this._failure = { reason: "blocked" };
|
|
907
|
+
return null;
|
|
908
|
+
}
|
|
909
|
+
const disposable = new CompositeDisposable();
|
|
910
|
+
_this._window = {
|
|
911
|
+
value: externalWindow,
|
|
912
|
+
disposable
|
|
913
|
+
};
|
|
914
|
+
disposable.addDisposables(Disposable.from(() => {
|
|
915
|
+
externalWindow.close();
|
|
916
|
+
}), _this.watchForClose(externalWindow), addDisposableListener(globalThis.window, "beforeunload", () => {
|
|
917
|
+
/**
|
|
918
|
+
* before the main window closes we should close this popup too
|
|
919
|
+
* to be good citizens
|
|
920
|
+
*
|
|
921
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
922
|
+
*/
|
|
923
|
+
_this.close();
|
|
924
|
+
}));
|
|
925
|
+
const container = _this.createPopoutWindowContainer();
|
|
926
|
+
if (_this.className) container.classList.add(_this.className);
|
|
927
|
+
(_this$options$onDidOp = (_this$options2 = _this.options).onDidOpen) === null || _this$options$onDidOp === void 0 || _this$options$onDidOp.call(_this$options2, {
|
|
928
|
+
id: _this.target,
|
|
929
|
+
window: externalWindow
|
|
930
|
+
});
|
|
931
|
+
return new Promise((resolve) => {
|
|
932
|
+
/**
|
|
933
|
+
* A host can answer `window.open` with a window in its own
|
|
934
|
+
* JavaScript context, which throws on first touch and cannot be
|
|
935
|
+
* filled with panel DOM. Settle as a blocked popup does, so the
|
|
936
|
+
* caller's fallback returns the group to the grid.
|
|
937
|
+
*/
|
|
938
|
+
const abandon = (err) => {
|
|
939
|
+
_this._failure = {
|
|
940
|
+
reason: "unscriptable",
|
|
941
|
+
error: err instanceof Error ? err : new Error(String(err))
|
|
942
|
+
};
|
|
943
|
+
_this.close();
|
|
944
|
+
resolve(null);
|
|
945
|
+
};
|
|
946
|
+
try {
|
|
947
|
+
externalWindow.addEventListener("unload", () => {});
|
|
948
|
+
} catch (err) {
|
|
949
|
+
abandon(err);
|
|
950
|
+
return;
|
|
951
|
+
}
|
|
952
|
+
/**
|
|
953
|
+
* `load` is the only event that resolves this promise with a
|
|
954
|
+
* container, so a window that goes away first would leave the
|
|
955
|
+
* caller awaiting a promise that never settles - and
|
|
956
|
+
* `addPopoutGroup` holds its layout transaction open until it does.
|
|
957
|
+
* Settle with `null` on close, the same signal a blocked popup
|
|
958
|
+
* gives and one the caller already handles. `resolve` after the
|
|
959
|
+
* fact is a no-op, so a `load` that arrived first still wins.
|
|
960
|
+
*/
|
|
961
|
+
disposable.addDisposables(_this.onWillClose(() => {
|
|
962
|
+
var _this$_failure;
|
|
963
|
+
(_this$_failure = _this._failure) !== null && _this$_failure !== void 0 || (_this._failure = { reason: "closed" });
|
|
964
|
+
resolve(null);
|
|
965
|
+
}));
|
|
966
|
+
externalWindow.addEventListener("load", () => {
|
|
967
|
+
/**
|
|
968
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
|
|
969
|
+
*/
|
|
970
|
+
try {
|
|
971
|
+
var _globalThis$document$, _this$options$styleRo, _this$options3;
|
|
972
|
+
const externalDocument = externalWindow.document;
|
|
973
|
+
externalDocument.title = document.title;
|
|
974
|
+
externalDocument.body.appendChild(container);
|
|
975
|
+
addStyles(externalDocument, [...Array.from(globalThis.document.styleSheets), ...(_globalThis$document$ = globalThis.document.adoptedStyleSheets) !== null && _globalThis$document$ !== void 0 ? _globalThis$document$ : []], { nonce: _this.options.nonce });
|
|
976
|
+
const sheets = [];
|
|
977
|
+
for (let root = (_this$options$styleRo = (_this$options3 = _this.options).styleRoot) === null || _this$options$styleRo === void 0 ? void 0 : _this$options$styleRo.call(_this$options3); isShadowRoot(root); root = root.host.getRootNode()) {
|
|
978
|
+
var _root$styleSheets, _root$adoptedStyleShe;
|
|
979
|
+
sheets.push(...Array.from((_root$styleSheets = root.styleSheets) !== null && _root$styleSheets !== void 0 ? _root$styleSheets : []), ...(_root$adoptedStyleShe = root.adoptedStyleSheets) !== null && _root$adoptedStyleShe !== void 0 ? _root$adoptedStyleShe : []);
|
|
980
|
+
}
|
|
981
|
+
if (sheets.length > 0) addStyles(externalDocument, sheets, { nonce: _this.options.nonce });
|
|
982
|
+
/**
|
|
983
|
+
* beforeunload must be registered after load for reasons I could not determine
|
|
984
|
+
* otherwise the beforeunload event will not fire when the window is closed
|
|
985
|
+
*/
|
|
986
|
+
addDisposableListener(externalWindow, "beforeunload", () => {
|
|
987
|
+
/**
|
|
988
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
989
|
+
*/
|
|
990
|
+
_this.close();
|
|
991
|
+
});
|
|
992
|
+
resolve(container);
|
|
993
|
+
} catch (err) {
|
|
994
|
+
abandon(err);
|
|
995
|
+
}
|
|
996
|
+
});
|
|
997
|
+
});
|
|
998
|
+
})();
|
|
999
|
+
}
|
|
1000
|
+
/**
|
|
1001
|
+
* Backstop for the `beforeunload` signal, which a window torn down without
|
|
1002
|
+
* running its unload handlers never sends: a native shell destroying the
|
|
1003
|
+
* webview, or a browser discarding the page. `closed` is readable on any
|
|
1004
|
+
* handle, cross-origin included. Whichever signal arrives first wins.
|
|
1005
|
+
*/
|
|
1006
|
+
watchForClose(externalWindow) {
|
|
1007
|
+
if (typeof externalWindow.closed !== "boolean") return Disposable.NONE;
|
|
1008
|
+
const handle = setInterval(() => {
|
|
1009
|
+
if (externalWindow.closed) this.close();
|
|
1010
|
+
}, CLOSED_POLL_INTERVAL_MS);
|
|
1011
|
+
return Disposable.from(() => {
|
|
1012
|
+
clearInterval(handle);
|
|
1013
|
+
});
|
|
1014
|
+
}
|
|
1015
|
+
createPopoutWindowContainer() {
|
|
1016
|
+
const el = document.createElement("div");
|
|
1017
|
+
el.classList.add("dv-popout-window");
|
|
1018
|
+
el.id = "dv-popout-window";
|
|
1019
|
+
el.style.position = "absolute";
|
|
1020
|
+
el.style.width = "100%";
|
|
1021
|
+
el.style.height = "100%";
|
|
1022
|
+
el.style.top = "0px";
|
|
1023
|
+
el.style.left = "0px";
|
|
1024
|
+
return el;
|
|
1025
|
+
}
|
|
1026
|
+
};
|
|
642
1027
|
|
|
643
1028
|
//#endregion
|
|
644
1029
|
//#region src/array.ts
|
|
@@ -858,6 +1243,15 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
858
1243
|
get proportions() {
|
|
859
1244
|
return this._proportions ? [...this._proportions] : void 0;
|
|
860
1245
|
}
|
|
1246
|
+
get proportionalLayout() {
|
|
1247
|
+
return this._proportionalLayout;
|
|
1248
|
+
}
|
|
1249
|
+
set proportionalLayout(value) {
|
|
1250
|
+
if (this._proportionalLayout === value) return;
|
|
1251
|
+
this._proportionalLayout = value;
|
|
1252
|
+
if (value) this.saveProportions();
|
|
1253
|
+
else this._proportions = void 0;
|
|
1254
|
+
}
|
|
861
1255
|
get orientation() {
|
|
862
1256
|
return this._orientation;
|
|
863
1257
|
}
|
|
@@ -982,7 +1376,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
982
1376
|
this._orientation = (_options$orientation = options.orientation) !== null && _options$orientation !== void 0 ? _options$orientation : "VERTICAL";
|
|
983
1377
|
this.element = this.createContainer();
|
|
984
1378
|
this.margin = (_options$margin = options.margin) !== null && _options$margin !== void 0 ? _options$margin : 0;
|
|
985
|
-
this.
|
|
1379
|
+
this._proportionalLayout = options.proportionalLayout === void 0 ? true : !!options.proportionalLayout;
|
|
986
1380
|
this.viewContainer = this.createViewContainer();
|
|
987
1381
|
this.sashContainer = this.createSashContainer();
|
|
988
1382
|
this.element.appendChild(this.sashContainer);
|
|
@@ -1706,10 +2100,18 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
1706
2100
|
if (child instanceof BranchNode) child.margin = value;
|
|
1707
2101
|
});
|
|
1708
2102
|
}
|
|
2103
|
+
get proportionalLayout() {
|
|
2104
|
+
return this.splitview.proportionalLayout;
|
|
2105
|
+
}
|
|
2106
|
+
set proportionalLayout(value) {
|
|
2107
|
+
this.splitview.proportionalLayout = value;
|
|
2108
|
+
this.children.forEach((child) => {
|
|
2109
|
+
if (child instanceof BranchNode) child.proportionalLayout = value;
|
|
2110
|
+
});
|
|
2111
|
+
}
|
|
1709
2112
|
constructor(orientation, proportionalLayout, styles, size, orthogonalSize, disabled, margin, childDescriptors) {
|
|
1710
2113
|
super();
|
|
1711
2114
|
this.orientation = orientation;
|
|
1712
|
-
this.proportionalLayout = proportionalLayout;
|
|
1713
2115
|
this.styles = styles;
|
|
1714
2116
|
this._childrenDisposable = Disposable.NONE;
|
|
1715
2117
|
this.children = [];
|
|
@@ -2251,8 +2653,13 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
2251
2653
|
}
|
|
2252
2654
|
return findLeaf(this.root, reverse);
|
|
2253
2655
|
}
|
|
2656
|
+
get proportionalLayout() {
|
|
2657
|
+
return this.root.proportionalLayout;
|
|
2658
|
+
}
|
|
2659
|
+
set proportionalLayout(value) {
|
|
2660
|
+
this.root.proportionalLayout = value;
|
|
2661
|
+
}
|
|
2254
2662
|
constructor(proportionalLayout, styles, orientation, locked, margin) {
|
|
2255
|
-
this.proportionalLayout = proportionalLayout;
|
|
2256
2663
|
this.styles = styles;
|
|
2257
2664
|
this._locked = false;
|
|
2258
2665
|
this._margin = 0;
|
|
@@ -2446,6 +2853,25 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
2446
2853
|
this.layout(width, height);
|
|
2447
2854
|
}));
|
|
2448
2855
|
}
|
|
2856
|
+
/**
|
|
2857
|
+
* Lay out from the element's current size.
|
|
2858
|
+
*
|
|
2859
|
+
* The ResizeObserver above only reports asynchronously, so between
|
|
2860
|
+
* construction and its first callback the component believes it has no
|
|
2861
|
+
* size - and anything built in that window (panels added right after
|
|
2862
|
+
* `createDockview`, say) resolves its sizes against zero and collapses to
|
|
2863
|
+
* minimums. Concrete components call this once they are fully constructed
|
|
2864
|
+
* so that work sees the real size. The same guards as the observer apply:
|
|
2865
|
+
* a detached or hidden element has no size worth propagating.
|
|
2866
|
+
*/
|
|
2867
|
+
layoutFromElement() {
|
|
2868
|
+
if (this.disableResizing || !this._element.offsetParent) return;
|
|
2869
|
+
if (!isInDocument(this._element)) return;
|
|
2870
|
+
const width = Math.round(this._element.clientWidth);
|
|
2871
|
+
const height = Math.round(this._element.clientHeight);
|
|
2872
|
+
if (width === 0 || height === 0) return;
|
|
2873
|
+
this.layout(width, height);
|
|
2874
|
+
}
|
|
2449
2875
|
};
|
|
2450
2876
|
|
|
2451
2877
|
//#endregion
|
|
@@ -2546,7 +2972,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
2546
2972
|
return this.gridview.isViewVisible(getGridLocation(panel.element));
|
|
2547
2973
|
}
|
|
2548
2974
|
updateOptions(options) {
|
|
2549
|
-
if (
|
|
2975
|
+
if ("proportionalLayout" in options) {
|
|
2976
|
+
var _options$proportional;
|
|
2977
|
+
this.gridview.proportionalLayout = (_options$proportional = options.proportionalLayout) !== null && _options$proportional !== void 0 ? _options$proportional : true;
|
|
2978
|
+
}
|
|
2550
2979
|
if (options.orientation) this.gridview.orientation = options.orientation;
|
|
2551
2980
|
if ("styles" in options) {}
|
|
2552
2981
|
if ("disableAutoResizing" in options) {
|
|
@@ -3355,6 +3784,15 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
3355
3784
|
get onUnhandledDragOver() {
|
|
3356
3785
|
return this.component.onUnhandledDragOver;
|
|
3357
3786
|
}
|
|
3787
|
+
/**
|
|
3788
|
+
* The drag-and-drop backends currently live: `dndStrategy` resolved against
|
|
3789
|
+
* this device, which `'auto'` reads from the primary input device. Only an
|
|
3790
|
+
* HTML5 drag can leave the window it started in, so check `html5` before
|
|
3791
|
+
* relying on a drag between a popout window and the main window.
|
|
3792
|
+
*/
|
|
3793
|
+
get dndCapabilities() {
|
|
3794
|
+
return this.component.dndCapabilities;
|
|
3795
|
+
}
|
|
3358
3796
|
get onDidPopoutGroupSizeChange() {
|
|
3359
3797
|
return this.component.onDidPopoutGroupSizeChange;
|
|
3360
3798
|
}
|
|
@@ -3377,9 +3815,27 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
3377
3815
|
get onDidRemovePopoutGroup() {
|
|
3378
3816
|
return this.component.onDidRemovePopoutGroup;
|
|
3379
3817
|
}
|
|
3818
|
+
/**
|
|
3819
|
+
* Fires when a popout window could not be used, carrying which way it
|
|
3820
|
+
* failed: the URL was refused, the browser blocked the window, the host
|
|
3821
|
+
* returned a window whose document the opener cannot reach, or it closed
|
|
3822
|
+
* before loading. The group stays in (or returns to) the main grid.
|
|
3823
|
+
*/
|
|
3380
3824
|
get onDidOpenPopoutWindowFail() {
|
|
3381
3825
|
return this.component.onDidOpenPopoutWindowFail;
|
|
3382
3826
|
}
|
|
3827
|
+
/**
|
|
3828
|
+
* Fires as dockview lets go of a popout window, while that window is still
|
|
3829
|
+
* open, carrying its live `Window` handle. Covers every popout the component
|
|
3830
|
+
* opened and every reason for closing one, disposal included;
|
|
3831
|
+
* {@link onDidAddPopoutGroup} is the opening half.
|
|
3832
|
+
*
|
|
3833
|
+
* For hosts that own their windows: in a desktop webview the page's own
|
|
3834
|
+
* `close()` can be a no-op, so the shell has to be told.
|
|
3835
|
+
*/
|
|
3836
|
+
get onWillClosePopoutWindow() {
|
|
3837
|
+
return this.component.onWillClosePopoutWindow;
|
|
3838
|
+
}
|
|
3383
3839
|
/** Enumerate the popout groups currently open in their own windows. */
|
|
3384
3840
|
getPopouts() {
|
|
3385
3841
|
return this.component.getPopouts();
|
|
@@ -4346,7 +4802,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4346
4802
|
var _options$ownerDocumen, _options$x, _options$y;
|
|
4347
4803
|
addClasses(ghostElement, "dv-dragged");
|
|
4348
4804
|
ghostElement.style.top = "-9999px";
|
|
4349
|
-
|
|
4805
|
+
ghostElement.style.position = "absolute";
|
|
4806
|
+
((options === null || options === void 0 ? void 0 : options.owner) ? getOverlayParent(options.owner) : ((_options$ownerDocumen = options === null || options === void 0 ? void 0 : options.ownerDocument) !== null && _options$ownerDocumen !== void 0 ? _options$ownerDocumen : document).body).appendChild(ghostElement);
|
|
4350
4807
|
dataTransfer.setDragImage(ghostElement, (_options$x = options === null || options === void 0 ? void 0 : options.x) !== null && _options$x !== void 0 ? _options$x : 0, (_options$y = options === null || options === void 0 ? void 0 : options.y) !== null && _options$y !== void 0 ? _options$y : 0);
|
|
4351
4808
|
setTimeout(() => {
|
|
4352
4809
|
removeClasses(ghostElement, "dv-dragged");
|
|
@@ -4398,7 +4855,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4398
4855
|
} };
|
|
4399
4856
|
}
|
|
4400
4857
|
beginDrag(args) {
|
|
4401
|
-
var _source$ownerDocument, _source$ownerDocument2, _source$ownerDocument3;
|
|
4858
|
+
var _source$ownerDocument, _source$ownerDocument2, _source$ownerDocument3, _source$ownerDocument4;
|
|
4402
4859
|
if (this._active) this.cancel();
|
|
4403
4860
|
const { pointerEvent, source } = args;
|
|
4404
4861
|
const dataDisposable = args.getData();
|
|
@@ -4414,13 +4871,14 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4414
4871
|
this._dataDisposable = dataDisposable;
|
|
4415
4872
|
this._ghost = args.ghost;
|
|
4416
4873
|
this._iframeShield = disableIframePointEvents((_source$ownerDocument = source.ownerDocument) !== null && _source$ownerDocument !== void 0 ? _source$ownerDocument : document);
|
|
4874
|
+
this._selectionShield = disableTextSelection((_source$ownerDocument2 = source.ownerDocument) !== null && _source$ownerDocument2 !== void 0 ? _source$ownerDocument2 : document);
|
|
4417
4875
|
const startEvent = {
|
|
4418
4876
|
clientX: pointerEvent.clientX,
|
|
4419
4877
|
clientY: pointerEvent.clientY,
|
|
4420
4878
|
pointerEvent
|
|
4421
4879
|
};
|
|
4422
4880
|
this._onDragStart.fire(startEvent);
|
|
4423
|
-
const targetWindow = (_source$
|
|
4881
|
+
const targetWindow = (_source$ownerDocument3 = (_source$ownerDocument4 = source.ownerDocument) === null || _source$ownerDocument4 === void 0 ? void 0 : _source$ownerDocument4.defaultView) !== null && _source$ownerDocument3 !== void 0 ? _source$ownerDocument3 : globalThis.window;
|
|
4424
4882
|
this._moveListener = addDisposableListener(targetWindow, "pointermove", (e) => {
|
|
4425
4883
|
var _this$_active;
|
|
4426
4884
|
if (e.pointerId !== ((_this$_active = this._active) === null || _this$_active === void 0 ? void 0 : _this$_active.pointerId)) return;
|
|
@@ -4457,8 +4915,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4457
4915
|
}
|
|
4458
4916
|
}
|
|
4459
4917
|
_findTargetUnder(x, y) {
|
|
4460
|
-
|
|
4461
|
-
const elements = ((_this$_active$source$ = (_this$_active4 = this._active) === null || _this$_active4 === void 0 ? void 0 : _this$_active4.source.ownerDocument) !== null && _this$_active$source$ !== void 0 ? _this$_active$source$ : document).elementsFromPoint(x, y);
|
|
4918
|
+
const elements = (this._active ? getHitTestRoot(this._active.source) : document).elementsFromPoint(x, y);
|
|
4462
4919
|
for (const el of elements) {
|
|
4463
4920
|
let current = el;
|
|
4464
4921
|
while (current) {
|
|
@@ -4508,7 +4965,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4508
4965
|
this._onDragEnd.fire(dragEvent);
|
|
4509
4966
|
}
|
|
4510
4967
|
_teardown() {
|
|
4511
|
-
var _this$_ghost2, _this$_iframeShield, _this$_moveListener, _this$_upListener, _this$_cancelListener;
|
|
4968
|
+
var _this$_ghost2, _this$_iframeShield, _this$_selectionShiel, _this$_moveListener, _this$_upListener, _this$_cancelListener;
|
|
4512
4969
|
this._currentTarget = void 0;
|
|
4513
4970
|
this._active = void 0;
|
|
4514
4971
|
this._lastPointerEvent = void 0;
|
|
@@ -4518,6 +4975,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4518
4975
|
this._ghost = void 0;
|
|
4519
4976
|
(_this$_iframeShield = this._iframeShield) === null || _this$_iframeShield === void 0 || _this$_iframeShield.release();
|
|
4520
4977
|
this._iframeShield = void 0;
|
|
4978
|
+
(_this$_selectionShiel = this._selectionShield) === null || _this$_selectionShiel === void 0 || _this$_selectionShiel.release();
|
|
4979
|
+
this._selectionShield = void 0;
|
|
4521
4980
|
(_this$_moveListener = this._moveListener) === null || _this$_moveListener === void 0 || _this$_moveListener.dispose();
|
|
4522
4981
|
(_this$_upListener = this._upListener) === null || _this$_upListener === void 0 || _this$_upListener.dispose();
|
|
4523
4982
|
(_this$_cancelListener = this._cancelListener) === null || _this$_cancelListener === void 0 || _this$_cancelListener.dispose();
|
|
@@ -4786,9 +5245,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4786
5245
|
return true;
|
|
4787
5246
|
}
|
|
4788
5247
|
_onPointerDown(event) {
|
|
4789
|
-
var _ref, _this$options$thresho, _ref2, _this$element$
|
|
5248
|
+
var _this$element$ownerDo, _ref, _this$options$thresho, _ref2, _this$element$ownerDo2, _this$element$ownerDo3;
|
|
4790
5249
|
if (!this._shouldHandle(event)) return;
|
|
4791
5250
|
this._cancelPending();
|
|
5251
|
+
this._selectionShield = disableTextSelection((_this$element$ownerDo = this.element.ownerDocument) !== null && _this$element$ownerDo !== void 0 ? _this$element$ownerDo : document);
|
|
4792
5252
|
this._pendingPointerId = event.pointerId;
|
|
4793
5253
|
this._startX = event.clientX;
|
|
4794
5254
|
this._startY = event.clientY;
|
|
@@ -4804,7 +5264,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4804
5264
|
const threshold = (_this$options$thresho = this.options.threshold) !== null && _this$options$thresho !== void 0 ? _this$options$thresho : DEFAULT_THRESHOLD;
|
|
4805
5265
|
const pressToleranceOpt = this.options.pressTolerance;
|
|
4806
5266
|
const pressTolerance = (_ref2 = typeof pressToleranceOpt === "function" ? pressToleranceOpt() : pressToleranceOpt) !== null && _ref2 !== void 0 ? _ref2 : DEFAULT_PRESS_TOLERANCE;
|
|
4807
|
-
const targetWindow = (_this$element$
|
|
5267
|
+
const targetWindow = (_this$element$ownerDo2 = (_this$element$ownerDo3 = this.element.ownerDocument) === null || _this$element$ownerDo3 === void 0 ? void 0 : _this$element$ownerDo3.defaultView) !== null && _this$element$ownerDo2 !== void 0 ? _this$element$ownerDo2 : globalThis.window;
|
|
4808
5268
|
this._pendingMoveListener = addDisposableListener(targetWindow, "pointermove", (moveEvent) => {
|
|
4809
5269
|
if (moveEvent.pointerId !== this._pendingPointerId) return;
|
|
4810
5270
|
const dx = moveEvent.clientX - this._startX;
|
|
@@ -4830,7 +5290,9 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4830
5290
|
this._cancelPending();
|
|
4831
5291
|
}
|
|
4832
5292
|
_cancelPending() {
|
|
4833
|
-
var _this$_pendingMoveLis, _this$_pendingUpListe, _this$_pendingCancelL;
|
|
5293
|
+
var _this$_selectionShiel, _this$_pendingMoveLis, _this$_pendingUpListe, _this$_pendingCancelL;
|
|
5294
|
+
(_this$_selectionShiel = this._selectionShield) === null || _this$_selectionShiel === void 0 || _this$_selectionShiel.release();
|
|
5295
|
+
this._selectionShield = void 0;
|
|
4834
5296
|
this._pendingPointerId = void 0;
|
|
4835
5297
|
if (this._armTimer !== void 0) {
|
|
4836
5298
|
clearTimeout(this._armTimer);
|
|
@@ -4875,29 +5337,51 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4875
5337
|
*/
|
|
4876
5338
|
var PointerGhost = class {
|
|
4877
5339
|
constructor(opts) {
|
|
4878
|
-
var _opts$offsetX, _opts$offsetY,
|
|
5340
|
+
var _opts$offsetX, _opts$offsetY, _popover, _opts$opacity;
|
|
4879
5341
|
this._disposed = false;
|
|
4880
5342
|
this.element = opts.element;
|
|
4881
5343
|
this.offsetX = (_opts$offsetX = opts.offsetX) !== null && _opts$offsetX !== void 0 ? _opts$offsetX : 0;
|
|
4882
5344
|
this.offsetY = (_opts$offsetY = opts.offsetY) !== null && _opts$offsetY !== void 0 ? _opts$offsetY : 0;
|
|
4883
|
-
|
|
4884
|
-
|
|
4885
|
-
this.element.
|
|
4886
|
-
|
|
4887
|
-
|
|
4888
|
-
|
|
4889
|
-
|
|
4890
|
-
|
|
4891
|
-
|
|
5345
|
+
const parent = opts.owner ? getOverlayParent(opts.owner) : document.body;
|
|
5346
|
+
let popover;
|
|
5347
|
+
if (isShadowRoot(parent) && typeof this.element.showPopover === "function") {
|
|
5348
|
+
popover = this.element.ownerDocument.createElement("div");
|
|
5349
|
+
popover.popover = "manual";
|
|
5350
|
+
Object.assign(popover.style, {
|
|
5351
|
+
inset: "auto",
|
|
5352
|
+
margin: "0",
|
|
5353
|
+
padding: "0",
|
|
5354
|
+
border: "0",
|
|
5355
|
+
background: "transparent",
|
|
5356
|
+
color: "inherit",
|
|
5357
|
+
overflow: "visible"
|
|
5358
|
+
});
|
|
5359
|
+
popover.appendChild(this.element);
|
|
5360
|
+
this.element.style.pointerEvents = "none";
|
|
5361
|
+
this.element.style.transform = "none";
|
|
5362
|
+
}
|
|
5363
|
+
this.container = (_popover = popover) !== null && _popover !== void 0 ? _popover : this.element;
|
|
5364
|
+
const style = this.container.style;
|
|
5365
|
+
style.position = "fixed";
|
|
5366
|
+
style.left = "0px";
|
|
5367
|
+
style.top = "0px";
|
|
5368
|
+
style.pointerEvents = "none";
|
|
5369
|
+
style.zIndex = "99999";
|
|
5370
|
+
style.opacity = String((_opts$opacity = opts.opacity) !== null && _opts$opacity !== void 0 ? _opts$opacity : .8);
|
|
5371
|
+
style.willChange = "transform";
|
|
5372
|
+
style.transform = `translate3d(${opts.initialX - this.offsetX}px, ${opts.initialY - this.offsetY}px, 0)`;
|
|
5373
|
+
parent.appendChild(this.container);
|
|
5374
|
+
popover === null || popover === void 0 || popover.showPopover();
|
|
4892
5375
|
}
|
|
4893
5376
|
update(clientX, clientY) {
|
|
4894
5377
|
if (this._disposed) return;
|
|
4895
|
-
this.
|
|
5378
|
+
this.container.style.transform = `translate3d(${clientX - this.offsetX}px, ${clientY - this.offsetY}px, 0)`;
|
|
4896
5379
|
}
|
|
4897
5380
|
dispose() {
|
|
4898
5381
|
if (this._disposed) return;
|
|
4899
5382
|
this._disposed = true;
|
|
4900
5383
|
this.element.remove();
|
|
5384
|
+
if (this.container !== this.element) this.container.remove();
|
|
4901
5385
|
}
|
|
4902
5386
|
};
|
|
4903
5387
|
|
|
@@ -4934,7 +5418,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
4934
5418
|
addGhostImage(event.dataTransfer, ghost.element, {
|
|
4935
5419
|
x: (_ghost$offsetX = ghost.offsetX) !== null && _ghost$offsetX !== void 0 ? _ghost$offsetX : 0,
|
|
4936
5420
|
y: (_ghost$offsetY = ghost.offsetY) !== null && _ghost$offsetY !== void 0 ? _ghost$offsetY : 0,
|
|
4937
|
-
ownerDocument: (_this$el$ownerDocumen2 = this.el.ownerDocument) !== null && _this$el$ownerDocumen2 !== void 0 ? _this$el$ownerDocumen2 : void 0
|
|
5421
|
+
ownerDocument: (_this$el$ownerDocumen2 = this.el.ownerDocument) !== null && _this$el$ownerDocumen2 !== void 0 ? _this$el$ownerDocumen2 : void 0,
|
|
5422
|
+
owner: this.el
|
|
4938
5423
|
});
|
|
4939
5424
|
if (ghost.dispose) {
|
|
4940
5425
|
const disposeGhost = ghost.dispose;
|
|
@@ -5770,8 +6255,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
5770
6255
|
let guard;
|
|
5771
6256
|
const timeout = setTimeout(() => guard === null || guard === void 0 ? void 0 : guard.dispose(), 500);
|
|
5772
6257
|
guard = addDisposableListener(targetWindow, "click", (event) => {
|
|
5773
|
-
|
|
5774
|
-
if (target && this.element.contains(target)) {
|
|
6258
|
+
if (isEventWithin(event, [this.element])) {
|
|
5775
6259
|
event.preventDefault();
|
|
5776
6260
|
event.stopPropagation();
|
|
5777
6261
|
}
|
|
@@ -5887,7 +6371,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
5887
6371
|
if (this.accessor.id === (data === null || data === void 0 ? void 0 : data.viewId)) {
|
|
5888
6372
|
var _this$accessor$option;
|
|
5889
6373
|
if (((_this$accessor$option = this.accessor.options.theme) === null || _this$accessor$option === void 0 ? void 0 : _this$accessor$option.tabAnimation) === "smooth") return false;
|
|
5890
|
-
if (data.tabGroupId && this.group.model.getTabGroupForPanel(this.panel.id)) return false;
|
|
6374
|
+
if (data.tabGroupId && data.groupId === this.group.id && this.group.model.getTabGroupForPanel(this.panel.id)) return false;
|
|
5891
6375
|
return true;
|
|
5892
6376
|
}
|
|
5893
6377
|
return this.group.model.canDisplayOverlay(event, position, "tab");
|
|
@@ -6500,6 +6984,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
6500
6984
|
const PROPERTY_KEYS_DOCKVIEW = (() => {
|
|
6501
6985
|
return Object.keys({
|
|
6502
6986
|
disableAutoResizing: void 0,
|
|
6987
|
+
proportionalLayout: void 0,
|
|
6503
6988
|
hideBorders: void 0,
|
|
6504
6989
|
singleTabMode: void 0,
|
|
6505
6990
|
disableFloatingGroups: void 0,
|
|
@@ -7353,10 +7838,16 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7353
7838
|
(_entry$pointerDropTar = entry.pointerDropTarget) === null || _entry$pointerDropTar === void 0 || _entry$pointerDropTar.clearOverlay();
|
|
7354
7839
|
}
|
|
7355
7840
|
}
|
|
7356
|
-
|
|
7357
|
-
|
|
7358
|
-
|
|
7359
|
-
|
|
7841
|
+
/** Each chip's extent along the strip's main axis: width for a horizontal
|
|
7842
|
+
* header, height for a vertical one. */
|
|
7843
|
+
snapshotChipSizes() {
|
|
7844
|
+
const isVertical = this._ctx.getDirection() === "vertical";
|
|
7845
|
+
const sizes = /* @__PURE__ */ new Map();
|
|
7846
|
+
for (const [groupId, entry] of this._chipRenderers) {
|
|
7847
|
+
const rect = entry.chip.element.getBoundingClientRect();
|
|
7848
|
+
sizes.set(groupId, isVertical ? rect.height : rect.width);
|
|
7849
|
+
}
|
|
7850
|
+
return sizes;
|
|
7360
7851
|
}
|
|
7361
7852
|
positionUnderlines() {
|
|
7362
7853
|
var _this$_indicator2;
|
|
@@ -7748,6 +8239,22 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7748
8239
|
//#endregion
|
|
7749
8240
|
//#region src/dockview/components/titlebar/tabReorderController.ts
|
|
7750
8241
|
/**
|
|
8242
|
+
* Main-axis extent of a rect. Tabs flow along x in a horizontal header
|
|
8243
|
+
* (top/bottom) and along y in a vertical one (the left/right edge groups),
|
|
8244
|
+
* so the reorder math reads every size through this.
|
|
8245
|
+
*/
|
|
8246
|
+
function mainAxisSize(rect, direction) {
|
|
8247
|
+
return direction === "vertical" ? rect.height : rect.width;
|
|
8248
|
+
}
|
|
8249
|
+
/** Leading edge of a rect along the main axis. */
|
|
8250
|
+
function mainAxisStart(rect, direction) {
|
|
8251
|
+
return direction === "vertical" ? rect.top : rect.left;
|
|
8252
|
+
}
|
|
8253
|
+
/** A cursor position projected onto the main axis. */
|
|
8254
|
+
function mainAxisCursor(event, direction) {
|
|
8255
|
+
return direction === "vertical" ? event.clientY : event.clientX;
|
|
8256
|
+
}
|
|
8257
|
+
/**
|
|
7751
8258
|
* Tab drag-reorder + FLIP animation subsystem extracted from `Tabs`. The DOM
|
|
7752
8259
|
* event wiring remains in `Tabs` and delegates the reorder/animation logic to
|
|
7753
8260
|
* this controller. All access back into `Tabs` goes through
|
|
@@ -7842,14 +8349,30 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7842
8349
|
for (const tab of this._tabs) positions.set(tab.value.panel.id, tab.value.element.getBoundingClientRect());
|
|
7843
8350
|
return positions;
|
|
7844
8351
|
}
|
|
7845
|
-
|
|
8352
|
+
/** Main-axis extent of a rect for this header's orientation. */
|
|
8353
|
+
_mainAxisSize(rect) {
|
|
8354
|
+
return mainAxisSize(rect, this._direction);
|
|
8355
|
+
}
|
|
8356
|
+
/** Main-axis leading edge of a rect for this header's orientation. */
|
|
8357
|
+
_mainAxisStart(rect) {
|
|
8358
|
+
return mainAxisStart(rect, this._direction);
|
|
8359
|
+
}
|
|
8360
|
+
/** The cursor coordinate along the main axis. */
|
|
8361
|
+
_mainAxisCoord(clientX, clientY) {
|
|
8362
|
+
return mainAxisCursor({
|
|
8363
|
+
clientX,
|
|
8364
|
+
clientY
|
|
8365
|
+
}, this._direction);
|
|
8366
|
+
}
|
|
8367
|
+
/** The margin that opens the insertion gap. It must run along the main
|
|
8368
|
+
* axis, so a vertical header pushes tabs down rather than sideways. */
|
|
8369
|
+
get _gapMarginProperty() {
|
|
8370
|
+
return this._direction === "vertical" ? "margin-top" : "margin-left";
|
|
8371
|
+
}
|
|
8372
|
+
getAverageTabSize() {
|
|
7846
8373
|
if (this._tabs.length === 0) return 0;
|
|
7847
|
-
const isVertical = this._direction === "vertical";
|
|
7848
8374
|
let total = 0;
|
|
7849
|
-
for (const tab of this._tabs)
|
|
7850
|
-
const rect = tab.value.element.getBoundingClientRect();
|
|
7851
|
-
total += isVertical ? rect.height : rect.width;
|
|
7852
|
-
}
|
|
8375
|
+
for (const tab of this._tabs) total += this._mainAxisSize(tab.value.element.getBoundingClientRect());
|
|
7853
8376
|
return total / this._tabs.length;
|
|
7854
8377
|
}
|
|
7855
8378
|
/**
|
|
@@ -7859,8 +8382,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7859
8382
|
* `processDragOver` / `processDragLeave` helpers.
|
|
7860
8383
|
*/
|
|
7861
8384
|
handlePointerDragMove(clientX, clientY) {
|
|
7862
|
-
|
|
7863
|
-
const elAtPoint = ((_this$_tabsList$owner = this._tabsList.ownerDocument) !== null && _this$_tabsList$owner !== void 0 ? _this$_tabsList$owner : document).elementFromPoint(clientX, clientY);
|
|
8385
|
+
const elAtPoint = getHitTestRoot(this._tabsList).elementFromPoint(clientX, clientY);
|
|
7864
8386
|
if (!(!!elAtPoint && (this._tabsList.contains(elAtPoint) || !!this._extendedDropZone && this._extendedDropZone.contains(elAtPoint)))) {
|
|
7865
8387
|
if (this._pointerInsideTabsList) {
|
|
7866
8388
|
this._pointerInsideTabsList = false;
|
|
@@ -7889,8 +8411,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7889
8411
|
this.resetDragAnimation();
|
|
7890
8412
|
}
|
|
7891
8413
|
isPointInsideTabsList(clientX, clientY) {
|
|
7892
|
-
|
|
7893
|
-
const el = ((_this$_tabsList$owner2 = this._tabsList.ownerDocument) !== null && _this$_tabsList$owner2 !== void 0 ? _this$_tabsList$owner2 : document).elementFromPoint(clientX, clientY);
|
|
8414
|
+
const el = getHitTestRoot(this._tabsList).elementFromPoint(clientX, clientY);
|
|
7894
8415
|
return !!el && this._tabsList.contains(el);
|
|
7895
8416
|
}
|
|
7896
8417
|
/** Commit a smooth-mode intra-group reorder from the current insertion
|
|
@@ -7954,46 +8475,46 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
7954
8475
|
const data = getPanelData();
|
|
7955
8476
|
if (((_this$accessor$option = this.accessor.options.theme) === null || _this$accessor$option === void 0 ? void 0 : _this$accessor$option.tabAnimation) === "default" && !(data === null || data === void 0 ? void 0 : data.tabGroupId)) return false;
|
|
7956
8477
|
if (!data || !(data.panelId || data.tabGroupId) || data.groupId === this.group.id) return false;
|
|
7957
|
-
const
|
|
7958
|
-
this._animState = data.tabGroupId ? this._makeGroupDragAnimState(data,
|
|
8478
|
+
const avgSize = this.getAverageTabSize();
|
|
8479
|
+
this._animState = data.tabGroupId ? this._makeGroupDragAnimState(data, avgSize) : this._makeTabDragAnimState(data, avgSize);
|
|
7959
8480
|
return true;
|
|
7960
8481
|
}
|
|
7961
8482
|
/** Anim state for an external group-chip drag (gap sized to the group). */
|
|
7962
|
-
_makeGroupDragAnimState(data,
|
|
8483
|
+
_makeGroupDragAnimState(data, avgSize) {
|
|
7963
8484
|
var _sourceTg$panelIds$le;
|
|
7964
8485
|
const sourceGroup = this.accessor.getPanel(data.groupId);
|
|
7965
8486
|
const sourceTg = sourceGroup === null || sourceGroup === void 0 ? void 0 : sourceGroup.model.getTabGroups().find((tg) => tg.id === data.tabGroupId);
|
|
7966
|
-
const
|
|
8487
|
+
const groupGapSize = avgSize * ((_sourceTg$panelIds$le = sourceTg === null || sourceTg === void 0 ? void 0 : sourceTg.panelIds.length) !== null && _sourceTg$panelIds$le !== void 0 ? _sourceTg$panelIds$le : 1) + avgSize;
|
|
7967
8488
|
return {
|
|
7968
8489
|
sourceTabId: "",
|
|
7969
8490
|
sourceIndex: -1,
|
|
7970
8491
|
tabPositions: this.snapshotTabPositions(),
|
|
7971
|
-
|
|
8492
|
+
chipSizes: this._tabGroupManager.snapshotChipSizes(),
|
|
7972
8493
|
currentInsertionIndex: null,
|
|
7973
8494
|
targetTabGroupId: null,
|
|
7974
8495
|
sourceTabGroupId: data.tabGroupId,
|
|
7975
8496
|
sourceGroupPanelIds: sourceTg ? new Set(sourceTg.panelIds) : /* @__PURE__ */ new Set(),
|
|
7976
|
-
|
|
7977
|
-
|
|
7978
|
-
|
|
7979
|
-
|
|
8497
|
+
sourceChipSize: avgSize,
|
|
8498
|
+
cursorOffsetFromDragStart: groupGapSize / 2,
|
|
8499
|
+
sourceGapSize: groupGapSize,
|
|
8500
|
+
containerStart: this._mainAxisStart(this._tabsList.getBoundingClientRect())
|
|
7980
8501
|
};
|
|
7981
8502
|
}
|
|
7982
8503
|
/** Anim state for an external single-tab drag. */
|
|
7983
|
-
_makeTabDragAnimState(data,
|
|
8504
|
+
_makeTabDragAnimState(data, avgSize) {
|
|
7984
8505
|
return {
|
|
7985
8506
|
sourceTabId: data.panelId,
|
|
7986
8507
|
sourceIndex: -1,
|
|
7987
8508
|
tabPositions: this.snapshotTabPositions(),
|
|
7988
|
-
|
|
8509
|
+
chipSizes: this._tabGroupManager.snapshotChipSizes(),
|
|
7989
8510
|
currentInsertionIndex: null,
|
|
7990
8511
|
targetTabGroupId: null,
|
|
7991
8512
|
sourceTabGroupId: null,
|
|
7992
8513
|
sourceGroupPanelIds: null,
|
|
7993
|
-
|
|
7994
|
-
|
|
7995
|
-
|
|
7996
|
-
|
|
8514
|
+
sourceChipSize: 0,
|
|
8515
|
+
cursorOffsetFromDragStart: avgSize / 2,
|
|
8516
|
+
sourceGapSize: avgSize,
|
|
8517
|
+
containerStart: this._mainAxisStart(this._tabsList.getBoundingClientRect())
|
|
7997
8518
|
};
|
|
7998
8519
|
}
|
|
7999
8520
|
/**
|
|
@@ -8036,19 +8557,19 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8036
8557
|
container === null || container === void 0 || (_container$model = container.model) === null || _container$model === void 0 || _container$model.clear();
|
|
8037
8558
|
}
|
|
8038
8559
|
handleDragOver(event) {
|
|
8039
|
-
var _this$accessor$option2;
|
|
8560
|
+
var _event$clientY2, _this$accessor$option2;
|
|
8040
8561
|
if (!this._animState) return;
|
|
8041
8562
|
if (this._wrapMode && !this._animState.sourceTabGroupId) {
|
|
8042
8563
|
var _event$clientY;
|
|
8043
8564
|
this.handleWrappedDragOver(event.clientX, (_event$clientY = event.clientY) !== null && _event$clientY !== void 0 ? _event$clientY : 0);
|
|
8044
8565
|
return;
|
|
8045
8566
|
}
|
|
8046
|
-
const
|
|
8567
|
+
const mousePos = this._mainAxisCoord(event.clientX, (_event$clientY2 = event.clientY) !== null && _event$clientY2 !== void 0 ? _event$clientY2 : 0);
|
|
8047
8568
|
const firstPanelToGroup = this._buildFirstPanelToGroupMap();
|
|
8048
|
-
let insertionIndex = this._computeDragOverInsertionIndex(
|
|
8569
|
+
let insertionIndex = this._computeDragOverInsertionIndex(mousePos, firstPanelToGroup);
|
|
8049
8570
|
let targetTabGroupId = null;
|
|
8050
8571
|
if (insertionIndex !== null && this._tabGroupManager.chipRenderers.size > 0) {
|
|
8051
|
-
const resolved = this._resolveInsertionAgainstTabGroups(
|
|
8572
|
+
const resolved = this._resolveInsertionAgainstTabGroups(mousePos, insertionIndex, firstPanelToGroup);
|
|
8052
8573
|
insertionIndex = resolved.insertionIndex;
|
|
8053
8574
|
targetTabGroupId = resolved.targetTabGroupId;
|
|
8054
8575
|
}
|
|
@@ -8072,14 +8593,15 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8072
8593
|
return firstPanelToGroup;
|
|
8073
8594
|
}
|
|
8074
8595
|
/**
|
|
8075
|
-
* Walk the tabs
|
|
8076
|
-
* insertion slot for the drag image's
|
|
8596
|
+
* Walk the tabs in flow order by their original main-axis sizes and return
|
|
8597
|
+
* the insertion slot for the drag image's leading edge (null if no slot
|
|
8598
|
+
* fits).
|
|
8077
8599
|
*/
|
|
8078
|
-
_computeDragOverInsertionIndex(
|
|
8600
|
+
_computeDragOverInsertionIndex(mousePos, firstPanelToGroup) {
|
|
8079
8601
|
const animState = this._animState;
|
|
8080
8602
|
const sourceGroupPanelIds = animState.sourceGroupPanelIds;
|
|
8081
|
-
const availableSpace =
|
|
8082
|
-
let
|
|
8603
|
+
const availableSpace = mousePos - animState.cursorOffsetFromDragStart - animState.containerStart;
|
|
8604
|
+
let accSize = 0;
|
|
8083
8605
|
let insertionIndex = null;
|
|
8084
8606
|
for (let i = 0; i < this._tabs.length; i++) {
|
|
8085
8607
|
const tab = this._tabs[i].value;
|
|
@@ -8087,19 +8609,19 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8087
8609
|
if (sourceGroupPanelIds === null || sourceGroupPanelIds === void 0 ? void 0 : sourceGroupPanelIds.has(tab.panel.id)) continue;
|
|
8088
8610
|
const groupId = firstPanelToGroup.get(tab.panel.id);
|
|
8089
8611
|
if (groupId) {
|
|
8090
|
-
var _animState$
|
|
8091
|
-
const
|
|
8092
|
-
if (
|
|
8612
|
+
var _animState$chipSizes$;
|
|
8613
|
+
const chipSize = (_animState$chipSizes$ = animState.chipSizes.get(groupId)) !== null && _animState$chipSizes$ !== void 0 ? _animState$chipSizes$ : 0;
|
|
8614
|
+
if (accSize + chipSize > availableSpace) {
|
|
8093
8615
|
var _insertionIndex;
|
|
8094
8616
|
(_insertionIndex = insertionIndex) !== null && _insertionIndex !== void 0 || (insertionIndex = i);
|
|
8095
8617
|
break;
|
|
8096
8618
|
}
|
|
8097
|
-
|
|
8619
|
+
accSize += chipSize;
|
|
8098
8620
|
}
|
|
8099
8621
|
const origRect = animState.tabPositions.get(tab.panel.id);
|
|
8100
|
-
const
|
|
8101
|
-
if (
|
|
8102
|
-
|
|
8622
|
+
const tabSize = this._mainAxisSize(origRect !== null && origRect !== void 0 ? origRect : tab.element.getBoundingClientRect());
|
|
8623
|
+
if (accSize + tabSize / 2 <= availableSpace) {
|
|
8624
|
+
accSize += tabSize;
|
|
8103
8625
|
insertionIndex = i + 1;
|
|
8104
8626
|
} else {
|
|
8105
8627
|
var _insertionIndex2;
|
|
@@ -8110,11 +8632,12 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8110
8632
|
return insertionIndex;
|
|
8111
8633
|
}
|
|
8112
8634
|
/**
|
|
8113
|
-
* Rebuild the accumulated original
|
|
8114
|
-
* tabs exactly the way the accumulation loop does, so callers
|
|
8115
|
-
* original
|
|
8635
|
+
* Rebuild the accumulated original main-axis size up to `insertionIndex`,
|
|
8636
|
+
* walking the tabs exactly the way the accumulation loop does, so callers
|
|
8637
|
+
* know the original trailing edge of the chip (if any) that precedes the
|
|
8638
|
+
* insertion slot.
|
|
8116
8639
|
*/
|
|
8117
|
-
|
|
8640
|
+
_accumulatedSizeUpTo(insertionIndex, firstPanelToGroup) {
|
|
8118
8641
|
const animState = this._animState;
|
|
8119
8642
|
const sourceGroupPanelIds = animState.sourceGroupPanelIds;
|
|
8120
8643
|
let accUpTo = 0;
|
|
@@ -8125,11 +8648,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8125
8648
|
if (i >= insertionIndex) break;
|
|
8126
8649
|
const gid = firstPanelToGroup.get(tab.panel.id);
|
|
8127
8650
|
if (gid) {
|
|
8128
|
-
var _animState$
|
|
8129
|
-
accUpTo += (_animState$
|
|
8651
|
+
var _animState$chipSizes$2;
|
|
8652
|
+
accUpTo += (_animState$chipSizes$2 = animState.chipSizes.get(gid)) !== null && _animState$chipSizes$2 !== void 0 ? _animState$chipSizes$2 : 0;
|
|
8130
8653
|
}
|
|
8131
8654
|
const origRect = animState.tabPositions.get(tab.panel.id);
|
|
8132
|
-
accUpTo += origRect ? origRect
|
|
8655
|
+
accUpTo += this._mainAxisSize(origRect !== null && origRect !== void 0 ? origRect : tab.element.getBoundingClientRect());
|
|
8133
8656
|
}
|
|
8134
8657
|
return accUpTo;
|
|
8135
8658
|
}
|
|
@@ -8137,11 +8660,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8137
8660
|
* Given a raw insertion index, snap it out of / into any tab group it falls
|
|
8138
8661
|
* within and resolve the target group (if the drop should merge into one).
|
|
8139
8662
|
*/
|
|
8140
|
-
_resolveInsertionAgainstTabGroups(
|
|
8663
|
+
_resolveInsertionAgainstTabGroups(mousePos, insertionIndex, firstPanelToGroup) {
|
|
8141
8664
|
const isGroupDrag = !!this._animState.sourceTabGroupId;
|
|
8142
|
-
const accUpTo = this.
|
|
8665
|
+
const accUpTo = this._accumulatedSizeUpTo(insertionIndex, firstPanelToGroup);
|
|
8143
8666
|
for (const tg of this.group.model.getTabGroups()) {
|
|
8144
|
-
const resolved = this._evaluateTabGroupForInsertion(tg,
|
|
8667
|
+
const resolved = this._evaluateTabGroupForInsertion(tg, mousePos, insertionIndex, accUpTo, isGroupDrag);
|
|
8145
8668
|
if (resolved) return resolved;
|
|
8146
8669
|
}
|
|
8147
8670
|
return {
|
|
@@ -8155,7 +8678,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8155
8678
|
* group governs the slot (the caller stops iterating), or `null` when the
|
|
8156
8679
|
* group is irrelevant and the caller should keep looking.
|
|
8157
8680
|
*/
|
|
8158
|
-
_evaluateTabGroupForInsertion(tg,
|
|
8681
|
+
_evaluateTabGroupForInsertion(tg, mousePos, insertionIndex, accUpTo, isGroupDrag) {
|
|
8159
8682
|
const range = this._resolveGroupRange(tg);
|
|
8160
8683
|
if (!range) return null;
|
|
8161
8684
|
const { firstIdx, lastIdx } = range;
|
|
@@ -8163,7 +8686,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8163
8686
|
const isJustBeforeGroup = !isInsideRange && insertionIndex === firstIdx - 1;
|
|
8164
8687
|
if (!isInsideRange && !isJustBeforeGroup) return null;
|
|
8165
8688
|
if (isGroupDrag) return this._resolveGroupDragTarget(insertionIndex, firstIdx, lastIdx, isInsideRange);
|
|
8166
|
-
return this._resolveTabDragTarget(tg,
|
|
8689
|
+
return this._resolveTabDragTarget(tg, mousePos, insertionIndex, accUpTo, firstIdx, isJustBeforeGroup);
|
|
8167
8690
|
}
|
|
8168
8691
|
/**
|
|
8169
8692
|
* The index range this group occupies in the live tab list, excluding the
|
|
@@ -8198,13 +8721,13 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8198
8721
|
}
|
|
8199
8722
|
/** Insertion target for a single-tab drag against a group: decide whether
|
|
8200
8723
|
* the drop merges into the group based on the cursor vs the chip edge. */
|
|
8201
|
-
_resolveTabDragTarget(tg,
|
|
8202
|
-
var _animState$
|
|
8724
|
+
_resolveTabDragTarget(tg, mousePos, insertionIndex, accUpTo, firstIdx, isJustBeforeGroup) {
|
|
8725
|
+
var _animState$chipSizes$3;
|
|
8203
8726
|
const animState = this._animState;
|
|
8204
|
-
const
|
|
8727
|
+
const chipSize = (_animState$chipSizes$3 = animState.chipSizes.get(tg.id)) !== null && _animState$chipSizes$3 !== void 0 ? _animState$chipSizes$3 : 0;
|
|
8205
8728
|
if (isJustBeforeGroup) {
|
|
8206
8729
|
if (!this._onlySourceBetween(insertionIndex, firstIdx)) return null;
|
|
8207
|
-
if (
|
|
8730
|
+
if (mousePos >= (tg.collapsed ? animState.containerStart + accUpTo + chipSize / 2 : animState.containerStart + accUpTo + chipSize)) return {
|
|
8208
8731
|
insertionIndex: firstIdx,
|
|
8209
8732
|
targetTabGroupId: tg.id
|
|
8210
8733
|
};
|
|
@@ -8213,10 +8736,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8213
8736
|
targetTabGroupId: null
|
|
8214
8737
|
};
|
|
8215
8738
|
}
|
|
8216
|
-
const
|
|
8739
|
+
const chipOriginalEnd = animState.containerStart + accUpTo + chipSize;
|
|
8217
8740
|
if (insertionIndex === firstIdx) return {
|
|
8218
8741
|
insertionIndex,
|
|
8219
|
-
targetTabGroupId:
|
|
8742
|
+
targetTabGroupId: mousePos >= chipOriginalEnd ? tg.id : null
|
|
8220
8743
|
};
|
|
8221
8744
|
return {
|
|
8222
8745
|
insertionIndex,
|
|
@@ -8379,17 +8902,17 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8379
8902
|
}
|
|
8380
8903
|
if (this._pendingCollapse) return;
|
|
8381
8904
|
const insertionIndex = this._animState.currentInsertionIndex;
|
|
8382
|
-
const
|
|
8905
|
+
const gapSize = this._computeGapSize();
|
|
8383
8906
|
const chipToShift = this._computeChipToShift(insertionIndex);
|
|
8384
|
-
this._applyGapMargins(insertionIndex,
|
|
8907
|
+
this._applyGapMargins(insertionIndex, gapSize, chipToShift, skipTransition);
|
|
8385
8908
|
}
|
|
8386
|
-
/** Gap
|
|
8387
|
-
* drag, otherwise the source tab's own
|
|
8388
|
-
|
|
8909
|
+
/** Gap size for the current drag: the whole group's span for a group
|
|
8910
|
+
* drag, otherwise the source tab's own main-axis size. */
|
|
8911
|
+
_computeGapSize() {
|
|
8389
8912
|
const animState = this._animState;
|
|
8390
|
-
if (animState.sourceTabGroupId && animState.sourceGroupPanelIds) return animState.
|
|
8913
|
+
if (animState.sourceTabGroupId && animState.sourceGroupPanelIds) return animState.sourceGapSize;
|
|
8391
8914
|
const sourceRect = animState.tabPositions.get(animState.sourceTabId);
|
|
8392
|
-
return sourceRect ? sourceRect
|
|
8915
|
+
return sourceRect ? this._mainAxisSize(sourceRect) : this.getAverageTabSize();
|
|
8393
8916
|
}
|
|
8394
8917
|
/**
|
|
8395
8918
|
* When the insertion lands at or before a group's first tab, the chip is
|
|
@@ -8433,7 +8956,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8433
8956
|
}
|
|
8434
8957
|
/** Reset non-source chip margins, then apply the gap margin to the chip or
|
|
8435
8958
|
* the first tab at/after the insertion index. */
|
|
8436
|
-
_applyGapMargins(insertionIndex,
|
|
8959
|
+
_applyGapMargins(insertionIndex, gapSize, chipToShift, skipTransition) {
|
|
8437
8960
|
const animState = this._animState;
|
|
8438
8961
|
const sourceGroupPanelIds = animState.sourceGroupPanelIds;
|
|
8439
8962
|
let gapApplied = false;
|
|
@@ -8442,7 +8965,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8442
8965
|
this._clearMargin(entry.chip.element, skipTransition);
|
|
8443
8966
|
}
|
|
8444
8967
|
if (chipToShift) {
|
|
8445
|
-
this._setMargin(chipToShift, `${
|
|
8968
|
+
this._setMargin(chipToShift, `${gapSize}px`, skipTransition);
|
|
8446
8969
|
gapApplied = true;
|
|
8447
8970
|
}
|
|
8448
8971
|
for (let i = 0; i < this._tabs.length; i++) {
|
|
@@ -8450,7 +8973,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8450
8973
|
if (tab.panel.id === animState.sourceTabId) continue;
|
|
8451
8974
|
if (sourceGroupPanelIds === null || sourceGroupPanelIds === void 0 ? void 0 : sourceGroupPanelIds.has(tab.panel.id)) continue;
|
|
8452
8975
|
if (!gapApplied && i >= insertionIndex) {
|
|
8453
|
-
this._setMargin(tab.element, `${
|
|
8976
|
+
this._setMargin(tab.element, `${gapSize}px`, skipTransition);
|
|
8454
8977
|
gapApplied = true;
|
|
8455
8978
|
} else this._clearMargin(tab.element, skipTransition);
|
|
8456
8979
|
}
|
|
@@ -8460,31 +8983,33 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8460
8983
|
_shiftingClass(el) {
|
|
8461
8984
|
return el.classList.contains("dv-tab-group-chip") ? "dv-tab-group-chip--shifting" : "dv-tab--shifting";
|
|
8462
8985
|
}
|
|
8463
|
-
/** Apply
|
|
8986
|
+
/** Apply the main-axis gap margin to an element, optionally bypassing CSS
|
|
8464
8987
|
* transitions for instant positioning. */
|
|
8465
8988
|
_setMargin(el, value, skipTransition) {
|
|
8989
|
+
const property = this._gapMarginProperty;
|
|
8466
8990
|
if (skipTransition) {
|
|
8467
8991
|
el.style.transition = "none";
|
|
8468
|
-
el.style.
|
|
8992
|
+
el.style.setProperty(property, value);
|
|
8469
8993
|
el.getBoundingClientRect();
|
|
8470
8994
|
el.style.removeProperty("transition");
|
|
8471
|
-
} else el.style.
|
|
8995
|
+
} else el.style.setProperty(property, value);
|
|
8472
8996
|
toggleClass(el, this._shiftingClass(el), true);
|
|
8473
8997
|
}
|
|
8474
8998
|
/** Clear an element's gap margin, animating it back to zero unless
|
|
8475
8999
|
* transitions are skipped. */
|
|
8476
9000
|
_clearMargin(el, skipTransition) {
|
|
8477
9001
|
const cls = this._shiftingClass(el);
|
|
9002
|
+
const property = this._gapMarginProperty;
|
|
8478
9003
|
const prev = this._pendingMarginCleanups.get(el);
|
|
8479
9004
|
if (prev) prev();
|
|
8480
|
-
if (skipTransition || !el.style.
|
|
8481
|
-
el.style.removeProperty(
|
|
9005
|
+
if (skipTransition || !el.style.getPropertyValue(property)) {
|
|
9006
|
+
el.style.removeProperty(property);
|
|
8482
9007
|
toggleClass(el, cls, false);
|
|
8483
9008
|
} else {
|
|
8484
|
-
el.style.
|
|
9009
|
+
el.style.setProperty(property, "0px");
|
|
8485
9010
|
toggleClass(el, cls, true);
|
|
8486
9011
|
const onEnd = () => {
|
|
8487
|
-
el.style.removeProperty(
|
|
9012
|
+
el.style.removeProperty(property);
|
|
8488
9013
|
toggleClass(el, cls, false);
|
|
8489
9014
|
el.removeEventListener("transitionend", onEnd);
|
|
8490
9015
|
clearTimeout(fallbackTimer);
|
|
@@ -8509,6 +9034,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
8509
9034
|
}
|
|
8510
9035
|
for (const [, entry] of this._tabGroupManager.chipRenderers) {
|
|
8511
9036
|
entry.chip.element.style.removeProperty("margin-left");
|
|
9037
|
+
entry.chip.element.style.removeProperty("margin-top");
|
|
8512
9038
|
toggleClass(entry.chip.element, "dv-tab-group-chip--shifting", false);
|
|
8513
9039
|
}
|
|
8514
9040
|
this._tabGroupManager.positionUnderlines();
|
|
@@ -9103,21 +9629,21 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9103
9629
|
panel
|
|
9104
9630
|
});
|
|
9105
9631
|
if (((_this$accessor$option2 = this.accessor.options.theme) === null || _this$accessor$option2 === void 0 ? void 0 : _this$accessor$option2.tabAnimation) === "smooth") {
|
|
9106
|
-
const
|
|
9632
|
+
const tabSize = mainAxisSize(tab.element.getBoundingClientRect(), this._direction);
|
|
9107
9633
|
const sourceIndex = this._tabs.findIndex((x) => x.value === tab);
|
|
9108
9634
|
this._animState = {
|
|
9109
9635
|
sourceTabId: panel.id,
|
|
9110
9636
|
sourceIndex,
|
|
9111
9637
|
tabPositions: this.snapshotTabPositions(),
|
|
9112
|
-
|
|
9638
|
+
chipSizes: this._tabGroupManager.snapshotChipSizes(),
|
|
9113
9639
|
currentInsertionIndex: null,
|
|
9114
9640
|
targetTabGroupId: null,
|
|
9115
9641
|
sourceTabGroupId: null,
|
|
9116
9642
|
sourceGroupPanelIds: null,
|
|
9117
|
-
|
|
9118
|
-
|
|
9119
|
-
|
|
9120
|
-
|
|
9643
|
+
sourceChipSize: 0,
|
|
9644
|
+
cursorOffsetFromDragStart: tabSize / 2,
|
|
9645
|
+
sourceGapSize: tabSize,
|
|
9646
|
+
containerStart: mainAxisStart(this._tabsList.getBoundingClientRect(), this._direction)
|
|
9121
9647
|
};
|
|
9122
9648
|
this._pendingCollapse = true;
|
|
9123
9649
|
requestAnimationFrame(() => {
|
|
@@ -9213,7 +9739,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9213
9739
|
this._tabGroupManager.positionAllChips();
|
|
9214
9740
|
if (this._animState) {
|
|
9215
9741
|
this._animState.tabPositions = this.snapshotTabPositions();
|
|
9216
|
-
this._animState.
|
|
9742
|
+
this._animState.chipSizes = this._tabGroupManager.snapshotChipSizes();
|
|
9217
9743
|
this.applyDragOverTransforms();
|
|
9218
9744
|
}
|
|
9219
9745
|
}
|
|
@@ -9235,7 +9761,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9235
9761
|
}
|
|
9236
9762
|
if (this._animState) {
|
|
9237
9763
|
this._animState.tabPositions = this.snapshotTabPositions();
|
|
9238
|
-
this._animState.
|
|
9764
|
+
this._animState.chipSizes = this._tabGroupManager.snapshotChipSizes();
|
|
9239
9765
|
this.applyDragOverTransforms();
|
|
9240
9766
|
}
|
|
9241
9767
|
}
|
|
@@ -9313,24 +9839,24 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9313
9839
|
const firstPanelId = tabGroup.panelIds[0];
|
|
9314
9840
|
const firstIdx = firstPanelId ? this._tabs.findIndex((t) => t.value.panel.id === firstPanelId) : -1;
|
|
9315
9841
|
const chipRect = chip.element.getBoundingClientRect();
|
|
9316
|
-
let
|
|
9842
|
+
let groupGapSize = mainAxisSize(chipRect, this._direction);
|
|
9317
9843
|
for (const pid of tabGroup.panelIds) {
|
|
9318
9844
|
const tabEntry = this._tabMap.get(pid);
|
|
9319
|
-
if (tabEntry)
|
|
9845
|
+
if (tabEntry) groupGapSize += mainAxisSize(tabEntry.value.element.getBoundingClientRect(), this._direction);
|
|
9320
9846
|
}
|
|
9321
9847
|
this._animState = {
|
|
9322
9848
|
sourceTabId: "",
|
|
9323
9849
|
sourceIndex: firstIdx,
|
|
9324
9850
|
tabPositions: this.snapshotTabPositions(),
|
|
9325
|
-
|
|
9851
|
+
chipSizes: this._tabGroupManager.snapshotChipSizes(),
|
|
9326
9852
|
currentInsertionIndex: null,
|
|
9327
9853
|
targetTabGroupId: null,
|
|
9328
9854
|
sourceTabGroupId: tabGroup.id,
|
|
9329
9855
|
sourceGroupPanelIds: new Set(tabGroup.panelIds),
|
|
9330
|
-
|
|
9331
|
-
|
|
9332
|
-
|
|
9333
|
-
|
|
9856
|
+
sourceChipSize: mainAxisSize(chipRect, this._direction),
|
|
9857
|
+
cursorOffsetFromDragStart: mainAxisCursor(event, this._direction) - mainAxisStart(chipRect, this._direction),
|
|
9858
|
+
sourceGapSize: groupGapSize,
|
|
9859
|
+
containerStart: mainAxisStart(this._tabsList.getBoundingClientRect(), this._direction)
|
|
9334
9860
|
};
|
|
9335
9861
|
if (((_this$accessor$option4 = this.accessor.options.theme) === null || _this$accessor$option4 === void 0 ? void 0 : _this$accessor$option4.tabAnimation) !== "smooth") return;
|
|
9336
9862
|
const groupPanelIds = new Set(tabGroup.panelIds);
|
|
@@ -9711,16 +10237,21 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9711
10237
|
y: event.clientY,
|
|
9712
10238
|
zIndex: (relativeParent === null || relativeParent === void 0 ? void 0 : relativeParent.style.zIndex) ? `calc(${relativeParent.style.zIndex} * 2)` : void 0
|
|
9713
10239
|
};
|
|
9714
|
-
const context = this.createOverflowRenderContext(root, anchor);
|
|
10240
|
+
const { context, rowRenderers } = this.createOverflowRenderContext(root, anchor);
|
|
9715
10241
|
const advancedOverflow = this.accessor.advancedOverflowService;
|
|
9716
|
-
|
|
9717
|
-
|
|
9718
|
-
|
|
9719
|
-
|
|
9720
|
-
|
|
9721
|
-
|
|
9722
|
-
|
|
9723
|
-
|
|
10242
|
+
try {
|
|
10243
|
+
if (advancedOverflow) advancedOverflow.renderOverflow({
|
|
10244
|
+
group: this.group,
|
|
10245
|
+
overflowTabs: [...this._overflowTabs],
|
|
10246
|
+
overflowTabGroups: [...this._overflowTabGroups],
|
|
10247
|
+
pinnedOverflowTabs: [...this._overflowPinnedTabs],
|
|
10248
|
+
context
|
|
10249
|
+
});
|
|
10250
|
+
else context.open(this.renderFreeOverflowList(context));
|
|
10251
|
+
} catch (err) {
|
|
10252
|
+
rowRenderers.dispose();
|
|
10253
|
+
throw err;
|
|
10254
|
+
}
|
|
9724
10255
|
}));
|
|
9725
10256
|
}
|
|
9726
10257
|
/**
|
|
@@ -9741,6 +10272,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9741
10272
|
if (overflowGroupSet.has(tg.id)) for (const pid of tg.panelIds) panelToGroup.set(pid, tg);
|
|
9742
10273
|
}
|
|
9743
10274
|
const popup = () => this.accessor.getPopupServiceForGroup(this.group);
|
|
10275
|
+
const rowRenderers = new CompositeDisposable();
|
|
9744
10276
|
const buildGroupHeader = (tg) => {
|
|
9745
10277
|
const groupHeader = document.createElement("div");
|
|
9746
10278
|
groupHeader.className = "dv-tabs-overflow-group-header";
|
|
@@ -9770,69 +10302,87 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
9770
10302
|
return groupHeader;
|
|
9771
10303
|
};
|
|
9772
10304
|
return {
|
|
9773
|
-
|
|
9774
|
-
|
|
9775
|
-
|
|
9776
|
-
|
|
9777
|
-
|
|
9778
|
-
|
|
9779
|
-
|
|
9780
|
-
|
|
9781
|
-
|
|
9782
|
-
|
|
9783
|
-
|
|
9784
|
-
|
|
9785
|
-
|
|
9786
|
-
|
|
9787
|
-
|
|
9788
|
-
|
|
9789
|
-
|
|
9790
|
-
|
|
9791
|
-
|
|
9792
|
-
|
|
9793
|
-
|
|
9794
|
-
|
|
9795
|
-
|
|
9796
|
-
|
|
9797
|
-
|
|
9798
|
-
|
|
9799
|
-
|
|
9800
|
-
|
|
9801
|
-
|
|
9802
|
-
|
|
9803
|
-
|
|
9804
|
-
|
|
9805
|
-
|
|
9806
|
-
|
|
9807
|
-
|
|
9808
|
-
block: "nearest",
|
|
9809
|
-
inline: "nearest"
|
|
10305
|
+
context: {
|
|
10306
|
+
overflowGroupIdForPanel: (panelId) => {
|
|
10307
|
+
var _panelToGroup$get;
|
|
10308
|
+
return (_panelToGroup$get = panelToGroup.get(panelId)) === null || _panelToGroup$get === void 0 ? void 0 : _panelToGroup$get.id;
|
|
10309
|
+
},
|
|
10310
|
+
buildGroupHeader: (tabGroupId) => {
|
|
10311
|
+
const tg = groupById.get(tabGroupId);
|
|
10312
|
+
if (!tg || !overflowGroupSet.has(tg.id)) return;
|
|
10313
|
+
return buildGroupHeader(tg);
|
|
10314
|
+
},
|
|
10315
|
+
buildPinnedHeader: () => {
|
|
10316
|
+
const header = document.createElement("div");
|
|
10317
|
+
header.className = "dv-tabs-overflow-group-header dv-tabs-overflow-pinned-header";
|
|
10318
|
+
const glyph = createPinButton();
|
|
10319
|
+
glyph.classList.add("dv-tabs-overflow-pinned-icon");
|
|
10320
|
+
header.appendChild(glyph);
|
|
10321
|
+
const labelSpan = document.createElement("span");
|
|
10322
|
+
labelSpan.className = "dv-tabs-overflow-group-label";
|
|
10323
|
+
labelSpan.textContent = "Pinned";
|
|
10324
|
+
header.appendChild(labelSpan);
|
|
10325
|
+
return header;
|
|
10326
|
+
},
|
|
10327
|
+
buildRow: (panelId) => {
|
|
10328
|
+
const panel = this.group.panels.find((p) => p.id === panelId);
|
|
10329
|
+
if (!panel) return;
|
|
10330
|
+
const tab = this.tabs.tabs.find((t) => t.panel.id === panelId);
|
|
10331
|
+
const tg = panelToGroup.get(panelId);
|
|
10332
|
+
const tabComponent = panel.view.createTabRenderer("headerOverflow");
|
|
10333
|
+
let rowDisposed = false;
|
|
10334
|
+
const disposeRow = Disposable.from(() => {
|
|
10335
|
+
if (!rowDisposed) {
|
|
10336
|
+
var _tabComponent$dispose;
|
|
10337
|
+
rowDisposed = true;
|
|
10338
|
+
(_tabComponent$dispose = tabComponent.dispose) === null || _tabComponent$dispose === void 0 || _tabComponent$dispose.call(tabComponent);
|
|
10339
|
+
}
|
|
9810
10340
|
});
|
|
9811
|
-
|
|
9812
|
-
|
|
9813
|
-
|
|
9814
|
-
|
|
9815
|
-
|
|
9816
|
-
|
|
9817
|
-
|
|
9818
|
-
|
|
9819
|
-
|
|
9820
|
-
|
|
9821
|
-
|
|
9822
|
-
|
|
10341
|
+
if (rowRenderers.isDisposed) disposeRow.dispose();
|
|
10342
|
+
else rowRenderers.addDisposables(disposeRow);
|
|
10343
|
+
const child = tabComponent.element;
|
|
10344
|
+
const wrapper = document.createElement("div");
|
|
10345
|
+
toggleClass(wrapper, "dv-tab", true);
|
|
10346
|
+
toggleClass(wrapper, "dv-active-tab", panel.api.isActive);
|
|
10347
|
+
toggleClass(wrapper, "dv-inactive-tab", !panel.api.isActive);
|
|
10348
|
+
if (tg) toggleClass(wrapper, "dv-tab--grouped", true);
|
|
10349
|
+
const doActivate = () => {
|
|
10350
|
+
if (tg === null || tg === void 0 ? void 0 : tg.collapsed) tg.expand();
|
|
10351
|
+
tab === null || tab === void 0 || tab.element.scrollIntoView({
|
|
10352
|
+
block: "nearest",
|
|
10353
|
+
inline: "nearest"
|
|
10354
|
+
});
|
|
10355
|
+
this.accessor.withOrigin("user", () => panel.api.setActive());
|
|
10356
|
+
};
|
|
10357
|
+
wrapper.addEventListener("click", (event) => {
|
|
9823
10358
|
popup().close();
|
|
10359
|
+
if (event.defaultPrevented) return;
|
|
9824
10360
|
doActivate();
|
|
9825
|
-
}
|
|
9826
|
-
|
|
9827
|
-
|
|
9828
|
-
|
|
9829
|
-
|
|
10361
|
+
});
|
|
10362
|
+
wrapper.appendChild(child);
|
|
10363
|
+
return {
|
|
10364
|
+
element: wrapper,
|
|
10365
|
+
panel,
|
|
10366
|
+
activate: () => {
|
|
10367
|
+
popup().close();
|
|
10368
|
+
doActivate();
|
|
10369
|
+
},
|
|
10370
|
+
dispose: () => {
|
|
10371
|
+
rowRenderers.removeDisposable(disposeRow);
|
|
10372
|
+
disposeRow.dispose();
|
|
10373
|
+
}
|
|
10374
|
+
};
|
|
10375
|
+
},
|
|
10376
|
+
open: (body) => {
|
|
10377
|
+
popup().openPopover(body, anchor, { onClose: () => rowRenderers.dispose() });
|
|
10378
|
+
},
|
|
10379
|
+
close: () => popup().close(),
|
|
10380
|
+
focusTrigger: () => {
|
|
10381
|
+
root.tabIndex = -1;
|
|
10382
|
+
root.focus();
|
|
10383
|
+
}
|
|
9830
10384
|
},
|
|
9831
|
-
|
|
9832
|
-
focusTrigger: () => {
|
|
9833
|
-
root.tabIndex = -1;
|
|
9834
|
-
root.focus();
|
|
9835
|
-
}
|
|
10385
|
+
rowRenderers
|
|
9836
10386
|
};
|
|
9837
10387
|
}
|
|
9838
10388
|
/**
|
|
@@ -10088,8 +10638,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
10088
10638
|
return this.tabsContainer.getPanelForTab(element);
|
|
10089
10639
|
}
|
|
10090
10640
|
get isContentFocused() {
|
|
10091
|
-
|
|
10092
|
-
|
|
10641
|
+
const element = this.contentContainer.element;
|
|
10642
|
+
const activeElement = getActiveElement(element);
|
|
10643
|
+
if (!activeElement) return false;
|
|
10644
|
+
return isAncestor(activeElement, element);
|
|
10093
10645
|
}
|
|
10094
10646
|
get headerPosition() {
|
|
10095
10647
|
var _this$_headerPosition;
|
|
@@ -10747,6 +11299,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
10747
11299
|
this.tabsContainer.setRightActionsElement(element);
|
|
10748
11300
|
}
|
|
10749
11301
|
setActive(isGroupActive, force = false) {
|
|
11302
|
+
if (this.isDisposed) return;
|
|
10750
11303
|
if (!force && this.isActive === isGroupActive) return;
|
|
10751
11304
|
this._isGroupActive = isGroupActive;
|
|
10752
11305
|
toggleClass(this.container, "dv-active-group", isGroupActive);
|
|
@@ -13000,6 +13553,12 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13000
13553
|
observer.observe(gridview.element);
|
|
13001
13554
|
return { dispose: () => observer.disconnect() };
|
|
13002
13555
|
}
|
|
13556
|
+
/**
|
|
13557
|
+
* Runs `work` after `delayMs`, resolving once it has finished. Work that
|
|
13558
|
+
* returns a promise is awaited, so a caller holding
|
|
13559
|
+
* `restorationPromise` waits for the popout window itself rather than
|
|
13560
|
+
* only for the timer that starts it.
|
|
13561
|
+
*/
|
|
13003
13562
|
scheduleRestoration(delayMs, work, onCancel) {
|
|
13004
13563
|
return new Promise((resolve) => {
|
|
13005
13564
|
const cleanup = () => {
|
|
@@ -13014,8 +13573,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13014
13573
|
resolve();
|
|
13015
13574
|
return;
|
|
13016
13575
|
}
|
|
13017
|
-
work();
|
|
13018
|
-
resolve();
|
|
13576
|
+
Promise.resolve(work()).then(() => resolve(), () => resolve());
|
|
13019
13577
|
}, delayMs);
|
|
13020
13578
|
this._restorationCleanups.add(cleanup);
|
|
13021
13579
|
});
|
|
@@ -13786,13 +14344,14 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13786
14344
|
* menu passes the `tabGroup`. No-op when no renderer could be created (no
|
|
13787
14345
|
* factory configured, or the factory declined the component).
|
|
13788
14346
|
*/
|
|
13789
|
-
appendComponentItem(menuEl, item, identity, group, close) {
|
|
14347
|
+
appendComponentItem(menuEl, item, identity, group, close, renderers) {
|
|
13790
14348
|
var _this$accessor$option4, _this$accessor$option5;
|
|
13791
14349
|
const renderer = (_this$accessor$option4 = (_this$accessor$option5 = this.accessor.options).createContextMenuItemComponent) === null || _this$accessor$option4 === void 0 ? void 0 : _this$accessor$option4.call(_this$accessor$option5, {
|
|
13792
14350
|
id: nextContextMenuItemId(),
|
|
13793
14351
|
component: item.component
|
|
13794
14352
|
});
|
|
13795
14353
|
if (!renderer) return;
|
|
14354
|
+
renderers.addDisposables(renderer);
|
|
13796
14355
|
renderer.init(_objectSpread2(_objectSpread2({}, identity), {}, {
|
|
13797
14356
|
group,
|
|
13798
14357
|
api: this.accessor.api,
|
|
@@ -13843,9 +14402,9 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13843
14402
|
* default row; an item carrying none of the three renders nothing. Shared
|
|
13844
14403
|
* by both menus, which differ only in `identity`.
|
|
13845
14404
|
*/
|
|
13846
|
-
appendConfigItem(menuEl, item, identity, group, close) {
|
|
14405
|
+
appendConfigItem(menuEl, item, identity, group, close, renderers) {
|
|
13847
14406
|
if (item.element) menuEl.appendChild(item.element);
|
|
13848
|
-
else if (item.component) this.appendComponentItem(menuEl, item, identity, group, close);
|
|
14407
|
+
else if (item.component) this.appendComponentItem(menuEl, item, identity, group, close, renderers);
|
|
13849
14408
|
else if (item.label) menuEl.appendChild(buildItem(item.label, close, () => {
|
|
13850
14409
|
var _item$action;
|
|
13851
14410
|
return (_item$action = item.action) === null || _item$action === void 0 ? void 0 : _item$action.call(item);
|
|
@@ -13857,22 +14416,28 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13857
14416
|
event.preventDefault();
|
|
13858
14417
|
const popupService = this.accessor.getPopupServiceForGroup(group);
|
|
13859
14418
|
const close = () => popupService.close();
|
|
14419
|
+
const renderers = new CompositeDisposable();
|
|
13860
14420
|
const menuEl = document.createElement("div");
|
|
13861
14421
|
menuEl.className = "dv-context-menu";
|
|
13862
14422
|
menuEl.setAttribute("role", "menu");
|
|
13863
|
-
|
|
13864
|
-
|
|
13865
|
-
|
|
13866
|
-
|
|
14423
|
+
try {
|
|
14424
|
+
for (const item of items) {
|
|
14425
|
+
if (isItemConfig(item)) {
|
|
14426
|
+
this.appendConfigItem(menuEl, item, { panel }, group, close, renderers);
|
|
14427
|
+
continue;
|
|
14428
|
+
}
|
|
14429
|
+
const el = this.buildBuiltInTabItem(item, panel, group, close);
|
|
14430
|
+
if (el) menuEl.appendChild(el);
|
|
13867
14431
|
}
|
|
13868
|
-
|
|
13869
|
-
|
|
14432
|
+
} catch (err) {
|
|
14433
|
+
renderers.dispose();
|
|
14434
|
+
throw err;
|
|
13870
14435
|
}
|
|
13871
14436
|
popupService.openPopover(menuEl, {
|
|
13872
14437
|
x: event.clientX,
|
|
13873
14438
|
y: event.clientY,
|
|
13874
14439
|
zIndex: popoverZIndexFor(event.target, group)
|
|
13875
|
-
});
|
|
14440
|
+
}, { onClose: () => renderers.dispose() });
|
|
13876
14441
|
}
|
|
13877
14442
|
showForChip(tabGroup, group, event) {
|
|
13878
14443
|
if (!this.accessor.options.getTabGroupChipContextMenuItems) return;
|
|
@@ -13886,22 +14451,28 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
13886
14451
|
event.preventDefault();
|
|
13887
14452
|
const popupService = this.accessor.getPopupServiceForGroup(group);
|
|
13888
14453
|
const close = () => popupService.close();
|
|
14454
|
+
const renderers = new CompositeDisposable();
|
|
13889
14455
|
const menuEl = document.createElement("div");
|
|
13890
14456
|
menuEl.className = "dv-context-menu";
|
|
13891
14457
|
menuEl.setAttribute("role", "menu");
|
|
13892
|
-
|
|
13893
|
-
|
|
13894
|
-
|
|
13895
|
-
|
|
13896
|
-
|
|
13897
|
-
|
|
13898
|
-
|
|
13899
|
-
|
|
14458
|
+
try {
|
|
14459
|
+
for (const item of items) if (item === "separator") menuEl.appendChild(buildSeparator());
|
|
14460
|
+
else if (item === "rename") menuEl.appendChild(buildRenameInput(tabGroup));
|
|
14461
|
+
else if (item === "colorPicker") menuEl.appendChild(buildColorPicker(tabGroup, this.accessor.tabGroupColorPalette));
|
|
14462
|
+
else if (item === "collapse") menuEl.appendChild(this.buildCollapseItem(tabGroup, close));
|
|
14463
|
+
else if (item === "close") menuEl.appendChild(buildItem("Close All", close, () => {
|
|
14464
|
+
group.panels.filter((p) => tabGroup.containsPanel(p.id)).forEach((p) => p.api.close());
|
|
14465
|
+
}));
|
|
14466
|
+
else if (isItemConfig(item)) this.appendConfigItem(menuEl, item, { tabGroup }, group, close, renderers);
|
|
14467
|
+
} catch (err) {
|
|
14468
|
+
renderers.dispose();
|
|
14469
|
+
throw err;
|
|
14470
|
+
}
|
|
13900
14471
|
popupService.openPopover(menuEl, {
|
|
13901
14472
|
x: event.clientX,
|
|
13902
14473
|
y: event.clientY,
|
|
13903
14474
|
zIndex: popoverZIndexFor(event.target, group)
|
|
13904
|
-
});
|
|
14475
|
+
}, { onClose: () => renderers.dispose() });
|
|
13905
14476
|
}
|
|
13906
14477
|
};
|
|
13907
14478
|
const ContextMenuModule = defineModule({
|
|
@@ -14191,6 +14762,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14191
14762
|
const observerDisposable = new MutableDisposable();
|
|
14192
14763
|
const correctLayerPosition = () => {
|
|
14193
14764
|
if (panel.api.location.type === "floating") queueMicrotask(() => {
|
|
14765
|
+
if (disposable.isDisposed) return;
|
|
14194
14766
|
const floatingGroup = this.accessor.getFloatingWindowForGroup(panel.api.group);
|
|
14195
14767
|
if (!floatingGroup) return;
|
|
14196
14768
|
const element = floatingGroup.overlay.element;
|
|
@@ -14273,188 +14845,6 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14273
14845
|
}
|
|
14274
14846
|
};
|
|
14275
14847
|
|
|
14276
|
-
//#endregion
|
|
14277
|
-
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/asyncToGenerator.js
|
|
14278
|
-
function asyncGeneratorStep(n, t, e, r, o, a, c) {
|
|
14279
|
-
try {
|
|
14280
|
-
var i = n[a](c), u = i.value;
|
|
14281
|
-
} catch (n) {
|
|
14282
|
-
e(n);
|
|
14283
|
-
return;
|
|
14284
|
-
}
|
|
14285
|
-
i.done ? t(u) : Promise.resolve(u).then(r, o);
|
|
14286
|
-
}
|
|
14287
|
-
function _asyncToGenerator(n) {
|
|
14288
|
-
return function() {
|
|
14289
|
-
var t = this, e = arguments;
|
|
14290
|
-
return new Promise(function(r, o) {
|
|
14291
|
-
var a = n.apply(t, e);
|
|
14292
|
-
function _next(n) {
|
|
14293
|
-
asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
|
|
14294
|
-
}
|
|
14295
|
-
function _throw(n) {
|
|
14296
|
-
asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
|
|
14297
|
-
}
|
|
14298
|
-
_next(void 0);
|
|
14299
|
-
});
|
|
14300
|
-
};
|
|
14301
|
-
}
|
|
14302
|
-
|
|
14303
|
-
//#endregion
|
|
14304
|
-
//#region src/popoutWindow.ts
|
|
14305
|
-
/**
|
|
14306
|
-
* Reject popout URLs that aren't same-origin http(s). Blocks `javascript:`,
|
|
14307
|
-
* `data:`, `blob:`, `vbscript:`, and cross-origin URLs that would otherwise
|
|
14308
|
-
* execute in a context the browser still associates with the opener via
|
|
14309
|
-
* `window.opener`.
|
|
14310
|
-
*/
|
|
14311
|
-
function assertSameOriginPopoutUrl(url) {
|
|
14312
|
-
let resolved;
|
|
14313
|
-
try {
|
|
14314
|
-
resolved = new URL(url, globalThis.location.href);
|
|
14315
|
-
} catch (_unused) {
|
|
14316
|
-
throw new Error(`dockview: invalid popout URL: ${url}`);
|
|
14317
|
-
}
|
|
14318
|
-
if (!(resolved.protocol === "http:" || resolved.protocol === "https:") || resolved.origin !== globalThis.location.origin) throw new Error(`dockview: popout URL must be same-origin http(s); got: ${url}`);
|
|
14319
|
-
}
|
|
14320
|
-
var PopoutWindow = class extends CompositeDisposable {
|
|
14321
|
-
get window() {
|
|
14322
|
-
var _this$_window$value, _this$_window;
|
|
14323
|
-
return (_this$_window$value = (_this$_window = this._window) === null || _this$_window === void 0 ? void 0 : _this$_window.value) !== null && _this$_window$value !== void 0 ? _this$_window$value : null;
|
|
14324
|
-
}
|
|
14325
|
-
constructor(target, className, options) {
|
|
14326
|
-
super();
|
|
14327
|
-
this.target = target;
|
|
14328
|
-
this.className = className;
|
|
14329
|
-
this.options = options;
|
|
14330
|
-
this._onWillClose = new Emitter();
|
|
14331
|
-
this.onWillClose = this._onWillClose.event;
|
|
14332
|
-
this._onDidClose = new Emitter();
|
|
14333
|
-
this.onDidClose = this._onDidClose.event;
|
|
14334
|
-
this._window = null;
|
|
14335
|
-
this.addDisposables(this._onWillClose, this._onDidClose, { dispose: () => {
|
|
14336
|
-
this.close();
|
|
14337
|
-
} });
|
|
14338
|
-
}
|
|
14339
|
-
dimensions() {
|
|
14340
|
-
if (!this._window) return null;
|
|
14341
|
-
const left = this._window.value.screenX;
|
|
14342
|
-
return {
|
|
14343
|
-
top: this._window.value.screenY,
|
|
14344
|
-
left,
|
|
14345
|
-
width: this._window.value.innerWidth,
|
|
14346
|
-
height: this._window.value.innerHeight
|
|
14347
|
-
};
|
|
14348
|
-
}
|
|
14349
|
-
close() {
|
|
14350
|
-
if (this._window) {
|
|
14351
|
-
var _this$options$onWillC, _this$options;
|
|
14352
|
-
this._onWillClose.fire();
|
|
14353
|
-
(_this$options$onWillC = (_this$options = this.options).onWillClose) === null || _this$options$onWillC === void 0 || _this$options$onWillC.call(_this$options, {
|
|
14354
|
-
id: this.target,
|
|
14355
|
-
window: this._window.value
|
|
14356
|
-
});
|
|
14357
|
-
this._window.disposable.dispose();
|
|
14358
|
-
this._window = null;
|
|
14359
|
-
this._onDidClose.fire();
|
|
14360
|
-
}
|
|
14361
|
-
}
|
|
14362
|
-
open() {
|
|
14363
|
-
var _this = this;
|
|
14364
|
-
return _asyncToGenerator(function* () {
|
|
14365
|
-
var _this$options$onDidOp, _this$options2;
|
|
14366
|
-
if (_this._window) throw new Error("instance of popout window is already open");
|
|
14367
|
-
const url = `${_this.options.url}`;
|
|
14368
|
-
assertSameOriginPopoutUrl(url);
|
|
14369
|
-
const features = Object.entries({
|
|
14370
|
-
top: _this.options.top,
|
|
14371
|
-
left: _this.options.left,
|
|
14372
|
-
width: _this.options.width,
|
|
14373
|
-
height: _this.options.height
|
|
14374
|
-
}).map(([key, value]) => `${key}=${value}`).join(",");
|
|
14375
|
-
/**
|
|
14376
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/open
|
|
14377
|
-
*/
|
|
14378
|
-
const externalWindow = window.open(url, _this.target, features);
|
|
14379
|
-
if (!externalWindow)
|
|
14380
|
-
/**
|
|
14381
|
-
* Popup blocked
|
|
14382
|
-
*/
|
|
14383
|
-
return null;
|
|
14384
|
-
const disposable = new CompositeDisposable();
|
|
14385
|
-
_this._window = {
|
|
14386
|
-
value: externalWindow,
|
|
14387
|
-
disposable
|
|
14388
|
-
};
|
|
14389
|
-
disposable.addDisposables(Disposable.from(() => {
|
|
14390
|
-
externalWindow.close();
|
|
14391
|
-
}), addDisposableListener(globalThis.window, "beforeunload", () => {
|
|
14392
|
-
/**
|
|
14393
|
-
* before the main window closes we should close this popup too
|
|
14394
|
-
* to be good citizens
|
|
14395
|
-
*
|
|
14396
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
14397
|
-
*/
|
|
14398
|
-
_this.close();
|
|
14399
|
-
}));
|
|
14400
|
-
const container = _this.createPopoutWindowContainer();
|
|
14401
|
-
if (_this.className) container.classList.add(_this.className);
|
|
14402
|
-
(_this$options$onDidOp = (_this$options2 = _this.options).onDidOpen) === null || _this$options$onDidOp === void 0 || _this$options$onDidOp.call(_this$options2, {
|
|
14403
|
-
id: _this.target,
|
|
14404
|
-
window: externalWindow
|
|
14405
|
-
});
|
|
14406
|
-
return new Promise((resolve, reject) => {
|
|
14407
|
-
externalWindow.addEventListener("unload", () => {});
|
|
14408
|
-
/**
|
|
14409
|
-
* `load` is the only event that resolves this promise with a
|
|
14410
|
-
* container, so a window that goes away first would leave the
|
|
14411
|
-
* caller awaiting a promise that never settles - and
|
|
14412
|
-
* `addPopoutGroup` holds its layout transaction open until it does.
|
|
14413
|
-
* Settle with `null` on close, the same signal a blocked popup
|
|
14414
|
-
* gives and one the caller already handles. `resolve` after the
|
|
14415
|
-
* fact is a no-op, so a `load` that arrived first still wins.
|
|
14416
|
-
*/
|
|
14417
|
-
disposable.addDisposables(_this.onWillClose(() => resolve(null)));
|
|
14418
|
-
externalWindow.addEventListener("load", () => {
|
|
14419
|
-
/**
|
|
14420
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
|
|
14421
|
-
*/
|
|
14422
|
-
try {
|
|
14423
|
-
const externalDocument = externalWindow.document;
|
|
14424
|
-
externalDocument.title = document.title;
|
|
14425
|
-
externalDocument.body.appendChild(container);
|
|
14426
|
-
addStyles(externalDocument, globalThis.document.styleSheets, { nonce: _this.options.nonce });
|
|
14427
|
-
/**
|
|
14428
|
-
* beforeunload must be registered after load for reasons I could not determine
|
|
14429
|
-
* otherwise the beforeunload event will not fire when the window is closed
|
|
14430
|
-
*/
|
|
14431
|
-
addDisposableListener(externalWindow, "beforeunload", () => {
|
|
14432
|
-
/**
|
|
14433
|
-
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
14434
|
-
*/
|
|
14435
|
-
_this.close();
|
|
14436
|
-
});
|
|
14437
|
-
resolve(container);
|
|
14438
|
-
} catch (err) {
|
|
14439
|
-
reject(err);
|
|
14440
|
-
}
|
|
14441
|
-
});
|
|
14442
|
-
});
|
|
14443
|
-
})();
|
|
14444
|
-
}
|
|
14445
|
-
createPopoutWindowContainer() {
|
|
14446
|
-
const el = document.createElement("div");
|
|
14447
|
-
el.classList.add("dv-popout-window");
|
|
14448
|
-
el.id = "dv-popout-window";
|
|
14449
|
-
el.style.position = "absolute";
|
|
14450
|
-
el.style.width = "100%";
|
|
14451
|
-
el.style.height = "100%";
|
|
14452
|
-
el.style.top = "0px";
|
|
14453
|
-
el.style.left = "0px";
|
|
14454
|
-
return el;
|
|
14455
|
-
}
|
|
14456
|
-
};
|
|
14457
|
-
|
|
14458
14848
|
//#endregion
|
|
14459
14849
|
//#region src/dockview/strictEventsSequencing.ts
|
|
14460
14850
|
var StrictEventsSequencing = class extends CompositeDisposable {
|
|
@@ -14498,8 +14888,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14498
14888
|
* peeks): while it lives it watches a configurable set of dismiss signals
|
|
14499
14889
|
* (Escape / extra keys, outside-pointerdown with an optional grace window,
|
|
14500
14890
|
* window resize, focus moving outside) and calls `onDismiss`. Inside/outside is
|
|
14501
|
-
* decided by an `isInside` predicate (geometry) or
|
|
14502
|
-
* `elements`. Dispose to detach every listener.
|
|
14891
|
+
* decided by an `isInside` predicate (geometry) or by checking the event's
|
|
14892
|
+
* composed path against `elements`. Dispose to detach every listener.
|
|
14503
14893
|
*
|
|
14504
14894
|
* It owns only the *signals*, not the surface element, its position, or any
|
|
14505
14895
|
* hover/keep-open policy, so callers keep their own element lifecycle and
|
|
@@ -14519,9 +14909,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14519
14909
|
const isInside = (event) => {
|
|
14520
14910
|
var _options$elements, _options$elements2;
|
|
14521
14911
|
if (options.isInside) return options.isInside(event);
|
|
14522
|
-
|
|
14523
|
-
if (!(target instanceof Node)) return false;
|
|
14524
|
-
return ((_options$elements = (_options$elements2 = options.elements) === null || _options$elements2 === void 0 ? void 0 : _options$elements2.call(options)) !== null && _options$elements !== void 0 ? _options$elements : []).some((el) => el.contains(target));
|
|
14912
|
+
return isEventWithin(event, (_options$elements = (_options$elements2 = options.elements) === null || _options$elements2 === void 0 ? void 0 : _options$elements2.call(options)) !== null && _options$elements !== void 0 ? _options$elements : []);
|
|
14525
14913
|
};
|
|
14526
14914
|
if (escape || keys.length > 0) disposables.addDisposables(addDisposableListener(win, "keydown", (event) => {
|
|
14527
14915
|
if (escape && event.key === "Escape" || keys.includes(event.key)) options.onDismiss();
|
|
@@ -14540,17 +14928,45 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14540
14928
|
options.onDismiss();
|
|
14541
14929
|
}));
|
|
14542
14930
|
if (options.focusOut) {
|
|
14543
|
-
|
|
14544
|
-
|
|
14545
|
-
|
|
14546
|
-
|
|
14931
|
+
/** A node in the layer's own tree, to scope retargeting and to locate
|
|
14932
|
+
* the shadow roots to listen on. */
|
|
14933
|
+
const layerScope = () => {
|
|
14934
|
+
var _options$anchor, _options$anchor2, _options$elements3;
|
|
14935
|
+
return (_options$anchor = (_options$anchor2 = options.anchor) === null || _options$anchor2 === void 0 ? void 0 : _options$anchor2.call(options)) !== null && _options$anchor !== void 0 ? _options$anchor : (_options$elements3 = options.elements) === null || _options$elements3 === void 0 ? void 0 : _options$elements3.call(options)[0];
|
|
14547
14936
|
};
|
|
14937
|
+
const seen = /* @__PURE__ */ new WeakSet();
|
|
14548
14938
|
const onFocusIn = (event) => {
|
|
14939
|
+
var _options$elements4, _options$elements5;
|
|
14940
|
+
if (seen.has(event)) return;
|
|
14941
|
+
seen.add(event);
|
|
14549
14942
|
const target = event.target;
|
|
14550
|
-
if (target instanceof Element
|
|
14943
|
+
if (!(target instanceof Element)) return;
|
|
14944
|
+
if (!(options.isFocusInside ? options.isFocusInside(retargetInto(target, layerScope())) : isEventWithin(event, (_options$elements4 = (_options$elements5 = options.elements) === null || _options$elements5 === void 0 ? void 0 : _options$elements5.call(options)) !== null && _options$elements4 !== void 0 ? _options$elements4 : []))) options.onDismiss();
|
|
14551
14945
|
};
|
|
14552
|
-
|
|
14553
|
-
|
|
14946
|
+
const bound = /* @__PURE__ */ new Map();
|
|
14947
|
+
const syncShadowRoots = () => {
|
|
14948
|
+
var _options$anchor3, _options$elements6, _options$elements7;
|
|
14949
|
+
const wanted = /* @__PURE__ */ new Set();
|
|
14950
|
+
const anchor = (_options$anchor3 = options.anchor) === null || _options$anchor3 === void 0 ? void 0 : _options$anchor3.call(options);
|
|
14951
|
+
const sources = [...(_options$elements6 = (_options$elements7 = options.elements) === null || _options$elements7 === void 0 ? void 0 : _options$elements7.call(options)) !== null && _options$elements6 !== void 0 ? _options$elements6 : [], ...anchor ? [anchor] : []];
|
|
14952
|
+
for (const node of sources) for (const root of shadowRootsOf(node)) wanted.add(root);
|
|
14953
|
+
for (const [root, listener] of bound) if (!wanted.has(root)) {
|
|
14954
|
+
listener.dispose();
|
|
14955
|
+
bound.delete(root);
|
|
14956
|
+
}
|
|
14957
|
+
for (const root of wanted) {
|
|
14958
|
+
if (bound.has(root)) continue;
|
|
14959
|
+
bound.set(root, addDisposableListener(root, "focusin", onFocusIn, capture));
|
|
14960
|
+
}
|
|
14961
|
+
};
|
|
14962
|
+
disposables.addDisposables(addDisposableListener(win, "focusin", (event) => {
|
|
14963
|
+
syncShadowRoots();
|
|
14964
|
+
onFocusIn(event);
|
|
14965
|
+
}, capture), { dispose: () => {
|
|
14966
|
+
for (const [, listener] of bound) listener.dispose();
|
|
14967
|
+
bound.clear();
|
|
14968
|
+
} });
|
|
14969
|
+
syncShadowRoots();
|
|
14554
14970
|
}
|
|
14555
14971
|
return disposables;
|
|
14556
14972
|
}
|
|
@@ -14581,7 +14997,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14581
14997
|
newRoot.prepend(this._element);
|
|
14582
14998
|
this._root = newRoot;
|
|
14583
14999
|
}
|
|
14584
|
-
openPopover(element, position) {
|
|
15000
|
+
openPopover(element, position, options) {
|
|
14585
15001
|
var _position$zIndex;
|
|
14586
15002
|
this.close();
|
|
14587
15003
|
const wrapper = this._window.document.createElement("div");
|
|
@@ -14596,14 +15012,14 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
14596
15012
|
this._element.appendChild(wrapper);
|
|
14597
15013
|
this._active = wrapper;
|
|
14598
15014
|
const POINTERDOWN_GRACE_MS = 200;
|
|
14599
|
-
this._activeDisposable.value = createDismissableLayer({
|
|
15015
|
+
this._activeDisposable.value = new CompositeDisposable(createDismissableLayer({
|
|
14600
15016
|
window: this._window,
|
|
14601
15017
|
onDismiss: () => this.close(),
|
|
14602
15018
|
elements: () => this._active ? [this._active] : [],
|
|
14603
15019
|
keys: ["Enter"],
|
|
14604
15020
|
pointerDownGraceMs: POINTERDOWN_GRACE_MS,
|
|
14605
15021
|
resize: true
|
|
14606
|
-
});
|
|
15022
|
+
}), (options === null || options === void 0 ? void 0 : options.onClose) ? Disposable.from(options.onClose) : Disposable.NONE);
|
|
14607
15023
|
this._window.requestAnimationFrame(() => {
|
|
14608
15024
|
shiftAbsoluteElementIntoView(wrapper, this._root);
|
|
14609
15025
|
});
|
|
@@ -15043,6 +15459,24 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15043
15459
|
this.updateTheme(this._gap, this._defaultCollapsedSize);
|
|
15044
15460
|
return view;
|
|
15045
15461
|
}
|
|
15462
|
+
/**
|
|
15463
|
+
* Lay out from the shell's current size.
|
|
15464
|
+
*
|
|
15465
|
+
* The ResizeObserver above only reports asynchronously, so between
|
|
15466
|
+
* construction and its first callback the shell believes it has no size -
|
|
15467
|
+
* and any layout built in that window (panels added straight after
|
|
15468
|
+
* `createDockview`, say) resolves its sizes against zero and collapses to
|
|
15469
|
+
* minimums, permanently. Seeding the size synchronously gives that work
|
|
15470
|
+
* the real dimensions. Same guards as the observer: a detached or hidden
|
|
15471
|
+
* shell has no size worth propagating.
|
|
15472
|
+
*/
|
|
15473
|
+
layoutFromElement() {
|
|
15474
|
+
if (!this._shellElement.offsetParent || !isInDocument(this._shellElement)) return;
|
|
15475
|
+
const width = Math.round(this._shellElement.clientWidth);
|
|
15476
|
+
const height = Math.round(this._shellElement.clientHeight);
|
|
15477
|
+
if (width === 0 || height === 0) return;
|
|
15478
|
+
this.layout(width, height);
|
|
15479
|
+
}
|
|
15046
15480
|
layout(width, height) {
|
|
15047
15481
|
this._outerSplitview.layout(width, height);
|
|
15048
15482
|
this._flushPendingSizes();
|
|
@@ -15302,6 +15736,15 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15302
15736
|
|
|
15303
15737
|
//#endregion
|
|
15304
15738
|
//#region src/dockview/dockviewComponent.ts
|
|
15739
|
+
/**
|
|
15740
|
+
* An error says the most about why, so it wins; a blocked window has none, and
|
|
15741
|
+
* its usual cause is more useful than its name.
|
|
15742
|
+
*/
|
|
15743
|
+
function logFailedPopout(failure) {
|
|
15744
|
+
if (failure.error) console.error("dockview: failed to create popout.", failure.error);
|
|
15745
|
+
else if (failure.reason === "blocked") console.error("dockview: failed to create popout. perhaps you need to allow pop-ups for this website");
|
|
15746
|
+
else console.error(`dockview: failed to create popout (${failure.reason}).`);
|
|
15747
|
+
}
|
|
15305
15748
|
function buildTabGroupColorPalette(options) {
|
|
15306
15749
|
var _options$tabGroupColo;
|
|
15307
15750
|
return new TabGroupColorPalette((_options$tabGroupColo = options.tabGroupColors) !== null && _options$tabGroupColo !== void 0 ? _options$tabGroupColo : DEFAULT_TAB_GROUP_COLORS, options.tabGroupAccent !== "off");
|
|
@@ -15353,6 +15796,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15353
15796
|
get panels() {
|
|
15354
15797
|
return this.groups.flatMap((group) => group.panels);
|
|
15355
15798
|
}
|
|
15799
|
+
/** `dndStrategy` resolved against this device; see `DockviewApi`. */
|
|
15800
|
+
get dndCapabilities() {
|
|
15801
|
+
return resolveDndCapabilities(this.options);
|
|
15802
|
+
}
|
|
15356
15803
|
get options() {
|
|
15357
15804
|
return this._options;
|
|
15358
15805
|
}
|
|
@@ -15862,9 +16309,9 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15862
16309
|
return (_this$_popoutWindowSe = (_this$_popoutWindowSe2 = this._popoutWindowService) === null || _this$_popoutWindowSe2 === void 0 ? void 0 : _this$_popoutWindowSe2.restorationPromise) !== null && _this$_popoutWindowSe !== void 0 ? _this$_popoutWindowSe : Promise.resolve();
|
|
15863
16310
|
}
|
|
15864
16311
|
constructor(container, options) {
|
|
15865
|
-
var _options$theme$gap, _options$theme, _options$theme$gap2, _options$theme2, _options$theme3;
|
|
16312
|
+
var _options$proportional, _options$theme$gap, _options$theme, _options$theme$gap2, _options$theme2, _options$theme3;
|
|
15866
16313
|
super(container, {
|
|
15867
|
-
proportionalLayout: true,
|
|
16314
|
+
proportionalLayout: (_options$proportional = options.proportionalLayout) !== null && _options$proportional !== void 0 ? _options$proportional : true,
|
|
15868
16315
|
orientation: "HORIZONTAL",
|
|
15869
16316
|
styles: options.hideBorders ? { separatorBorder: "transparent" } : void 0,
|
|
15870
16317
|
disableAutoResizing: options.disableAutoResizing,
|
|
@@ -15884,7 +16331,9 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15884
16331
|
this._onWillDrop = new Emitter();
|
|
15885
16332
|
this.onWillDrop = this._onWillDrop.event;
|
|
15886
16333
|
this._mutationDepth = 0;
|
|
16334
|
+
this._syncMutationDepth = 0;
|
|
15887
16335
|
this._pendingLocationChanges = /* @__PURE__ */ new Map();
|
|
16336
|
+
this._openingPopoutWindows = /* @__PURE__ */ new Set();
|
|
15888
16337
|
this._origin = "user";
|
|
15889
16338
|
this._originDepth = 0;
|
|
15890
16339
|
this._onWillMutateLayout = new Emitter();
|
|
@@ -15911,6 +16360,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15911
16360
|
this.onDidChangePopouts = this._onDidChangePopouts.event;
|
|
15912
16361
|
this._onDidOpenPopoutWindowFail = new Emitter();
|
|
15913
16362
|
this.onDidOpenPopoutWindowFail = this._onDidOpenPopoutWindowFail.event;
|
|
16363
|
+
this._onWillClosePopoutWindow = new Emitter();
|
|
16364
|
+
this.onWillClosePopoutWindow = this._onWillClosePopoutWindow.event;
|
|
15914
16365
|
this._onDidStartFloatingGroupDrag = new Emitter();
|
|
15915
16366
|
this.onDidStartFloatingGroupDrag = this._onDidStartFloatingGroupDrag.event;
|
|
15916
16367
|
this._onDidEndFloatingGroupDrag = new Emitter();
|
|
@@ -15966,6 +16417,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
15966
16417
|
});
|
|
15967
16418
|
}));
|
|
15968
16419
|
this.popupService = new PopupService(this.element);
|
|
16420
|
+
this.addDisposables(this.popupService, Disposable.from(() => {
|
|
16421
|
+
for (const opening of this._openingPopoutWindows) opening.dispose();
|
|
16422
|
+
this._openingPopoutWindows.clear();
|
|
16423
|
+
}));
|
|
15969
16424
|
this._api = new DockviewApi(this);
|
|
15970
16425
|
this.disableResizing = true;
|
|
15971
16426
|
this.element.remove();
|
|
@@ -16012,7 +16467,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16012
16467
|
var _this$_shellManager2;
|
|
16013
16468
|
this._moduleRegistry.dispose();
|
|
16014
16469
|
(_this$_shellManager2 = this._shellManager) === null || _this$_shellManager2 === void 0 || _this$_shellManager2.dispose();
|
|
16015
|
-
}));
|
|
16470
|
+
}), this._onWillClosePopoutWindow);
|
|
16016
16471
|
const rootDropTarget = this._rootDropTargetService;
|
|
16017
16472
|
if (rootDropTarget) this.addDisposables(rootDropTarget.onWillShowOverlay((event) => {
|
|
16018
16473
|
if (this.gridview.length > 0 && event.position === "center") return;
|
|
@@ -16025,6 +16480,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16025
16480
|
}));
|
|
16026
16481
|
}), rootDropTarget.onDrop((event) => this.dockToLayoutEdge(event.nativeEvent, event.position)));
|
|
16027
16482
|
this._moduleRegistry.postConstruct(this);
|
|
16483
|
+
this._shellManager.layoutFromElement();
|
|
16028
16484
|
}
|
|
16029
16485
|
setVisible(panel, visible) {
|
|
16030
16486
|
switch (panel.api.location.type) {
|
|
@@ -16094,22 +16550,42 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16094
16550
|
const box = getBox();
|
|
16095
16551
|
const groupId = (_options$overridePopo = options === null || options === void 0 || (_options$overridePopo2 = options.overridePopoutGroup) === null || _options$overridePopo2 === void 0 ? void 0 : _options$overridePopo2.id) !== null && _options$overridePopo !== void 0 ? _options$overridePopo : this.getNextGroupId();
|
|
16096
16552
|
const resolvedPopoutUrl = (_options$popoutUrl = options === null || options === void 0 ? void 0 : options.popoutUrl) !== null && _options$popoutUrl !== void 0 ? _options$popoutUrl : (_this$options = this.options) === null || _this$options === void 0 ? void 0 : _this$options.popoutUrl;
|
|
16553
|
+
const popoutUrl = resolvedPopoutUrl !== null && resolvedPopoutUrl !== void 0 ? resolvedPopoutUrl : "/popout.html";
|
|
16097
16554
|
const _window = new PopoutWindow(`${this.id}-${groupId}`, theme !== null && theme !== void 0 ? theme : "", {
|
|
16098
|
-
url:
|
|
16555
|
+
url: popoutUrl,
|
|
16099
16556
|
left: box.left,
|
|
16100
16557
|
top: box.top,
|
|
16101
16558
|
width: box.width,
|
|
16102
16559
|
height: box.height,
|
|
16103
16560
|
onDidOpen: options === null || options === void 0 ? void 0 : options.onDidOpen,
|
|
16104
|
-
onWillClose:
|
|
16105
|
-
|
|
16561
|
+
onWillClose: (event) => {
|
|
16562
|
+
var _options$onWillClose;
|
|
16563
|
+
options === null || options === void 0 || (_options$onWillClose = options.onWillClose) === null || _options$onWillClose === void 0 || _options$onWillClose.call(options, event);
|
|
16564
|
+
this._onWillClosePopoutWindow.fire(event);
|
|
16565
|
+
},
|
|
16566
|
+
nonce: (_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : _this$options2.nonce,
|
|
16567
|
+
styleRoot: () => this.element.getRootNode()
|
|
16106
16568
|
});
|
|
16107
16569
|
const popoutWindowDisposable = new CompositeDisposable(_window, _window.onDidClose(() => {
|
|
16108
16570
|
popoutWindowDisposable.dispose();
|
|
16109
16571
|
}));
|
|
16110
|
-
|
|
16572
|
+
this._openingPopoutWindows.add(popoutWindowDisposable);
|
|
16573
|
+
const openError = getPopoutUrlError(popoutUrl);
|
|
16574
|
+
return (openError ? Promise.resolve(null) : _window.open()).then((popoutContainer) => {
|
|
16111
16575
|
var _options$referenceGro, _options$overridePopo4;
|
|
16112
|
-
|
|
16576
|
+
this._openingPopoutWindows.delete(popoutWindowDisposable);
|
|
16577
|
+
if (this.isDisposed) {
|
|
16578
|
+
popoutWindowDisposable.dispose();
|
|
16579
|
+
return false;
|
|
16580
|
+
}
|
|
16581
|
+
if (_window.isDisposed) {
|
|
16582
|
+
const failure = _window.failure;
|
|
16583
|
+
if (failure && !this.isDisposed) {
|
|
16584
|
+
logFailedPopout(failure);
|
|
16585
|
+
this._onDidOpenPopoutWindowFail.fire(failure);
|
|
16586
|
+
}
|
|
16587
|
+
return false;
|
|
16588
|
+
}
|
|
16113
16589
|
const referenceGroup = (_options$referenceGro = options === null || options === void 0 ? void 0 : options.referenceGroup) !== null && _options$referenceGro !== void 0 ? _options$referenceGro : itemToPopout instanceof DockviewPanel ? itemToPopout.group : itemToPopout;
|
|
16114
16590
|
const referenceLocation = itemToPopout.api.location.type;
|
|
16115
16591
|
/**
|
|
@@ -16128,11 +16604,16 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16128
16604
|
if (popoutContainer) this._onDidAddGroup.fire(group);
|
|
16129
16605
|
}
|
|
16130
16606
|
if (popoutContainer === null) {
|
|
16607
|
+
var _window$failure;
|
|
16131
16608
|
this.handleBlockedPopout({
|
|
16132
16609
|
group,
|
|
16133
16610
|
referenceGroup,
|
|
16134
16611
|
options,
|
|
16135
|
-
popoutWindowDisposable
|
|
16612
|
+
popoutWindowDisposable,
|
|
16613
|
+
failure: openError ? {
|
|
16614
|
+
reason: "url-refused",
|
|
16615
|
+
error: openError
|
|
16616
|
+
} : (_window$failure = _window.failure) !== null && _window$failure !== void 0 ? _window$failure : { reason: "blocked" }
|
|
16136
16617
|
});
|
|
16137
16618
|
return false;
|
|
16138
16619
|
}
|
|
@@ -16290,21 +16771,23 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16290
16771
|
for (const { panel, from } of movedPanels) this.fireDidMovePanel(panel, from);
|
|
16291
16772
|
return true;
|
|
16292
16773
|
}).catch((err) => {
|
|
16774
|
+
this._openingPopoutWindows.delete(popoutWindowDisposable);
|
|
16293
16775
|
console.error("dockview: failed to create popout.", err);
|
|
16294
16776
|
return false;
|
|
16295
16777
|
});
|
|
16296
16778
|
}
|
|
16297
16779
|
/**
|
|
16298
|
-
* The popout window
|
|
16299
|
-
* common when restoring popouts on load)
|
|
16300
|
-
*
|
|
16301
|
-
*
|
|
16780
|
+
* The popout window never opened - blocked by the browser's popup blocker
|
|
16781
|
+
* (common when restoring popouts on load), or refused outright because its
|
|
16782
|
+
* URL failed the same-origin guard. Fall back gracefully so the group(s)
|
|
16783
|
+
* end up valid and visible in the main grid rather than as orphans that
|
|
16784
|
+
* render nothing and later crash clear()/remove().
|
|
16302
16785
|
*/
|
|
16303
16786
|
handleBlockedPopout(params) {
|
|
16304
|
-
const { group, referenceGroup, options, popoutWindowDisposable } = params;
|
|
16305
|
-
|
|
16787
|
+
const { group, referenceGroup, options, popoutWindowDisposable, failure } = params;
|
|
16788
|
+
logFailedPopout(failure);
|
|
16306
16789
|
popoutWindowDisposable.dispose();
|
|
16307
|
-
this._onDidOpenPopoutWindowFail.fire();
|
|
16790
|
+
this._onDidOpenPopoutWindowFail.fire(failure);
|
|
16308
16791
|
if (options === null || options === void 0 ? void 0 : options.overridePopoutGridview) {
|
|
16309
16792
|
const blockedGridview = options.overridePopoutGridview;
|
|
16310
16793
|
const members = this.groups.filter((candidate) => blockedGridview.element.contains(candidate.element));
|
|
@@ -16538,12 +17021,13 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16538
17021
|
if (group.model.size === 0) this.doRemoveGroup(group, { skipActive: true });
|
|
16539
17022
|
}
|
|
16540
17023
|
/**
|
|
16541
|
-
* Build an empty gridview configured to match the main grid's styling
|
|
16542
|
-
* hosting a nested layout inside a floating or popout
|
|
17024
|
+
* Build an empty gridview configured to match the main grid's styling and
|
|
17025
|
+
* resize behaviour, for hosting a nested layout inside a floating or popout
|
|
17026
|
+
* window.
|
|
16543
17027
|
*/
|
|
16544
17028
|
createNestedGridview(orientation = "HORIZONTAL") {
|
|
16545
17029
|
var _this$options$theme$g, _this$options$theme2;
|
|
16546
|
-
return new Gridview(
|
|
17030
|
+
return new Gridview(this.gridview.proportionalLayout, this.options.hideBorders ? { separatorBorder: "transparent" } : void 0, orientation, false, (_this$options$theme$g = (_this$options$theme2 = this.options.theme) === null || _this$options$theme2 === void 0 ? void 0 : _this$options$theme2.gap) !== null && _this$options$theme$g !== void 0 ? _this$options$theme$g : 0);
|
|
16547
17031
|
}
|
|
16548
17032
|
/**
|
|
16549
17033
|
* Wrap a (populated) floating gridview in an overlay window: title bar /
|
|
@@ -16616,6 +17100,12 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16616
17100
|
const newDisableDnd = this.options.disableDnd;
|
|
16617
17101
|
const newDndStrategy = this.options.dndStrategy;
|
|
16618
17102
|
if (oldDisableDnd !== newDisableDnd || oldDndStrategy !== newDndStrategy) this.updateDragAndDropState();
|
|
17103
|
+
if ("proportionalLayout" in options) {
|
|
17104
|
+
var _this$_popoutWindowSe9, _this$_popoutWindowSe10;
|
|
17105
|
+
const proportionalLayout = this.gridview.proportionalLayout;
|
|
17106
|
+
for (const floating of this.floatingGroups) floating.gridview.proportionalLayout = proportionalLayout;
|
|
17107
|
+
for (const entry of (_this$_popoutWindowSe9 = (_this$_popoutWindowSe10 = this._popoutWindowService) === null || _this$_popoutWindowSe10 === void 0 ? void 0 : _this$_popoutWindowSe10.entries) !== null && _this$_popoutWindowSe9 !== void 0 ? _this$_popoutWindowSe9 : []) entry.gridview.proportionalLayout = proportionalLayout;
|
|
17108
|
+
}
|
|
16619
17109
|
if ("theme" in options) this.updateTheme();
|
|
16620
17110
|
if ("createRightHeaderActionComponent" in options || "createLeftHeaderActionComponent" in options || "createPrefixHeaderActionComponent" in options) {
|
|
16621
17111
|
var _this$headerActionsSe;
|
|
@@ -16821,6 +17311,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16821
17311
|
group.dispose();
|
|
16822
17312
|
this._groups.delete(group.id);
|
|
16823
17313
|
this._onDidRemoveGroup.fire(group);
|
|
17314
|
+
this.activateFallbackGroupIfRemoved(group);
|
|
16824
17315
|
});
|
|
16825
17316
|
}
|
|
16826
17317
|
setEdgeGroupCollapsed(group, collapsed) {
|
|
@@ -16923,14 +17414,14 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16923
17414
|
* @returns A JSON respresentation of the layout
|
|
16924
17415
|
*/
|
|
16925
17416
|
toJSON() {
|
|
16926
|
-
var _this$_floatingGroupS3, _this$_floatingGroupS4, _this$
|
|
17417
|
+
var _this$_floatingGroupS3, _this$_floatingGroupS4, _this$_popoutWindowSe11, _this$_popoutWindowSe12, _this$activeGroup2;
|
|
16927
17418
|
const data = this.gridview.serialize();
|
|
16928
17419
|
const panels = this.panels.reduce((collection, panel) => {
|
|
16929
17420
|
collection[panel.id] = panel.toJSON();
|
|
16930
17421
|
return collection;
|
|
16931
17422
|
}, {});
|
|
16932
17423
|
const floats = (_this$_floatingGroupS3 = (_this$_floatingGroupS4 = this._floatingGroupService) === null || _this$_floatingGroupS4 === void 0 ? void 0 : _this$_floatingGroupS4.serialize()) !== null && _this$_floatingGroupS3 !== void 0 ? _this$_floatingGroupS3 : [];
|
|
16933
|
-
const popoutGroups = (_this$
|
|
17424
|
+
const popoutGroups = (_this$_popoutWindowSe11 = (_this$_popoutWindowSe12 = this._popoutWindowService) === null || _this$_popoutWindowSe12 === void 0 ? void 0 : _this$_popoutWindowSe12.serialize()) !== null && _this$_popoutWindowSe11 !== void 0 ? _this$_popoutWindowSe11 : [];
|
|
16934
17425
|
const result = {
|
|
16935
17426
|
grid: data,
|
|
16936
17427
|
panels,
|
|
@@ -16969,8 +17460,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
16969
17460
|
this.mutation("load", () => this._doFromJSON(data, options));
|
|
16970
17461
|
}
|
|
16971
17462
|
_doFromJSON(data, options) {
|
|
16972
|
-
var _this$
|
|
16973
|
-
(_this$
|
|
17463
|
+
var _this$_popoutWindowSe13, _data$grid$root;
|
|
17464
|
+
(_this$_popoutWindowSe13 = this._popoutWindowService) === null || _this$_popoutWindowSe13 === void 0 || _this$_popoutWindowSe13.cancelPendingRestorations();
|
|
16974
17465
|
if (typeof data !== "object" || data === null) throw new Error("dockview: serialized layout must be a non-null object");
|
|
16975
17466
|
if (!data.grid || ((_data$grid$root = data.grid.root) === null || _data$grid$root === void 0 ? void 0 : _data$grid$root.type) !== "branch" || !Array.isArray(data.grid.root.data)) throw new Error("dockview: root must be of type branch");
|
|
16976
17467
|
const existingPanels = /* @__PURE__ */ new Map();
|
|
@@ -17017,6 +17508,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17017
17508
|
const record = this._groups.get(temporaryGroup.api.id);
|
|
17018
17509
|
this._groups.delete(temporaryGroup.api.id);
|
|
17019
17510
|
temporaryGroupDisposables.push(Disposable.from(() => {
|
|
17511
|
+
var _this$headerActionsSe2;
|
|
17020
17512
|
/**
|
|
17021
17513
|
* Reclaim the group's own resources, never its panels.
|
|
17022
17514
|
* Staging is driven by the ids in `data.panels` while
|
|
@@ -17034,6 +17526,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17034
17526
|
for (const panel of temporaryGroup.panels.slice()) temporaryGroup.model.removePanel(panel);
|
|
17035
17527
|
});
|
|
17036
17528
|
record === null || record === void 0 || record.disposable.dispose();
|
|
17529
|
+
(_this$headerActionsSe2 = this.headerActionsService) === null || _this$headerActionsSe2 === void 0 || _this$headerActionsSe2.disposeGroup(temporaryGroup);
|
|
17037
17530
|
temporaryGroup.dispose();
|
|
17038
17531
|
}));
|
|
17039
17532
|
return temporaryGroup;
|
|
@@ -17089,7 +17582,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17089
17582
|
} else this.clear();
|
|
17090
17583
|
const { grid, panels, activeGroup } = data;
|
|
17091
17584
|
try {
|
|
17092
|
-
var _data$floatingGroups, _data$popoutGroups, _this$
|
|
17585
|
+
var _data$floatingGroups, _data$popoutGroups, _this$_popoutWindowSe14, _this$_floatingGroupS5, _this$_watermarkServi2;
|
|
17093
17586
|
const width = this.width;
|
|
17094
17587
|
const height = this.height;
|
|
17095
17588
|
const createGroupFromSerializedState = (data) => {
|
|
@@ -17154,7 +17647,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17154
17647
|
if (data.edgeGroups) this.deserializeEdgeGroups(data.edgeGroups, panels, existingPanels, temporaryGroups);
|
|
17155
17648
|
this.deserializeFloatingWindows((_data$floatingGroups = data.floatingGroups) !== null && _data$floatingGroups !== void 0 ? _data$floatingGroups : [], createGroupFromSerializedState);
|
|
17156
17649
|
const popoutPromises = this.deserializePopoutWindows((_data$popoutGroups = data.popoutGroups) !== null && _data$popoutGroups !== void 0 ? _data$popoutGroups : [], createGroupFromSerializedState);
|
|
17157
|
-
(_this$
|
|
17650
|
+
(_this$_popoutWindowSe14 = this._popoutWindowService) === null || _this$_popoutWindowSe14 === void 0 || _this$_popoutWindowSe14.finishRestoration(popoutPromises);
|
|
17158
17651
|
(_this$_floatingGroupS5 = this._floatingGroupService) === null || _this$_floatingGroupS5 === void 0 || _this$_floatingGroupS5.constrainBounds();
|
|
17159
17652
|
if (typeof activeGroup === "string") {
|
|
17160
17653
|
const panel = this.getPanel(activeGroup);
|
|
@@ -17322,15 +17815,13 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17322
17815
|
}
|
|
17323
17816
|
}
|
|
17324
17817
|
const group = grid ? members[0] : createGroup(data);
|
|
17325
|
-
return popoutService.scheduleRestoration(index * 100, () => {
|
|
17326
|
-
|
|
17327
|
-
|
|
17328
|
-
|
|
17329
|
-
|
|
17330
|
-
|
|
17331
|
-
|
|
17332
|
-
});
|
|
17333
|
-
}, () => {
|
|
17818
|
+
return popoutService.scheduleRestoration(index * 100, () => this.addPopoutGroup(group, {
|
|
17819
|
+
position: position !== null && position !== void 0 ? position : void 0,
|
|
17820
|
+
overridePopoutGroup: gridReferenceGroup ? group : void 0,
|
|
17821
|
+
overridePopoutGridview,
|
|
17822
|
+
referenceGroup: gridReferenceGroup ? this.getPanel(gridReferenceGroup) : void 0,
|
|
17823
|
+
popoutUrl: url
|
|
17824
|
+
}), () => {
|
|
17334
17825
|
for (const orphan of members.length > 0 ? members : [group]) if (!this.isDisposed && this._groups.has(orphan.id) && orphan.element.parentElement === null) {
|
|
17335
17826
|
for (const panel of [...orphan.panels]) this.removePanel(panel, { removeEmptyGroup: false });
|
|
17336
17827
|
orphan.dispose();
|
|
@@ -17565,7 +18056,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17565
18056
|
* window.
|
|
17566
18057
|
*/
|
|
17567
18058
|
detachFromNestedWindow(group) {
|
|
17568
|
-
var _this$_floatingGroupS7, _this$
|
|
18059
|
+
var _this$_floatingGroupS7, _this$_popoutWindowSe15;
|
|
17569
18060
|
const floating = (_this$_floatingGroupS7 = this._floatingGroupService) === null || _this$_floatingGroupS7 === void 0 ? void 0 : _this$_floatingGroupS7.findByGroup(group);
|
|
17570
18061
|
if (floating) {
|
|
17571
18062
|
const members = this.nestedWindowMembers(group);
|
|
@@ -17574,7 +18065,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17574
18065
|
if (floating.group === group) floating.setAnchorGroup(members.find((m) => m !== group));
|
|
17575
18066
|
return true;
|
|
17576
18067
|
}
|
|
17577
|
-
const popout = (_this$
|
|
18068
|
+
const popout = (_this$_popoutWindowSe15 = this._popoutWindowService) === null || _this$_popoutWindowSe15 === void 0 ? void 0 : _this$_popoutWindowSe15.findByGroup(group);
|
|
17578
18069
|
if (popout) {
|
|
17579
18070
|
const members = this.nestedWindowMembers(group);
|
|
17580
18071
|
if (members.length <= 1) return false;
|
|
@@ -17631,8 +18122,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17631
18122
|
return group;
|
|
17632
18123
|
}
|
|
17633
18124
|
if (group.api.location.type === "popout") {
|
|
17634
|
-
var _this$
|
|
17635
|
-
const selectedGroup = (_this$
|
|
18125
|
+
var _this$_popoutWindowSe16, _this$_popoutWindowSe17;
|
|
18126
|
+
const selectedGroup = (_this$_popoutWindowSe16 = this._popoutWindowService) === null || _this$_popoutWindowSe16 === void 0 ? void 0 : _this$_popoutWindowSe16.findByGroup(group);
|
|
17636
18127
|
if (!selectedGroup) throw new Error("dockview: failed to find popout group");
|
|
17637
18128
|
if (this.detachFromNestedWindow(group)) {
|
|
17638
18129
|
if (options === null || options === void 0 ? void 0 : options.skipDispose) group.model.location = { type: "grid" };
|
|
@@ -17649,7 +18140,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17649
18140
|
this._groups.delete(group.id);
|
|
17650
18141
|
this._onDidRemoveGroup.fire(group);
|
|
17651
18142
|
}
|
|
17652
|
-
(_this$
|
|
18143
|
+
(_this$_popoutWindowSe17 = this._popoutWindowService) === null || _this$_popoutWindowSe17 === void 0 || _this$_popoutWindowSe17.remove(selectedGroup);
|
|
17653
18144
|
const removedGroup = selectedGroup.disposable.dispose();
|
|
17654
18145
|
if (!(options === null || options === void 0 ? void 0 : options.skipPopoutReturn) && removedGroup) {
|
|
17655
18146
|
this.doAddGroup(removedGroup, [0]);
|
|
@@ -17676,10 +18167,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17676
18167
|
debouncedUpdateAllPositions() {
|
|
17677
18168
|
if (this._updatePositionsFrameId !== void 0) cancelAnimationFrame(this._updatePositionsFrameId);
|
|
17678
18169
|
this._updatePositionsFrameId = requestAnimationFrame(() => {
|
|
17679
|
-
var _this$
|
|
18170
|
+
var _this$_popoutWindowSe18, _this$_popoutWindowSe19;
|
|
17680
18171
|
this._updatePositionsFrameId = void 0;
|
|
17681
18172
|
this.overlayRenderContainer.updateAllPositions();
|
|
17682
|
-
for (const entry of (_this$
|
|
18173
|
+
for (const entry of (_this$_popoutWindowSe18 = (_this$_popoutWindowSe19 = this._popoutWindowService) === null || _this$_popoutWindowSe19 === void 0 ? void 0 : _this$_popoutWindowSe19.entries) !== null && _this$_popoutWindowSe18 !== void 0 ? _this$_popoutWindowSe18 : []) entry.overlayRenderContainer.updateAllPositions();
|
|
17683
18174
|
});
|
|
17684
18175
|
}
|
|
17685
18176
|
movingLock(func) {
|
|
@@ -17700,9 +18191,12 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17700
18191
|
*/
|
|
17701
18192
|
mutation(kind, func) {
|
|
17702
18193
|
const close = this.openMutation(kind);
|
|
18194
|
+
this._syncMutationDepth++;
|
|
17703
18195
|
try {
|
|
17704
18196
|
return func();
|
|
17705
18197
|
} finally {
|
|
18198
|
+
this._syncMutationDepth--;
|
|
18199
|
+
if (this._syncMutationDepth === 0) this.releaseDisposedActiveGroup();
|
|
17706
18200
|
close();
|
|
17707
18201
|
}
|
|
17708
18202
|
}
|
|
@@ -17749,6 +18243,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17749
18243
|
return () => {
|
|
17750
18244
|
this._mutationDepth--;
|
|
17751
18245
|
if (this._mutationDepth === 0) {
|
|
18246
|
+
this.releaseDisposedActiveGroup();
|
|
17752
18247
|
this.flushLocationChanges();
|
|
17753
18248
|
this._onDidMutateLayout.fire({
|
|
17754
18249
|
kind,
|
|
@@ -17757,6 +18252,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17757
18252
|
}
|
|
17758
18253
|
};
|
|
17759
18254
|
}
|
|
18255
|
+
/** Covers removals with `skipActive` that disposed the active group. */
|
|
18256
|
+
releaseDisposedActiveGroup() {
|
|
18257
|
+
var _this$_activeGroup;
|
|
18258
|
+
if (!this.isDisposed && ((_this$_activeGroup = this._activeGroup) === null || _this$_activeGroup === void 0 ? void 0 : _this$_activeGroup.model.isDisposed)) this.activateFallbackGroupIfRemoved(this._activeGroup);
|
|
18259
|
+
}
|
|
17760
18260
|
/**
|
|
17761
18261
|
* Coalesce a panel's `onDidLocationChange` to the end of the enclosing
|
|
17762
18262
|
* transaction, or fire it immediately when no transaction is in flight.
|
|
@@ -17894,7 +18394,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17894
18394
|
skipSetActiveGroup: true
|
|
17895
18395
|
}));
|
|
17896
18396
|
if (!removedPanel) throw new Error(`dockview: No panel with id ${sourceItemId}`);
|
|
17897
|
-
if (!options.keepEmptyGroups && sourceGroup.model.size === 0) this.doRemoveGroup(sourceGroup, { skipActive: true });
|
|
18397
|
+
if (!options.keepEmptyGroups && sourceGroup.model.size === 0 && sourceGroup !== destinationGroup) this.doRemoveGroup(sourceGroup, { skipActive: true });
|
|
17898
18398
|
const isDestinationGroupEmpty = destinationGroup.model.size === 0;
|
|
17899
18399
|
this.movingLock(() => {
|
|
17900
18400
|
var _options$skipSetActiv;
|
|
@@ -17929,7 +18429,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17929
18429
|
}
|
|
17930
18430
|
}
|
|
17931
18431
|
if (sourceGroup.api.location.type === "popout" && this.nestedWindowMembers(sourceGroup).length <= 1) {
|
|
17932
|
-
var _this$
|
|
18432
|
+
var _this$_popoutWindowSe20;
|
|
17933
18433
|
/**
|
|
17934
18434
|
* the source group is the only group in a popout window and
|
|
17935
18435
|
* has a single panel
|
|
@@ -17944,7 +18444,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
17944
18444
|
* Multi-group popout windows fall through to the generic
|
|
17945
18445
|
* detach-and-re-add path so the window stays alive.
|
|
17946
18446
|
*/
|
|
17947
|
-
const popoutGroup = (_this$
|
|
18447
|
+
const popoutGroup = (_this$_popoutWindowSe20 = this._popoutWindowService) === null || _this$_popoutWindowSe20 === void 0 ? void 0 : _this$_popoutWindowSe20.findByGroup(sourceGroup);
|
|
17948
18448
|
if (!popoutGroup) return;
|
|
17949
18449
|
const removedPanel = this.movingLock(() => popoutGroup.popoutGroup.model.removePanel(popoutGroup.popoutGroup.panels[0], {
|
|
17950
18450
|
skipSetActive: true,
|
|
@@ -18059,6 +18559,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18059
18559
|
const from = options.from.group;
|
|
18060
18560
|
const to = options.to.group;
|
|
18061
18561
|
const target = options.to.position;
|
|
18562
|
+
if (target === "center" && from === to) return;
|
|
18062
18563
|
let source = from;
|
|
18063
18564
|
let mergedPanels;
|
|
18064
18565
|
if (target === "center") {
|
|
@@ -18153,11 +18654,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18153
18654
|
break;
|
|
18154
18655
|
}
|
|
18155
18656
|
case "popout": {
|
|
18156
|
-
var _this$
|
|
18157
|
-
const selectedPopoutGroup = (_this$
|
|
18657
|
+
var _this$_popoutWindowSe21, _this$_popoutWindowSe22;
|
|
18658
|
+
const selectedPopoutGroup = (_this$_popoutWindowSe21 = this._popoutWindowService) === null || _this$_popoutWindowSe21 === void 0 ? void 0 : _this$_popoutWindowSe21.findByGroup(from);
|
|
18158
18659
|
if (!selectedPopoutGroup) throw new Error("dockview: failed to find popout group");
|
|
18159
18660
|
if (this.detachFromNestedWindow(from)) break;
|
|
18160
|
-
(_this$
|
|
18661
|
+
(_this$_popoutWindowSe22 = this._popoutWindowService) === null || _this$_popoutWindowSe22 === void 0 || _this$_popoutWindowSe22.remove(selectedPopoutGroup);
|
|
18161
18662
|
if (selectedPopoutGroup.referenceGroup) {
|
|
18162
18663
|
const referenceGroup = this.getPanel(selectedPopoutGroup.referenceGroup);
|
|
18163
18664
|
if (referenceGroup && !referenceGroup.api.isVisible) this.doRemoveGroup(referenceGroup, { skipActive: true });
|
|
@@ -18322,8 +18823,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18322
18823
|
* window-local containers).
|
|
18323
18824
|
*/
|
|
18324
18825
|
setGroupLocationForRoot(group, gridview) {
|
|
18325
|
-
var _this$
|
|
18326
|
-
const popout = (_this$
|
|
18826
|
+
var _this$_popoutWindowSe23;
|
|
18827
|
+
const popout = (_this$_popoutWindowSe23 = this._popoutWindowService) === null || _this$_popoutWindowSe23 === void 0 ? void 0 : _this$_popoutWindowSe23.entries.find((entry) => entry.gridview === gridview);
|
|
18327
18828
|
if (popout) {
|
|
18328
18829
|
if (group.model.renderContainer !== popout.overlayRenderContainer) group.model.renderContainer = popout.overlayRenderContainer;
|
|
18329
18830
|
group.model.dropTargetContainer = popout.dropTargetContainer;
|
|
@@ -18343,10 +18844,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18343
18844
|
* the nested gridview of the floating / popout window it lives in.
|
|
18344
18845
|
*/
|
|
18345
18846
|
getGridviewForGroup(group) {
|
|
18346
|
-
var _this$_floatingGroupS10, _this$
|
|
18847
|
+
var _this$_floatingGroupS10, _this$_popoutWindowSe24;
|
|
18347
18848
|
const floating = (_this$_floatingGroupS10 = this._floatingGroupService) === null || _this$_floatingGroupS10 === void 0 ? void 0 : _this$_floatingGroupS10.findByGroup(group);
|
|
18348
18849
|
if (floating) return floating.gridview;
|
|
18349
|
-
const popout = (_this$
|
|
18850
|
+
const popout = (_this$_popoutWindowSe24 = this._popoutWindowService) === null || _this$_popoutWindowSe24 === void 0 ? void 0 : _this$_popoutWindowSe24.findByGroup(group);
|
|
18350
18851
|
if (popout) return popout.gridview;
|
|
18351
18852
|
return this.gridview;
|
|
18352
18853
|
}
|
|
@@ -18368,13 +18869,13 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18368
18869
|
return location.length % 2 == 1 ? rootOrientation : orthogonal(rootOrientation);
|
|
18369
18870
|
}
|
|
18370
18871
|
updateTheme() {
|
|
18371
|
-
var _this$_options$theme, _this$_shellThemeClas, _theme$gap, _this$
|
|
18872
|
+
var _this$_options$theme, _this$_shellThemeClas, _theme$gap, _this$_popoutWindowSe25, _this$_popoutWindowSe26, _this$_shellManager5, _theme$edgeGroupColla, _theme$tabGroupIndica;
|
|
18372
18873
|
const theme = (_this$_options$theme = this._options.theme) !== null && _this$_options$theme !== void 0 ? _this$_options$theme : themeAbyss;
|
|
18373
18874
|
(_this$_shellThemeClas = this._shellThemeClassnames) === null || _this$_shellThemeClas === void 0 || _this$_shellThemeClas.setClassNames(theme.className);
|
|
18374
18875
|
const gap = (_theme$gap = theme.gap) !== null && _theme$gap !== void 0 ? _theme$gap : 0;
|
|
18375
18876
|
this.gridview.margin = gap;
|
|
18376
18877
|
for (const floating of this.floatingGroups) floating.gridview.margin = gap;
|
|
18377
|
-
for (const entry of (_this$
|
|
18878
|
+
for (const entry of (_this$_popoutWindowSe25 = (_this$_popoutWindowSe26 = this._popoutWindowService) === null || _this$_popoutWindowSe26 === void 0 ? void 0 : _this$_popoutWindowSe26.entries) !== null && _this$_popoutWindowSe25 !== void 0 ? _this$_popoutWindowSe25 : []) entry.gridview.margin = gap;
|
|
18378
18879
|
(_this$_shellManager5 = this._shellManager) === null || _this$_shellManager5 === void 0 || _this$_shellManager5.updateTheme(gap, (_theme$edgeGroupColla = theme.edgeGroupCollapsedSize) !== null && _theme$edgeGroupColla !== void 0 ? _theme$edgeGroupColla : 35);
|
|
18379
18880
|
if (theme.dndOverlayBorder === void 0) {
|
|
18380
18881
|
var _this$_shellManager6;
|
|
@@ -18443,6 +18944,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18443
18944
|
}), this.onDidActiveChange((event) => {
|
|
18444
18945
|
this._onDidActiveGroupChange.fire(event);
|
|
18445
18946
|
}));
|
|
18947
|
+
this.layoutFromElement();
|
|
18446
18948
|
}
|
|
18447
18949
|
updateOptions(options) {
|
|
18448
18950
|
super.updateOptions(options);
|
|
@@ -18688,6 +19190,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
18688
19190
|
this._options = options;
|
|
18689
19191
|
this.splitview = new Splitview(this.element, options);
|
|
18690
19192
|
this.addDisposables(this._onDidAddView, this._onDidLayoutfromJSON, this._onDidRemoveView, this._onDidLayoutChange);
|
|
19193
|
+
this.layoutFromElement();
|
|
18691
19194
|
}
|
|
18692
19195
|
updateOptions(options) {
|
|
18693
19196
|
if ("className" in options) {
|
|
@@ -19088,6 +19591,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
19088
19591
|
const queue = [];
|
|
19089
19592
|
const width = this.width;
|
|
19090
19593
|
const height = this.height;
|
|
19594
|
+
this.paneview.dispose();
|
|
19091
19595
|
this.paneview = new Paneview(this.element, {
|
|
19092
19596
|
orientation: "VERTICAL",
|
|
19093
19597
|
descriptor: {
|
|
@@ -19151,7 +19655,11 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
|
|
|
19151
19655
|
clear() {
|
|
19152
19656
|
for (const [_, value] of this._viewDisposables.entries()) value.dispose();
|
|
19153
19657
|
this._viewDisposables.clear();
|
|
19658
|
+
const width = this.width;
|
|
19659
|
+
const height = this.height;
|
|
19154
19660
|
this.paneview.dispose();
|
|
19661
|
+
this.paneview = new Paneview(this.element, { orientation: "VERTICAL" });
|
|
19662
|
+
this.layout(width, height);
|
|
19155
19663
|
}
|
|
19156
19664
|
doAddPanel(panel) {
|
|
19157
19665
|
const disposable = new CompositeDisposable(panel.onDidDrop((event) => {
|
|
@@ -19369,11 +19877,13 @@ exports.createSplitview = createSplitview;
|
|
|
19369
19877
|
exports.defineModule = defineModule;
|
|
19370
19878
|
exports.directionToPosition = directionToPosition;
|
|
19371
19879
|
exports.findRelativeZIndexParent = findRelativeZIndexParent;
|
|
19880
|
+
exports.getActiveElement = getActiveElement;
|
|
19372
19881
|
exports.getDirectionOrientation = getDirectionOrientation;
|
|
19373
19882
|
exports.getGridLocation = getGridLocation;
|
|
19374
19883
|
exports.getLocationOrientation = getLocationOrientation;
|
|
19375
19884
|
exports.getPaneData = getPaneData;
|
|
19376
19885
|
exports.getPanelData = getPanelData;
|
|
19886
|
+
exports.getPopoutUrlError = getPopoutUrlError;
|
|
19377
19887
|
exports.getRegisteredModules = getRegisteredModules;
|
|
19378
19888
|
exports.getRelativeLocation = getRelativeLocation;
|
|
19379
19889
|
exports.indexInParent = indexInParent;
|