dockview-react 1.16.1 → 1.17.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/dockview-react.amd.js +223 -141
- package/dist/dockview-react.amd.js.map +1 -1
- package/dist/dockview-react.amd.min.js +2 -2
- package/dist/dockview-react.amd.min.js.map +1 -1
- package/dist/dockview-react.amd.min.noStyle.js +2 -2
- package/dist/dockview-react.amd.min.noStyle.js.map +1 -1
- package/dist/dockview-react.amd.noStyle.js +222 -140
- package/dist/dockview-react.amd.noStyle.js.map +1 -1
- package/dist/dockview-react.cjs.js +223 -141
- package/dist/dockview-react.cjs.js.map +1 -1
- package/dist/dockview-react.esm.js +223 -141
- package/dist/dockview-react.esm.js.map +1 -1
- package/dist/dockview-react.esm.min.js +2 -2
- package/dist/dockview-react.esm.min.js.map +1 -1
- package/dist/dockview-react.js +223 -141
- package/dist/dockview-react.js.map +1 -1
- package/dist/dockview-react.min.js +2 -2
- package/dist/dockview-react.min.js.map +1 -1
- package/dist/dockview-react.min.noStyle.js +2 -2
- package/dist/dockview-react.min.noStyle.js.map +1 -1
- package/dist/dockview-react.noStyle.js +222 -140
- package/dist/dockview-react.noStyle.js.map +1 -1
- package/dist/styles/dockview.css +1 -1
- package/package.json +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-react
|
|
3
|
-
* @version 1.
|
|
3
|
+
* @version 1.17.1
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -34,7 +34,7 @@ function styleInject(css, ref) {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
var css_248z = ".dockview-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-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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}\n\n.dockview-theme-vs {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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 .groupview.active-group > .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 .groupview.active-group > .tabs-and-actions-container .tab.active-tab {\n border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.active-group > .tabs-and-actions-container .tab.inactive-tab {\n border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.inactive-group > .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 .groupview.inactive-group > .tabs-and-actions-container .tab.active-tab {\n border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.inactive-group > .tabs-and-actions-container .tab.inactive-tab {\n border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n}\n\n.dockview-theme-abyss {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-group-view-background-color: #000c18;\n --dv-tabs-and-actions-container-background-color: #1c1c2a;\n --dv-activegroup-visiblepanel-tab-background-color: #000c18;\n --dv-activegroup-hiddenpanel-tab-background-color: #10192c;\n --dv-inactivegroup-visiblepanel-tab-background-color: #000c18;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #10192c;\n --dv-tab-divider-color: #2b2b4a;\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: #2b2b4a;\n --dv-paneview-header-border-color: #2b2b4a;\n --dv-paneview-active-outline-color: #596f99;\n}\n\n.dockview-theme-dracula {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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 .groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n position: relative;\n}\n.dockview-theme-dracula .groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab::after {\n position: absolute;\n left: 0px;\n top: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n position: relative;\n}\n.dockview-theme-dracula .groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab::after {\n position: absolute;\n left: 0px;\n bottom: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #5e3d5a;\n z-index: 999;\n}\n\n.dockview-theme-replit {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-group-view-background-color: #ebeced;\n --dv-tabs-and-actions-container-background-color: #fcfcfc;\n --dv-activegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-activegroup-hiddenpanel-tab-background-color: ##fcfcfc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-background-color: #ebeced;\n --dv-separator-handle-background-color: #cfd1d3;\n --dv-separator-handle-hover-background-color: #babbbb;\n}\n.dockview-theme-replit .dv-resize-container:has(> .groupview) {\n border-radius: 8px;\n}\n.dockview-theme-replit .groupview {\n overflow: hidden;\n border-radius: 10px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container {\n border-bottom: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab {\n margin: 4px;\n border-radius: 8px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab .dockview-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab:hover {\n background-color: #e4e5e6 !important;\n}\n.dockview-theme-replit .groupview .content-container {\n background-color: #fcfcfc;\n}\n.dockview-theme-replit .groupview.active-group {\n border: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .groupview.inactive-group {\n border: 1px solid transparent;\n}\n.dockview-theme-replit .vertical > .sash-container > .sash:not(.disabled)::after {\n content: \"\";\n height: 4px;\n width: 40px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-separator-handle-background-color);\n position: absolute;\n}\n.dockview-theme-replit .vertical > .sash-container > .sash:not(.disabled):hover::after {\n background-color: var(--dv-separator-handle-hover-background-color);\n}\n.dockview-theme-replit .horizontal > .sash-container > .sash:not(.disabled)::after {\n content: \"\";\n height: 40px;\n width: 4px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-separator-handle-background-color);\n position: absolute;\n}\n.dockview-theme-replit .horizontal > .sash-container > .sash:not(.disabled):hover::after {\n background-color: var(--dv-separator-handle-hover-background-color);\n}\n.drop-target {\n position: relative;\n}\n.drop-target > .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.drop-target > .drop-target-dropzone > .drop-target-selection {\n position: relative;\n box-sizing: border-box;\n height: 100%;\n width: 100%;\n background-color: var(--dv-drag-over-background-color);\n transition: top 70ms ease-out, left 70ms ease-out, width 70ms ease-out, height 70ms ease-out, opacity 0.15s ease-out;\n will-change: transform;\n pointer-events: none;\n}\n.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .drop-target-selection.dv-drop-target-right.dv-drop-target-small-horizontal {\n border-right: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-dockview {\n position: relative;\n background-color: var(--dv-group-view-background-color);\n}\n.dv-dockview .dv-watermark-container {\n position: absolute;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n z-index: 1;\n}\n.dv-dockview .dv-overlay-render-container {\n position: relative;\n}\n\n.groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n background-color: var(--dv-inactivegroup-visiblepanel-tab-background-color);\n color: var(--dv-inactivegroup-visiblepanel-tab-color);\n}\n.groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.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.tab.dv-tab-dragging {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.groupview {\n display: flex;\n flex-direction: column;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n}\n.groupview:focus {\n outline: none;\n}\n.groupview.empty > .tabs-and-actions-container {\n display: none;\n}\n.groupview > .content-container {\n flex-grow: 1;\n min-height: 0;\n outline: none;\n}\n.dv-root-wrapper {\n height: 100%;\n width: 100%;\n}\n.grid-view,\n.branch-node {\n height: 100%;\n width: 100%;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-top {\n background-color: red;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-bottom {\n background-color: green;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-left {\n background-color: yellow;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-right {\n background-color: blue;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-topleft,\n.dv-debug .dv-resize-container .dv-resize-handle-topright,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomleft,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomright {\n background-color: cyan;\n}\n\n.dv-resize-container {\n position: absolute;\n z-index: 997;\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: var(--dv-floating-box-shadow);\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: 0.5;\n}\n.dv-resize-container .dv-resize-handle-top {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n top: -2px;\n z-index: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\n position: absolute;\n cursor: se-resize;\n}\n.dv-render-overlay {\n position: absolute;\n z-index: 1;\n height: 100%;\n}\n.dv-render-overlay.dv-render-overlay-float {\n z-index: 998;\n}\n.dv-debug .dv-render-overlay {\n outline: 1px solid red;\n outline-offset: -1;\n}\n.pane-container {\n height: 100%;\n width: 100%;\n}\n.pane-container.animated .view {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.pane-container .view {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n padding: 0px !important;\n}\n.pane-container .view:not(:first-child)::before {\n background-color: transparent !important;\n}\n.pane-container .view:not(:first-child) .pane > .pane-header {\n border-top: 1px solid var(--dv-paneview-header-border-color);\n}\n.pane-container .view .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.pane-container .view .default-header .dockview-pane-header-icon {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.pane-container .view .default-header > span {\n padding-left: 8px;\n flex-grow: 1;\n}\n.pane-container:first-of-type > .pane > .pane-header {\n border-top: none !important;\n}\n.pane-container .pane {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n height: 100%;\n}\n.pane-container .pane .pane-header {\n box-sizing: border-box;\n user-select: none;\n position: relative;\n outline: none;\n}\n.pane-container .pane .pane-header.pane-draggable {\n cursor: pointer;\n}\n.pane-container .pane .pane-header:focus:before, .pane-container .pane .pane-header:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.pane-container .pane .pane-body {\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n position: relative;\n outline: none;\n}\n.pane-container .pane .pane-body:focus:before, .pane-container .pane .pane-body:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-debug .split-view-container .sash-container .sash.enabled {\n background-color: black;\n}\n.dv-debug .split-view-container .sash-container .sash.disabled {\n background-color: orange;\n}\n.dv-debug .split-view-container .sash-container .sash.maximum {\n background-color: green;\n}\n.dv-debug .split-view-container .sash-container .sash.minimum {\n background-color: red;\n}\n\n.split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\n}\n.split-view-container.dv-splitview-disabled > .sash-container > .sash {\n pointer-events: none;\n}\n.split-view-container.animation .view,\n.split-view-container.animation .sash {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.split-view-container.horizontal {\n height: 100%;\n}\n.split-view-container.horizontal > .sash-container > .sash {\n height: 100%;\n width: 4px;\n}\n.split-view-container.horizontal > .sash-container > .sash.enabled {\n cursor: ew-resize;\n}\n.split-view-container.horizontal > .sash-container > .sash.disabled {\n cursor: default;\n}\n.split-view-container.horizontal > .sash-container > .sash.maximum {\n cursor: w-resize;\n}\n.split-view-container.horizontal > .sash-container > .sash.minimum {\n cursor: e-resize;\n}\n.split-view-container.horizontal > .view-container > .view:not(:first-child)::before {\n height: 100%;\n width: 1px;\n}\n.split-view-container.vertical {\n width: 100%;\n}\n.split-view-container.vertical > .sash-container > .sash {\n width: 100%;\n height: 4px;\n}\n.split-view-container.vertical > .sash-container > .sash.enabled {\n cursor: ns-resize;\n}\n.split-view-container.vertical > .sash-container > .sash.disabled {\n cursor: default;\n}\n.split-view-container.vertical > .sash-container > .sash.maximum {\n cursor: n-resize;\n}\n.split-view-container.vertical > .sash-container > .sash.minimum {\n cursor: s-resize;\n}\n.split-view-container.vertical > .view-container > .view {\n width: 100%;\n}\n.split-view-container.vertical > .view-container > .view:not(:first-child)::before {\n height: 1px;\n width: 100%;\n}\n.split-view-container .sash-container {\n height: 100%;\n width: 100%;\n position: absolute;\n}\n.split-view-container .sash-container .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}\n.split-view-container .sash-container .sash:not(.disabled):active {\n transition: background-color 0.1s ease-in-out;\n background-color: var(--dv-active-sash-color, transparent);\n}\n.split-view-container .sash-container .sash:not(.disabled):hover {\n background-color: var(--dv-active-sash-color, transparent);\n transition: background-color 0.1s ease-in-out;\n transition-delay: 0.5s;\n}\n.split-view-container .view-container {\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--dv-background-color);\n}\n.split-view-container .view-container .view {\n height: 100%;\n box-sizing: border-box;\n overflow: auto;\n position: absolute;\n}\n.split-view-container.separator-border .view:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-separator-border);\n}\n.dv-dragged {\n transform: translate3d(0px, 0px, 0px); /* forces tab to be drawn on a separate layer (see https://github.com/microsoft/vscode/issues/18733) */\n}\n\n.tab {\n flex-shrink: 0;\n}\n.tab:focus-within, .tab:focus {\n position: relative;\n}\n.tab:focus-within::after, .tab:focus::after {\n position: absolute;\n content: \"\";\n height: 100%;\n width: 100%;\n top: 0px;\n left: 0px;\n pointer-events: none;\n outline: 1px solid var(--dv-tab-divider-color) !important;\n outline-offset: -1px;\n z-index: 5;\n}\n.tab.dv-tab-dragging .dv-default-tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.tab.active-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n}\n.tab.inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: hidden;\n}\n.tab.inactive-tab .dv-default-tab:hover .dv-default-tab-action {\n visibility: visible;\n}\n.tab .dv-default-tab {\n position: relative;\n height: 100%;\n display: flex;\n min-width: 80px;\n align-items: center;\n padding: 0px 8px;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.tab .dv-default-tab .dv-default-tab-content {\n padding: 0px 8px;\n flex-grow: 1;\n}\n.tab .dv-default-tab .dv-default-tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.tab .dv-default-tab .dv-default-tab-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.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.tabs-and-actions-container.hidden {\n display: none;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .tabs-container {\n flex-grow: 1;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .tabs-container .tab {\n flex-grow: 1;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .void-container {\n flex-grow: 0;\n}\n.tabs-and-actions-container .void-container {\n display: flex;\n flex-grow: 1;\n cursor: grab;\n}\n.tabs-and-actions-container .tabs-container {\n display: flex;\n overflow-x: overlay;\n overflow-y: hidden;\n scrollbar-width: thin;\n /* Track */\n /* Handle */\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n}\n.tabs-and-actions-container .tabs-container .tab {\n -webkit-user-drag: element;\n outline: none;\n min-width: 75px;\n cursor: pointer;\n position: relative;\n box-sizing: border-box;\n}\n.tabs-and-actions-container .tabs-container .tab:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-tab-divider-color);\n width: 1px;\n height: 100%;\n}\n.watermark {\n display: flex;\n width: 100%;\n}\n.watermark.has-actions .watermark-title .actions-container {\n display: none;\n}\n.watermark .watermark-title {\n height: 35px;\n width: 100%;\n display: flex;\n}\n.watermark .watermark-content {\n flex-grow: 1;\n}\n.watermark .actions-container {\n display: flex;\n align-items: center;\n padding: 0px 8px;\n}\n.watermark .actions-container .close-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n cursor: pointer;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.watermark .actions-container .close-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}";
|
|
37
|
+
var css_248z = ".dockview-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-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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}\n\n.dockview-theme-vs {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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 .groupview.active-group > .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 .groupview.active-group > .tabs-and-actions-container .tab.active-tab {\n border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.active-group > .tabs-and-actions-container .tab.inactive-tab {\n border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.inactive-group > .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 .groupview.inactive-group > .tabs-and-actions-container .tab.active-tab {\n border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .groupview.inactive-group > .tabs-and-actions-container .tab.inactive-tab {\n border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n}\n\n.dockview-theme-abyss {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-group-view-background-color: #000c18;\n --dv-tabs-and-actions-container-background-color: #1c1c2a;\n --dv-activegroup-visiblepanel-tab-background-color: #000c18;\n --dv-activegroup-hiddenpanel-tab-background-color: #10192c;\n --dv-inactivegroup-visiblepanel-tab-background-color: #000c18;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #10192c;\n --dv-tab-divider-color: #2b2b4a;\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: #2b2b4a;\n --dv-paneview-header-border-color: #2b2b4a;\n --dv-paneview-active-outline-color: #596f99;\n}\n\n.dockview-theme-dracula {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-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 .groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n position: relative;\n}\n.dockview-theme-dracula .groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab::after {\n position: absolute;\n left: 0px;\n top: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n position: relative;\n}\n.dockview-theme-dracula .groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab::after {\n position: absolute;\n left: 0px;\n bottom: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #5e3d5a;\n z-index: 999;\n}\n\n.dockview-theme-replit {\n --dv-background-color: black;\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: white;\n --dv-tabs-container-scrollbar-color: #888;\n --dv-icon-hover-background-color: rgba(90, 93, 94, 0.31);\n --dv-floating-box-shadow: 8px 8px 8px 0px rgba(83, 89, 93, 0.5);\n --dv-group-view-background-color: #ebeced;\n --dv-tabs-and-actions-container-background-color: #fcfcfc;\n --dv-activegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-activegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #f0f1f2;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #fcfcfc;\n --dv-tab-divider-color: transparent;\n --dv-activegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-activegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-visiblepanel-tab-color: rgb(51, 51, 51);\n --dv-inactivegroup-hiddenpanel-tab-color: rgb(51, 51, 51);\n --dv-separator-border: transparent;\n --dv-paneview-header-border-color: rgb(51, 51, 51);\n --dv-background-color: #ebeced;\n --dv-separator-handle-background-color: #cfd1d3;\n --dv-separator-handle-hover-background-color: #babbbb;\n}\n.dockview-theme-replit .dv-resize-container:has(> .groupview) {\n border-radius: 8px;\n}\n.dockview-theme-replit .groupview {\n overflow: hidden;\n border-radius: 10px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container {\n border-bottom: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab {\n margin: 4px;\n border-radius: 8px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab .dockview-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-replit .groupview .tabs-and-actions-container .tab:hover {\n background-color: #e4e5e6 !important;\n}\n.dockview-theme-replit .groupview .content-container {\n background-color: #fcfcfc;\n}\n.dockview-theme-replit .groupview.active-group {\n border: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .groupview.inactive-group {\n border: 1px solid transparent;\n}\n.dockview-theme-replit .vertical > .sash-container > .sash:not(.disabled)::after {\n content: \"\";\n height: 4px;\n width: 40px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-separator-handle-background-color);\n position: absolute;\n}\n.dockview-theme-replit .vertical > .sash-container > .sash:not(.disabled):hover::after {\n background-color: var(--dv-separator-handle-hover-background-color);\n}\n.dockview-theme-replit .horizontal > .sash-container > .sash:not(.disabled)::after {\n content: \"\";\n height: 40px;\n width: 4px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-separator-handle-background-color);\n position: absolute;\n}\n.dockview-theme-replit .horizontal > .sash-container > .sash:not(.disabled):hover::after {\n background-color: var(--dv-separator-handle-hover-background-color);\n}\n.drop-target {\n position: relative;\n}\n.drop-target > .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.drop-target > .drop-target-dropzone > .drop-target-selection {\n position: relative;\n box-sizing: border-box;\n height: 100%;\n width: 100%;\n background-color: var(--dv-drag-over-background-color);\n transition: top 70ms ease-out, left 70ms ease-out, width 70ms ease-out, height 70ms ease-out, opacity 0.15s ease-out;\n will-change: transform;\n pointer-events: none;\n}\n.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .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.drop-target > .drop-target-dropzone > .drop-target-selection.dv-drop-target-right.dv-drop-target-small-horizontal {\n border-right: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-dockview {\n position: relative;\n background-color: var(--dv-group-view-background-color);\n}\n.dv-dockview .dv-watermark-container {\n position: absolute;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n z-index: 1;\n}\n.dv-dockview .dv-overlay-render-container {\n position: relative;\n}\n\n.groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.groupview.active-group > .tabs-and-actions-container > .tabs-container > .tab.inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.active-tab {\n background-color: var(--dv-inactivegroup-visiblepanel-tab-background-color);\n color: var(--dv-inactivegroup-visiblepanel-tab-color);\n}\n.groupview.inactive-group > .tabs-and-actions-container > .tabs-container > .tab.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.tab.dv-tab-dragging {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.groupview {\n display: flex;\n flex-direction: column;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n}\n.groupview:focus {\n outline: none;\n}\n.groupview.empty > .tabs-and-actions-container {\n display: none;\n}\n.groupview > .content-container {\n flex-grow: 1;\n min-height: 0;\n outline: none;\n}\n.dv-root-wrapper {\n height: 100%;\n width: 100%;\n}\n.grid-view,\n.branch-node {\n height: 100%;\n width: 100%;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-top {\n background-color: red;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-bottom {\n background-color: green;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-left {\n background-color: yellow;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-right {\n background-color: blue;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-topleft,\n.dv-debug .dv-resize-container .dv-resize-handle-topright,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomleft,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomright {\n background-color: cyan;\n}\n\n.dv-resize-container {\n position: absolute;\n z-index: 997;\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: var(--dv-floating-box-shadow);\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: 0.5;\n}\n.dv-resize-container .dv-resize-handle-top {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n top: -2px;\n z-index: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\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: 999;\n position: absolute;\n cursor: se-resize;\n}\n.dv-render-overlay {\n position: absolute;\n z-index: 1;\n height: 100%;\n}\n.dv-render-overlay.dv-render-overlay-float {\n z-index: 998;\n}\n.dv-debug .dv-render-overlay {\n outline: 1px solid red;\n outline-offset: -1;\n}\n.pane-container {\n height: 100%;\n width: 100%;\n}\n.pane-container.animated .view {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.pane-container .view {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n padding: 0px !important;\n}\n.pane-container .view:not(:first-child)::before {\n background-color: transparent !important;\n}\n.pane-container .view:not(:first-child) .pane > .pane-header {\n border-top: 1px solid var(--dv-paneview-header-border-color);\n}\n.pane-container .view .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.pane-container .view .default-header .dockview-pane-header-icon {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.pane-container .view .default-header > span {\n padding-left: 8px;\n flex-grow: 1;\n}\n.pane-container:first-of-type > .pane > .pane-header {\n border-top: none !important;\n}\n.pane-container .pane {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n height: 100%;\n}\n.pane-container .pane .pane-header {\n box-sizing: border-box;\n user-select: none;\n position: relative;\n outline: none;\n}\n.pane-container .pane .pane-header.pane-draggable {\n cursor: pointer;\n}\n.pane-container .pane .pane-header:focus:before, .pane-container .pane .pane-header:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.pane-container .pane .pane-body {\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n position: relative;\n outline: none;\n}\n.pane-container .pane .pane-body:focus:before, .pane-container .pane .pane-body:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-debug .split-view-container .sash-container .sash.enabled {\n background-color: black;\n}\n.dv-debug .split-view-container .sash-container .sash.disabled {\n background-color: orange;\n}\n.dv-debug .split-view-container .sash-container .sash.maximum {\n background-color: green;\n}\n.dv-debug .split-view-container .sash-container .sash.minimum {\n background-color: red;\n}\n\n.split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\n}\n.split-view-container.dv-splitview-disabled > .sash-container > .sash {\n pointer-events: none;\n}\n.split-view-container.animation .view,\n.split-view-container.animation .sash {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.split-view-container.horizontal {\n height: 100%;\n}\n.split-view-container.horizontal > .sash-container > .sash {\n height: 100%;\n width: 4px;\n}\n.split-view-container.horizontal > .sash-container > .sash.enabled {\n cursor: ew-resize;\n}\n.split-view-container.horizontal > .sash-container > .sash.disabled {\n cursor: default;\n}\n.split-view-container.horizontal > .sash-container > .sash.maximum {\n cursor: w-resize;\n}\n.split-view-container.horizontal > .sash-container > .sash.minimum {\n cursor: e-resize;\n}\n.split-view-container.horizontal > .view-container > .view:not(:first-child)::before {\n height: 100%;\n width: 1px;\n}\n.split-view-container.vertical {\n width: 100%;\n}\n.split-view-container.vertical > .sash-container > .sash {\n width: 100%;\n height: 4px;\n}\n.split-view-container.vertical > .sash-container > .sash.enabled {\n cursor: ns-resize;\n}\n.split-view-container.vertical > .sash-container > .sash.disabled {\n cursor: default;\n}\n.split-view-container.vertical > .sash-container > .sash.maximum {\n cursor: n-resize;\n}\n.split-view-container.vertical > .sash-container > .sash.minimum {\n cursor: s-resize;\n}\n.split-view-container.vertical > .view-container > .view {\n width: 100%;\n}\n.split-view-container.vertical > .view-container > .view:not(:first-child)::before {\n height: 1px;\n width: 100%;\n}\n.split-view-container .sash-container {\n height: 100%;\n width: 100%;\n position: absolute;\n}\n.split-view-container .sash-container .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}\n.split-view-container .sash-container .sash:not(.disabled):active {\n transition: background-color 0.1s ease-in-out;\n background-color: var(--dv-active-sash-color, transparent);\n}\n.split-view-container .sash-container .sash:not(.disabled):hover {\n background-color: var(--dv-active-sash-color, transparent);\n transition: background-color 0.1s ease-in-out;\n transition-delay: 0.5s;\n}\n.split-view-container .view-container {\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--dv-background-color);\n}\n.split-view-container .view-container .view {\n height: 100%;\n box-sizing: border-box;\n overflow: auto;\n position: absolute;\n}\n.split-view-container.separator-border .view:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-separator-border);\n}\n.dv-dragged {\n transform: translate3d(0px, 0px, 0px); /* forces tab to be drawn on a separate layer (see https://github.com/microsoft/vscode/issues/18733) */\n}\n\n.tab {\n flex-shrink: 0;\n}\n.tab:focus-within, .tab:focus {\n position: relative;\n}\n.tab:focus-within::after, .tab:focus::after {\n position: absolute;\n content: \"\";\n height: 100%;\n width: 100%;\n top: 0px;\n left: 0px;\n pointer-events: none;\n outline: 1px solid var(--dv-tab-divider-color) !important;\n outline-offset: -1px;\n z-index: 5;\n}\n.tab.dv-tab-dragging .dv-default-tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.tab.active-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n}\n.tab.inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: hidden;\n}\n.tab.inactive-tab .dv-default-tab:hover .dv-default-tab-action {\n visibility: visible;\n}\n.tab .dv-default-tab {\n position: relative;\n height: 100%;\n display: flex;\n min-width: 80px;\n align-items: center;\n padding: 0px 8px;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.tab .dv-default-tab .dv-default-tab-content {\n padding: 0px 8px;\n flex-grow: 1;\n}\n.tab .dv-default-tab .dv-default-tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.tab .dv-default-tab .dv-default-tab-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.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.tabs-and-actions-container.hidden {\n display: none;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .tabs-container {\n flex-grow: 1;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .tabs-container .tab {\n flex-grow: 1;\n}\n.tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .void-container {\n flex-grow: 0;\n}\n.tabs-and-actions-container .void-container {\n display: flex;\n flex-grow: 1;\n cursor: grab;\n}\n.tabs-and-actions-container .tabs-container {\n display: flex;\n overflow-x: overlay;\n overflow-y: hidden;\n scrollbar-width: thin;\n /* Track */\n /* Handle */\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.tabs-and-actions-container .tabs-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n}\n.tabs-and-actions-container .tabs-container .tab {\n -webkit-user-drag: element;\n outline: none;\n min-width: 75px;\n cursor: pointer;\n position: relative;\n box-sizing: border-box;\n}\n.tabs-and-actions-container .tabs-container .tab:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-tab-divider-color);\n width: 1px;\n height: 100%;\n}\n.watermark {\n display: flex;\n width: 100%;\n}\n.watermark.has-actions .watermark-title .actions-container {\n display: none;\n}\n.watermark .watermark-title {\n height: 35px;\n width: 100%;\n display: flex;\n}\n.watermark .watermark-content {\n flex-grow: 1;\n}\n.watermark .actions-container {\n display: flex;\n align-items: center;\n padding: 0px 8px;\n}\n.watermark .actions-container .close-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n cursor: pointer;\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.watermark .actions-container .close-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}";
|
|
38
38
|
styleInject(css_248z);
|
|
39
39
|
|
|
40
40
|
class TransferObject {
|
|
@@ -582,6 +582,42 @@ function disableIframePointEvents() {
|
|
|
582
582
|
},
|
|
583
583
|
};
|
|
584
584
|
}
|
|
585
|
+
function getDockviewTheme(element) {
|
|
586
|
+
function toClassList(element) {
|
|
587
|
+
const list = [];
|
|
588
|
+
for (let i = 0; i < element.classList.length; i++) {
|
|
589
|
+
list.push(element.classList.item(i));
|
|
590
|
+
}
|
|
591
|
+
return list;
|
|
592
|
+
}
|
|
593
|
+
let theme = undefined;
|
|
594
|
+
let parent = element;
|
|
595
|
+
while (parent !== null) {
|
|
596
|
+
theme = toClassList(parent).find((cls) => cls.startsWith('dockview-theme-'));
|
|
597
|
+
if (typeof theme === 'string') {
|
|
598
|
+
break;
|
|
599
|
+
}
|
|
600
|
+
parent = parent.parentElement;
|
|
601
|
+
}
|
|
602
|
+
return theme;
|
|
603
|
+
}
|
|
604
|
+
class Classnames {
|
|
605
|
+
constructor(element) {
|
|
606
|
+
this.element = element;
|
|
607
|
+
this._classNames = [];
|
|
608
|
+
}
|
|
609
|
+
setClassNames(classNames) {
|
|
610
|
+
for (const className of this._classNames) {
|
|
611
|
+
toggleClass(this.element, className, false);
|
|
612
|
+
}
|
|
613
|
+
this._classNames = classNames
|
|
614
|
+
.split(' ')
|
|
615
|
+
.filter((v) => v.trim().length > 0);
|
|
616
|
+
for (const className of this._classNames) {
|
|
617
|
+
toggleClass(this.element, className, true);
|
|
618
|
+
}
|
|
619
|
+
}
|
|
620
|
+
}
|
|
585
621
|
|
|
586
622
|
function tail(arr) {
|
|
587
623
|
if (arr.length === 0) {
|
|
@@ -2701,8 +2737,8 @@ class BaseGrid extends Resizable {
|
|
|
2701
2737
|
set locked(value) {
|
|
2702
2738
|
this.gridview.locked = value;
|
|
2703
2739
|
}
|
|
2704
|
-
constructor(options) {
|
|
2705
|
-
var _a
|
|
2740
|
+
constructor(parentElement, options) {
|
|
2741
|
+
var _a;
|
|
2706
2742
|
super(document.createElement('div'), options.disableAutoResizing);
|
|
2707
2743
|
this._id = nextLayoutId$1.next();
|
|
2708
2744
|
this._groups = new Map();
|
|
@@ -2716,14 +2752,11 @@ class BaseGrid extends Resizable {
|
|
|
2716
2752
|
this.onDidLayoutChange = this._bufferOnDidLayoutChange.onEvent;
|
|
2717
2753
|
this._onDidViewVisibilityChangeMicroTaskQueue = new AsapEvent();
|
|
2718
2754
|
this.onDidViewVisibilityChangeMicroTaskQueue = this._onDidViewVisibilityChangeMicroTaskQueue.onEvent;
|
|
2719
|
-
this.classNames = [];
|
|
2720
2755
|
this.element.style.height = '100%';
|
|
2721
2756
|
this.element.style.width = '100%';
|
|
2722
|
-
this.
|
|
2723
|
-
|
|
2724
|
-
|
|
2725
|
-
}
|
|
2726
|
-
options.parentElement.appendChild(this.element);
|
|
2757
|
+
this._classNames = new Classnames(this.element);
|
|
2758
|
+
this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
|
|
2759
|
+
parentElement.appendChild(this.element);
|
|
2727
2760
|
this.gridview = new Gridview(!!options.proportionalLayout, options.styles, options.orientation, options.locked, options.margin);
|
|
2728
2761
|
this.gridview.locked = !!options.locked;
|
|
2729
2762
|
this.element.appendChild(this.gridview.element);
|
|
@@ -2747,15 +2780,22 @@ class BaseGrid extends Resizable {
|
|
|
2747
2780
|
return this.gridview.isViewVisible(getGridLocation(panel.element));
|
|
2748
2781
|
}
|
|
2749
2782
|
updateOptions(options) {
|
|
2750
|
-
var _a, _b;
|
|
2783
|
+
var _a, _b, _c, _d;
|
|
2784
|
+
if (typeof options.proportionalLayout === 'boolean') ;
|
|
2785
|
+
if (options.orientation) {
|
|
2786
|
+
this.gridview.orientation = options.orientation;
|
|
2787
|
+
}
|
|
2788
|
+
if ('disableResizing' in options) {
|
|
2789
|
+
this.disableResizing = (_a = options.disableAutoResizing) !== null && _a !== void 0 ? _a : false;
|
|
2790
|
+
}
|
|
2791
|
+
if ('locked' in options) {
|
|
2792
|
+
this.locked = (_b = options.locked) !== null && _b !== void 0 ? _b : false;
|
|
2793
|
+
}
|
|
2794
|
+
if ('margin' in options) {
|
|
2795
|
+
this.gridview.margin = (_c = options.margin) !== null && _c !== void 0 ? _c : 0;
|
|
2796
|
+
}
|
|
2751
2797
|
if ('className' in options) {
|
|
2752
|
-
|
|
2753
|
-
toggleClass(this.element, className, false);
|
|
2754
|
-
}
|
|
2755
|
-
this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
|
|
2756
|
-
for (const className of this.classNames) {
|
|
2757
|
-
toggleClass(this.element, className, true);
|
|
2758
|
-
}
|
|
2798
|
+
this._classNames.setClassNames((_d = options.className) !== null && _d !== void 0 ? _d : '');
|
|
2759
2799
|
}
|
|
2760
2800
|
}
|
|
2761
2801
|
maximizeGroup(panel) {
|
|
@@ -4681,7 +4721,7 @@ class Tab extends CompositeDisposable {
|
|
|
4681
4721
|
this.onWillShowOverlay = this.dropTarget.onWillShowOverlay;
|
|
4682
4722
|
this.addDisposables(this._onChanged, this._onDropped, this._onDragStart, dragHandler.onDragStart((event) => {
|
|
4683
4723
|
this._onDragStart.fire(event);
|
|
4684
|
-
}), dragHandler, addDisposableListener(this._element, '
|
|
4724
|
+
}), dragHandler, addDisposableListener(this._element, 'pointerdown', (event) => {
|
|
4685
4725
|
if (event.defaultPrevented) {
|
|
4686
4726
|
return;
|
|
4687
4727
|
}
|
|
@@ -4723,7 +4763,7 @@ class GroupDragHandler extends DragHandler {
|
|
|
4723
4763
|
this.accessor = accessor;
|
|
4724
4764
|
this.group = group;
|
|
4725
4765
|
this.panelTransfer = LocalSelectionTransfer.getInstance();
|
|
4726
|
-
this.addDisposables(addDisposableListener(element, '
|
|
4766
|
+
this.addDisposables(addDisposableListener(element, 'pointerdown', (e) => {
|
|
4727
4767
|
if (e.shiftKey) {
|
|
4728
4768
|
/**
|
|
4729
4769
|
* You cannot call e.preventDefault() because that will prevent drag events from firing
|
|
@@ -4942,7 +4982,7 @@ class TabsContainer extends CompositeDisposable {
|
|
|
4942
4982
|
group: this.group,
|
|
4943
4983
|
getData: getPanelData,
|
|
4944
4984
|
}));
|
|
4945
|
-
}), addDisposableListener(this.voidContainer.element, '
|
|
4985
|
+
}), addDisposableListener(this.voidContainer.element, 'pointerdown', (event) => {
|
|
4946
4986
|
const isFloatingGroupsEnabled = !this.accessor.options.disableFloatingGroups;
|
|
4947
4987
|
if (isFloatingGroupsEnabled &&
|
|
4948
4988
|
event.shiftKey &&
|
|
@@ -4956,7 +4996,7 @@ class TabsContainer extends CompositeDisposable {
|
|
|
4956
4996
|
inDragMode: true,
|
|
4957
4997
|
});
|
|
4958
4998
|
}
|
|
4959
|
-
}), addDisposableListener(this.tabContainer, '
|
|
4999
|
+
}), addDisposableListener(this.tabContainer, 'pointerdown', (event) => {
|
|
4960
5000
|
if (event.defaultPrevented) {
|
|
4961
5001
|
return;
|
|
4962
5002
|
}
|
|
@@ -5661,7 +5701,6 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5661
5701
|
});
|
|
5662
5702
|
this.tabsContainer.hide();
|
|
5663
5703
|
this.contentContainer.element.appendChild(this.watermark.element);
|
|
5664
|
-
this.watermark.updateParentGroup(this.groupPanel, true);
|
|
5665
5704
|
}
|
|
5666
5705
|
if (!this.isEmpty && this.watermark) {
|
|
5667
5706
|
this.watermark.element.remove();
|
|
@@ -6024,6 +6063,34 @@ class DockviewGroupPanelApiImpl extends GridviewPanelApiImpl {
|
|
|
6024
6063
|
const MINIMUM_DOCKVIEW_GROUP_PANEL_WIDTH = 100;
|
|
6025
6064
|
const MINIMUM_DOCKVIEW_GROUP_PANEL_HEIGHT = 100;
|
|
6026
6065
|
class DockviewGroupPanel extends GridviewPanel {
|
|
6066
|
+
get minimumWidth() {
|
|
6067
|
+
var _a;
|
|
6068
|
+
const activePanelMinimumWidth = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.minimumWidth;
|
|
6069
|
+
return typeof activePanelMinimumWidth === 'number'
|
|
6070
|
+
? activePanelMinimumWidth
|
|
6071
|
+
: MINIMUM_DOCKVIEW_GROUP_PANEL_WIDTH;
|
|
6072
|
+
}
|
|
6073
|
+
get minimumHeight() {
|
|
6074
|
+
var _a;
|
|
6075
|
+
const activePanelMinimumHeight = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.minimumHeight;
|
|
6076
|
+
return typeof activePanelMinimumHeight === 'number'
|
|
6077
|
+
? activePanelMinimumHeight
|
|
6078
|
+
: MINIMUM_DOCKVIEW_GROUP_PANEL_HEIGHT;
|
|
6079
|
+
}
|
|
6080
|
+
get maximumWidth() {
|
|
6081
|
+
var _a;
|
|
6082
|
+
const activePanelMaximumWidth = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.maximumWidth;
|
|
6083
|
+
return typeof activePanelMaximumWidth === 'number'
|
|
6084
|
+
? activePanelMaximumWidth
|
|
6085
|
+
: Number.MAX_SAFE_INTEGER;
|
|
6086
|
+
}
|
|
6087
|
+
get maximumHeight() {
|
|
6088
|
+
var _a;
|
|
6089
|
+
const activePanelMaximumHeight = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.maximumHeight;
|
|
6090
|
+
return typeof activePanelMaximumHeight === 'number'
|
|
6091
|
+
? activePanelMaximumHeight
|
|
6092
|
+
: Number.MAX_SAFE_INTEGER;
|
|
6093
|
+
}
|
|
6027
6094
|
get panels() {
|
|
6028
6095
|
return this._model.panels;
|
|
6029
6096
|
}
|
|
@@ -6046,9 +6113,12 @@ class DockviewGroupPanel extends GridviewPanel {
|
|
|
6046
6113
|
return this._model.header;
|
|
6047
6114
|
}
|
|
6048
6115
|
constructor(accessor, id, options) {
|
|
6116
|
+
var _a, _b, _c, _d, _e, _f;
|
|
6049
6117
|
super(id, 'groupview_default', {
|
|
6050
|
-
minimumHeight: MINIMUM_DOCKVIEW_GROUP_PANEL_HEIGHT,
|
|
6051
|
-
minimumWidth: MINIMUM_DOCKVIEW_GROUP_PANEL_WIDTH,
|
|
6118
|
+
minimumHeight: (_b = (_a = options.constraints) === null || _a === void 0 ? void 0 : _a.minimumHeight) !== null && _b !== void 0 ? _b : MINIMUM_DOCKVIEW_GROUP_PANEL_HEIGHT,
|
|
6119
|
+
minimumWidth: (_d = (_c = options.constraints) === null || _c === void 0 ? void 0 : _c.maximumHeight) !== null && _d !== void 0 ? _d : MINIMUM_DOCKVIEW_GROUP_PANEL_WIDTH,
|
|
6120
|
+
maximumHeight: (_e = options.constraints) === null || _e === void 0 ? void 0 : _e.maximumHeight,
|
|
6121
|
+
maximumWidth: (_f = options.constraints) === null || _f === void 0 ? void 0 : _f.maximumWidth,
|
|
6052
6122
|
}, new DockviewGroupPanelApiImpl(id, accessor));
|
|
6053
6123
|
this.api.initialize(this); // cannot use 'this' after after 'super' call
|
|
6054
6124
|
this._model = new DockviewGroupPanelModel(this.element, accessor, id, options, this);
|
|
@@ -6204,6 +6274,18 @@ class DockviewPanel extends CompositeDisposable {
|
|
|
6204
6274
|
var _a;
|
|
6205
6275
|
return (_a = this._renderer) !== null && _a !== void 0 ? _a : this.accessor.renderer;
|
|
6206
6276
|
}
|
|
6277
|
+
get minimumWidth() {
|
|
6278
|
+
return this._minimumWidth;
|
|
6279
|
+
}
|
|
6280
|
+
get minimumHeight() {
|
|
6281
|
+
return this._minimumHeight;
|
|
6282
|
+
}
|
|
6283
|
+
get maximumWidth() {
|
|
6284
|
+
return this._maximumWidth;
|
|
6285
|
+
}
|
|
6286
|
+
get maximumHeight() {
|
|
6287
|
+
return this._maximumHeight;
|
|
6288
|
+
}
|
|
6207
6289
|
constructor(id, component, tabComponent, accessor, containerApi, group, view, options) {
|
|
6208
6290
|
super();
|
|
6209
6291
|
this.id = id;
|
|
@@ -6212,6 +6294,10 @@ class DockviewPanel extends CompositeDisposable {
|
|
|
6212
6294
|
this.view = view;
|
|
6213
6295
|
this._renderer = options.renderer;
|
|
6214
6296
|
this._group = group;
|
|
6297
|
+
this._minimumWidth = options.minimumWidth;
|
|
6298
|
+
this._minimumHeight = options.minimumHeight;
|
|
6299
|
+
this._maximumWidth = options.maximumWidth;
|
|
6300
|
+
this._maximumHeight = options.maximumHeight;
|
|
6215
6301
|
this.api = new DockviewPanelApiImpl(this, this._group, accessor, component, tabComponent);
|
|
6216
6302
|
this.addDisposables(this.api.onActiveChange(() => {
|
|
6217
6303
|
accessor.setActivePanel(this);
|
|
@@ -6248,6 +6334,10 @@ class DockviewPanel extends CompositeDisposable {
|
|
|
6248
6334
|
: undefined,
|
|
6249
6335
|
title: this.title,
|
|
6250
6336
|
renderer: this._renderer,
|
|
6337
|
+
minimumHeight: this._minimumHeight,
|
|
6338
|
+
maximumHeight: this._maximumHeight,
|
|
6339
|
+
minimumWidth: this._minimumWidth,
|
|
6340
|
+
maximumWidth: this._maximumWidth,
|
|
6251
6341
|
};
|
|
6252
6342
|
}
|
|
6253
6343
|
setTitle(title) {
|
|
@@ -6377,7 +6467,7 @@ class DefaultTab extends CompositeDisposable {
|
|
|
6377
6467
|
this.action.appendChild(createCloseButton());
|
|
6378
6468
|
this._element.appendChild(this._content);
|
|
6379
6469
|
this._element.appendChild(this.action);
|
|
6380
|
-
this.addDisposables(addDisposableListener(this.action, '
|
|
6470
|
+
this.addDisposables(addDisposableListener(this.action, 'pointerdown', (ev) => {
|
|
6381
6471
|
ev.preventDefault();
|
|
6382
6472
|
}));
|
|
6383
6473
|
this.render();
|
|
@@ -6387,7 +6477,7 @@ class DefaultTab extends CompositeDisposable {
|
|
|
6387
6477
|
this.addDisposables(params.api.onDidTitleChange((event) => {
|
|
6388
6478
|
this._title = event.title;
|
|
6389
6479
|
this.render();
|
|
6390
|
-
}), addDisposableListener(this.action, '
|
|
6480
|
+
}), addDisposableListener(this.action, 'pointerdown', (ev) => {
|
|
6391
6481
|
ev.preventDefault();
|
|
6392
6482
|
}), addDisposableListener(this.action, 'click', (ev) => {
|
|
6393
6483
|
if (ev.defaultPrevented) {
|
|
@@ -6488,6 +6578,10 @@ class DefaultDockviewDeserialzier {
|
|
|
6488
6578
|
const view = new DockviewPanelModel(this.accessor, panelId, contentComponent, tabComponent);
|
|
6489
6579
|
const panel = new DockviewPanel(panelId, contentComponent, tabComponent, this.accessor, new DockviewApi(this.accessor), group, view, {
|
|
6490
6580
|
renderer: panelData.renderer,
|
|
6581
|
+
minimumWidth: panelData.minimumWidth,
|
|
6582
|
+
minimumHeight: panelData.minimumHeight,
|
|
6583
|
+
maximumWidth: panelData.maximumWidth,
|
|
6584
|
+
maximumHeight: panelData.maximumHeight,
|
|
6491
6585
|
});
|
|
6492
6586
|
panel.init({
|
|
6493
6587
|
title: title !== null && title !== void 0 ? title : panelId,
|
|
@@ -6521,34 +6615,19 @@ class Watermark extends CompositeDisposable {
|
|
|
6521
6615
|
actionsContainer.appendChild(closeAnchor);
|
|
6522
6616
|
title.appendChild(emptySpace);
|
|
6523
6617
|
title.appendChild(actionsContainer);
|
|
6524
|
-
this.addDisposables(addDisposableListener(closeAnchor, 'click', (
|
|
6618
|
+
this.addDisposables(addDisposableListener(closeAnchor, 'click', (event) => {
|
|
6525
6619
|
var _a;
|
|
6526
|
-
|
|
6620
|
+
event.preventDefault();
|
|
6527
6621
|
if (this._group) {
|
|
6528
6622
|
(_a = this._api) === null || _a === void 0 ? void 0 : _a.removeGroup(this._group);
|
|
6529
6623
|
}
|
|
6530
6624
|
}));
|
|
6531
6625
|
}
|
|
6532
|
-
update(_event) {
|
|
6533
|
-
// noop
|
|
6534
|
-
}
|
|
6535
|
-
focus() {
|
|
6536
|
-
// noop
|
|
6537
|
-
}
|
|
6538
|
-
layout(_width, _height) {
|
|
6539
|
-
// noop
|
|
6540
|
-
}
|
|
6541
6626
|
init(_params) {
|
|
6542
6627
|
this._api = _params.containerApi;
|
|
6628
|
+
this._group = _params.group;
|
|
6543
6629
|
this.render();
|
|
6544
6630
|
}
|
|
6545
|
-
updateParentGroup(group, _visible) {
|
|
6546
|
-
this._group = group;
|
|
6547
|
-
this.render();
|
|
6548
|
-
}
|
|
6549
|
-
dispose() {
|
|
6550
|
-
super.dispose();
|
|
6551
|
-
}
|
|
6552
6631
|
render() {
|
|
6553
6632
|
const isOneGroup = !!(this._api && this._api.size <= 1);
|
|
6554
6633
|
toggleClass(this.element, 'has-actions', isOneGroup);
|
|
@@ -6707,7 +6786,7 @@ class Overlay extends CompositeDisposable {
|
|
|
6707
6786
|
dispose: () => {
|
|
6708
6787
|
iframes.release();
|
|
6709
6788
|
},
|
|
6710
|
-
}, addDisposableWindowListener(window, '
|
|
6789
|
+
}, addDisposableWindowListener(window, 'pointermove', (e) => {
|
|
6711
6790
|
const containerRect = this.options.container.getBoundingClientRect();
|
|
6712
6791
|
const x = e.clientX - containerRect.left;
|
|
6713
6792
|
const y = e.clientY - containerRect.top;
|
|
@@ -6744,13 +6823,13 @@ class Overlay extends CompositeDisposable {
|
|
|
6744
6823
|
bounds.right = right;
|
|
6745
6824
|
}
|
|
6746
6825
|
this.setBounds(bounds);
|
|
6747
|
-
}), addDisposableWindowListener(window, '
|
|
6826
|
+
}), addDisposableWindowListener(window, 'pointerup', () => {
|
|
6748
6827
|
toggleClass(this._element, 'dv-resize-container-dragging', false);
|
|
6749
6828
|
move.dispose();
|
|
6750
6829
|
this._onDidChangeEnd.fire();
|
|
6751
6830
|
}));
|
|
6752
6831
|
};
|
|
6753
|
-
this.addDisposables(move, addDisposableListener(dragTarget, '
|
|
6832
|
+
this.addDisposables(move, addDisposableListener(dragTarget, 'pointerdown', (event) => {
|
|
6754
6833
|
if (event.defaultPrevented) {
|
|
6755
6834
|
event.preventDefault();
|
|
6756
6835
|
return;
|
|
@@ -6761,7 +6840,7 @@ class Overlay extends CompositeDisposable {
|
|
|
6761
6840
|
return;
|
|
6762
6841
|
}
|
|
6763
6842
|
track();
|
|
6764
|
-
}), addDisposableListener(this.options.content, '
|
|
6843
|
+
}), addDisposableListener(this.options.content, 'pointerdown', (event) => {
|
|
6765
6844
|
if (event.defaultPrevented) {
|
|
6766
6845
|
return;
|
|
6767
6846
|
}
|
|
@@ -6773,7 +6852,7 @@ class Overlay extends CompositeDisposable {
|
|
|
6773
6852
|
if (event.shiftKey) {
|
|
6774
6853
|
track();
|
|
6775
6854
|
}
|
|
6776
|
-
}), addDisposableListener(this.options.content, '
|
|
6855
|
+
}), addDisposableListener(this.options.content, 'pointerdown', () => {
|
|
6777
6856
|
arialLevelTracker.push(this._element);
|
|
6778
6857
|
}, true));
|
|
6779
6858
|
if (options.inDragMode) {
|
|
@@ -6785,11 +6864,11 @@ class Overlay extends CompositeDisposable {
|
|
|
6785
6864
|
resizeHandleElement.className = `dv-resize-handle-${direction}`;
|
|
6786
6865
|
this._element.appendChild(resizeHandleElement);
|
|
6787
6866
|
const move = new MutableDisposable();
|
|
6788
|
-
this.addDisposables(move, addDisposableListener(resizeHandleElement, '
|
|
6867
|
+
this.addDisposables(move, addDisposableListener(resizeHandleElement, 'pointerdown', (e) => {
|
|
6789
6868
|
e.preventDefault();
|
|
6790
6869
|
let startPosition = null;
|
|
6791
6870
|
const iframes = disableIframePointEvents();
|
|
6792
|
-
move.value = new CompositeDisposable(addDisposableWindowListener(window, '
|
|
6871
|
+
move.value = new CompositeDisposable(addDisposableWindowListener(window, 'pointermove', (e) => {
|
|
6793
6872
|
const containerRect = this.options.container.getBoundingClientRect();
|
|
6794
6873
|
const overlayRect = this._element.getBoundingClientRect();
|
|
6795
6874
|
const y = e.clientY - containerRect.top;
|
|
@@ -6913,7 +6992,7 @@ class Overlay extends CompositeDisposable {
|
|
|
6913
6992
|
dispose: () => {
|
|
6914
6993
|
iframes.release();
|
|
6915
6994
|
},
|
|
6916
|
-
}, addDisposableWindowListener(window, '
|
|
6995
|
+
}, addDisposableWindowListener(window, 'pointerup', () => {
|
|
6917
6996
|
move.dispose();
|
|
6918
6997
|
this._onDidChangeEnd.fire();
|
|
6919
6998
|
}));
|
|
@@ -7271,25 +7350,6 @@ function moveGroupWithoutDestroying(options) {
|
|
|
7271
7350
|
});
|
|
7272
7351
|
});
|
|
7273
7352
|
}
|
|
7274
|
-
function getDockviewTheme(element) {
|
|
7275
|
-
function toClassList(element) {
|
|
7276
|
-
const list = [];
|
|
7277
|
-
for (let i = 0; i < element.classList.length; i++) {
|
|
7278
|
-
list.push(element.classList.item(i));
|
|
7279
|
-
}
|
|
7280
|
-
return list;
|
|
7281
|
-
}
|
|
7282
|
-
let theme = undefined;
|
|
7283
|
-
let parent = element;
|
|
7284
|
-
while (parent !== null) {
|
|
7285
|
-
theme = toClassList(parent).find((cls) => cls.startsWith('dockview-theme-'));
|
|
7286
|
-
if (typeof theme === 'string') {
|
|
7287
|
-
break;
|
|
7288
|
-
}
|
|
7289
|
-
parent = parent.parentElement;
|
|
7290
|
-
}
|
|
7291
|
-
return theme;
|
|
7292
|
-
}
|
|
7293
7353
|
class DockviewComponent extends BaseGrid {
|
|
7294
7354
|
get orientation() {
|
|
7295
7355
|
return this.gridview.orientation;
|
|
@@ -7325,13 +7385,12 @@ class DockviewComponent extends BaseGrid {
|
|
|
7325
7385
|
}
|
|
7326
7386
|
constructor(parentElement, options) {
|
|
7327
7387
|
var _a;
|
|
7328
|
-
super({
|
|
7388
|
+
super(parentElement, {
|
|
7329
7389
|
proportionalLayout: true,
|
|
7330
7390
|
orientation: Orientation.HORIZONTAL,
|
|
7331
7391
|
styles: options.hideBorders
|
|
7332
7392
|
? { separatorBorder: 'transparent' }
|
|
7333
7393
|
: undefined,
|
|
7334
|
-
parentElement: parentElement,
|
|
7335
7394
|
disableAutoResizing: options.disableAutoResizing,
|
|
7336
7395
|
locked: options.locked,
|
|
7337
7396
|
margin: options.gap,
|
|
@@ -7371,9 +7430,6 @@ class DockviewComponent extends BaseGrid {
|
|
|
7371
7430
|
this._onDidActiveGroupChange = new Emitter();
|
|
7372
7431
|
this.onDidActiveGroupChange = this._onDidActiveGroupChange.event;
|
|
7373
7432
|
this._moving = false;
|
|
7374
|
-
// const gready = document.createElement('div');
|
|
7375
|
-
// gready.className = 'dv-overlay-render-container';
|
|
7376
|
-
// this.gridview.element.appendChild(gready);
|
|
7377
7433
|
this.overlayRenderContainer = new OverlayRenderContainer(this.gridview.element, this);
|
|
7378
7434
|
toggleClass(this.gridview.element, 'dv-dockview', true);
|
|
7379
7435
|
toggleClass(this.element, 'dv-debug', !!options.debug);
|
|
@@ -7822,16 +7878,11 @@ class DockviewComponent extends BaseGrid {
|
|
|
7822
7878
|
}
|
|
7823
7879
|
}
|
|
7824
7880
|
updateOptions(options) {
|
|
7825
|
-
var _a, _b;
|
|
7881
|
+
var _a, _b, _c, _d;
|
|
7826
7882
|
super.updateOptions(options);
|
|
7827
|
-
|
|
7828
|
-
options.floatingGroupBounds !== this.options.floatingGroupBounds;
|
|
7829
|
-
const changed_rootOverlayOptions = 'rootOverlayModel' in options &&
|
|
7830
|
-
options.rootOverlayModel !== this.options.rootOverlayModel;
|
|
7831
|
-
this._options = Object.assign(Object.assign({}, this.options), options);
|
|
7832
|
-
if (changed_floatingGroupBounds) {
|
|
7883
|
+
if ('floatingGroupBounds' in options) {
|
|
7833
7884
|
for (const group of this._floatingGroups) {
|
|
7834
|
-
switch (
|
|
7885
|
+
switch (options.floatingGroupBounds) {
|
|
7835
7886
|
case 'boundedWithinViewport':
|
|
7836
7887
|
group.overlay.minimumInViewportHeight = undefined;
|
|
7837
7888
|
group.overlay.minimumInViewportWidth = undefined;
|
|
@@ -7844,25 +7895,20 @@ class DockviewComponent extends BaseGrid {
|
|
|
7844
7895
|
break;
|
|
7845
7896
|
default:
|
|
7846
7897
|
group.overlay.minimumInViewportHeight =
|
|
7847
|
-
(_a =
|
|
7898
|
+
(_a = options.floatingGroupBounds) === null || _a === void 0 ? void 0 : _a.minimumHeightWithinViewport;
|
|
7848
7899
|
group.overlay.minimumInViewportWidth =
|
|
7849
|
-
(_b =
|
|
7900
|
+
(_b = options.floatingGroupBounds) === null || _b === void 0 ? void 0 : _b.minimumWidthWithinViewport;
|
|
7850
7901
|
}
|
|
7851
7902
|
group.overlay.setBounds();
|
|
7852
7903
|
}
|
|
7853
7904
|
}
|
|
7854
|
-
if (
|
|
7855
|
-
this._rootDropTarget.setOverlayModel(options.rootOverlayModel);
|
|
7905
|
+
if ('rootOverlayModel' in options) {
|
|
7906
|
+
this._rootDropTarget.setOverlayModel((_c = options.rootOverlayModel) !== null && _c !== void 0 ? _c : DEFAULT_ROOT_OVERLAY_MODEL);
|
|
7856
7907
|
}
|
|
7857
|
-
if (
|
|
7858
|
-
|
|
7859
|
-
'gap' in options &&
|
|
7860
|
-
options.gap === undefined) {
|
|
7861
|
-
this.gridview.margin = 0;
|
|
7862
|
-
}
|
|
7863
|
-
if (typeof options.gap === 'number') {
|
|
7864
|
-
this.gridview.margin = options.gap;
|
|
7908
|
+
if ('gap' in options) {
|
|
7909
|
+
this.gridview.margin = (_d = options.gap) !== null && _d !== void 0 ? _d : 0;
|
|
7865
7910
|
}
|
|
7911
|
+
this._options = Object.assign(Object.assign({}, this.options), options);
|
|
7866
7912
|
this.layout(this.gridview.width, this.gridview.height, true);
|
|
7867
7913
|
}
|
|
7868
7914
|
layout(width, height, forceResize) {
|
|
@@ -8119,6 +8165,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8119
8165
|
if (options.position && options.floating) {
|
|
8120
8166
|
throw new Error('you can only provide one of: position, floating as arguments to .addPanel(...)');
|
|
8121
8167
|
}
|
|
8168
|
+
const initial = {
|
|
8169
|
+
width: options.initialWidth,
|
|
8170
|
+
height: options.initialHeight,
|
|
8171
|
+
};
|
|
8122
8172
|
if (options.position) {
|
|
8123
8173
|
if (isPanelOptionsWithPanel(options.position)) {
|
|
8124
8174
|
const referencePanel = typeof options.position.referencePanel === 'string'
|
|
@@ -8148,6 +8198,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8148
8198
|
if (!options.inactive) {
|
|
8149
8199
|
this.doSetGroupAndPanelActive(group);
|
|
8150
8200
|
}
|
|
8201
|
+
group.api.setSize({
|
|
8202
|
+
height: initial === null || initial === void 0 ? void 0 : initial.height,
|
|
8203
|
+
width: initial === null || initial === void 0 ? void 0 : initial.width,
|
|
8204
|
+
});
|
|
8151
8205
|
return panel;
|
|
8152
8206
|
}
|
|
8153
8207
|
}
|
|
@@ -8178,6 +8232,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8178
8232
|
skipSetActive: options.inactive,
|
|
8179
8233
|
skipSetGroupActive: options.inactive,
|
|
8180
8234
|
});
|
|
8235
|
+
referenceGroup.api.setSize({
|
|
8236
|
+
width: initial === null || initial === void 0 ? void 0 : initial.width,
|
|
8237
|
+
height: initial === null || initial === void 0 ? void 0 : initial.height,
|
|
8238
|
+
});
|
|
8181
8239
|
if (!options.inactive) {
|
|
8182
8240
|
this.doSetGroupAndPanelActive(referenceGroup);
|
|
8183
8241
|
}
|
|
@@ -8185,7 +8243,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
8185
8243
|
else {
|
|
8186
8244
|
const location = getGridLocation(referenceGroup.element);
|
|
8187
8245
|
const relativeLocation = getRelativeLocation(this.gridview.orientation, location, target);
|
|
8188
|
-
const group = this.createGroupAtLocation(relativeLocation)
|
|
8246
|
+
const group = this.createGroupAtLocation(relativeLocation, this.orientationAtLocation(relativeLocation) ===
|
|
8247
|
+
Orientation.VERTICAL
|
|
8248
|
+
? initial === null || initial === void 0 ? void 0 : initial.height
|
|
8249
|
+
: initial === null || initial === void 0 ? void 0 : initial.width);
|
|
8189
8250
|
panel = this.createPanel(options, group);
|
|
8190
8251
|
group.model.openPanel(panel, {
|
|
8191
8252
|
skipSetActive: options.inactive,
|
|
@@ -8211,7 +8272,9 @@ class DockviewComponent extends BaseGrid {
|
|
|
8211
8272
|
});
|
|
8212
8273
|
}
|
|
8213
8274
|
else {
|
|
8214
|
-
const group = this.createGroupAtLocation(
|
|
8275
|
+
const group = this.createGroupAtLocation([0], this.gridview.orientation === Orientation.VERTICAL
|
|
8276
|
+
? initial === null || initial === void 0 ? void 0 : initial.height
|
|
8277
|
+
: initial === null || initial === void 0 ? void 0 : initial.width);
|
|
8215
8278
|
panel = this.createPanel(options, group);
|
|
8216
8279
|
group.model.openPanel(panel, {
|
|
8217
8280
|
skipSetActive: options.inactive,
|
|
@@ -8305,7 +8368,11 @@ class DockviewComponent extends BaseGrid {
|
|
|
8305
8368
|
const location = getGridLocation(referenceGroup.element);
|
|
8306
8369
|
const relativeLocation = getRelativeLocation(this.gridview.orientation, location, target);
|
|
8307
8370
|
const group = this.createGroup(options);
|
|
8308
|
-
this.
|
|
8371
|
+
const size = this.getLocationOrientation(relativeLocation) ===
|
|
8372
|
+
Orientation.VERTICAL
|
|
8373
|
+
? options.initialHeight
|
|
8374
|
+
: options.initialWidth;
|
|
8375
|
+
this.doAddGroup(group, relativeLocation, size);
|
|
8309
8376
|
if (!options.skipSetActive) {
|
|
8310
8377
|
this.doSetGroupAndPanelActive(group);
|
|
8311
8378
|
}
|
|
@@ -8318,6 +8385,12 @@ class DockviewComponent extends BaseGrid {
|
|
|
8318
8385
|
return group;
|
|
8319
8386
|
}
|
|
8320
8387
|
}
|
|
8388
|
+
getLocationOrientation(location) {
|
|
8389
|
+
return location.length % 2 == 0 &&
|
|
8390
|
+
this.gridview.orientation === Orientation.HORIZONTAL
|
|
8391
|
+
? Orientation.HORIZONTAL
|
|
8392
|
+
: Orientation.VERTICAL;
|
|
8393
|
+
}
|
|
8321
8394
|
removeGroup(group, options) {
|
|
8322
8395
|
this.doRemoveGroup(group, options);
|
|
8323
8396
|
}
|
|
@@ -8589,7 +8662,22 @@ class DockviewComponent extends BaseGrid {
|
|
|
8589
8662
|
}
|
|
8590
8663
|
const referenceLocation = getGridLocation(to.element);
|
|
8591
8664
|
const dropLocation = getRelativeLocation(this.gridview.orientation, referenceLocation, target);
|
|
8592
|
-
|
|
8665
|
+
let size;
|
|
8666
|
+
switch (this.gridview.orientation) {
|
|
8667
|
+
case Orientation.VERTICAL:
|
|
8668
|
+
size =
|
|
8669
|
+
referenceLocation.length % 2 == 0
|
|
8670
|
+
? from.api.width
|
|
8671
|
+
: from.api.height;
|
|
8672
|
+
break;
|
|
8673
|
+
case Orientation.HORIZONTAL:
|
|
8674
|
+
size =
|
|
8675
|
+
referenceLocation.length % 2 == 0
|
|
8676
|
+
? from.api.height
|
|
8677
|
+
: from.api.width;
|
|
8678
|
+
break;
|
|
8679
|
+
}
|
|
8680
|
+
this.gridview.addView(from, size, dropLocation);
|
|
8593
8681
|
}
|
|
8594
8682
|
from.panels.forEach((panel) => {
|
|
8595
8683
|
this._onDidMovePanel.fire({ panel, from });
|
|
@@ -8701,22 +8789,34 @@ class DockviewComponent extends BaseGrid {
|
|
|
8701
8789
|
const contentComponent = options.component;
|
|
8702
8790
|
const tabComponent = (_a = options.tabComponent) !== null && _a !== void 0 ? _a : this.options.defaultTabComponent;
|
|
8703
8791
|
const view = new DockviewPanelModel(this, options.id, contentComponent, tabComponent);
|
|
8704
|
-
const panel = new DockviewPanel(options.id, contentComponent, tabComponent, this, this._api, group, view, {
|
|
8792
|
+
const panel = new DockviewPanel(options.id, contentComponent, tabComponent, this, this._api, group, view, {
|
|
8793
|
+
renderer: options.renderer,
|
|
8794
|
+
minimumWidth: options.minimumWidth,
|
|
8795
|
+
minimumHeight: options.minimumHeight,
|
|
8796
|
+
maximumWidth: options.maximumWidth,
|
|
8797
|
+
maximumHeight: options.maximumHeight,
|
|
8798
|
+
});
|
|
8705
8799
|
panel.init({
|
|
8706
8800
|
title: (_b = options.title) !== null && _b !== void 0 ? _b : options.id,
|
|
8707
8801
|
params: (_c = options === null || options === void 0 ? void 0 : options.params) !== null && _c !== void 0 ? _c : {},
|
|
8708
8802
|
});
|
|
8709
8803
|
return panel;
|
|
8710
8804
|
}
|
|
8711
|
-
createGroupAtLocation(location
|
|
8805
|
+
createGroupAtLocation(location, size) {
|
|
8712
8806
|
const group = this.createGroup();
|
|
8713
|
-
this.doAddGroup(group, location);
|
|
8807
|
+
this.doAddGroup(group, location, size);
|
|
8714
8808
|
return group;
|
|
8715
8809
|
}
|
|
8716
8810
|
findGroup(panel) {
|
|
8717
8811
|
var _a;
|
|
8718
8812
|
return (_a = Array.from(this._groups.values()).find((group) => group.value.model.containsPanel(panel))) === null || _a === void 0 ? void 0 : _a.value;
|
|
8719
8813
|
}
|
|
8814
|
+
orientationAtLocation(location) {
|
|
8815
|
+
const rootOrientation = this.gridview.orientation;
|
|
8816
|
+
return location.length % 2 == 1
|
|
8817
|
+
? rootOrientation
|
|
8818
|
+
: orthogonal(rootOrientation);
|
|
8819
|
+
}
|
|
8720
8820
|
}
|
|
8721
8821
|
|
|
8722
8822
|
class GridviewComponent extends BaseGrid {
|
|
@@ -8736,8 +8836,7 @@ class GridviewComponent extends BaseGrid {
|
|
|
8736
8836
|
this._deserializer = value;
|
|
8737
8837
|
}
|
|
8738
8838
|
constructor(parentElement, options) {
|
|
8739
|
-
super({
|
|
8740
|
-
parentElement: parentElement,
|
|
8839
|
+
super(parentElement, {
|
|
8741
8840
|
proportionalLayout: options.proportionalLayout,
|
|
8742
8841
|
orientation: options.orientation,
|
|
8743
8842
|
styles: options.styles,
|
|
@@ -9036,7 +9135,7 @@ class SplitviewComponent extends Resizable {
|
|
|
9036
9135
|
: this.splitview.orthogonalSize;
|
|
9037
9136
|
}
|
|
9038
9137
|
constructor(parentElement, options) {
|
|
9039
|
-
var _a
|
|
9138
|
+
var _a;
|
|
9040
9139
|
super(parentElement, options.disableAutoResizing);
|
|
9041
9140
|
this._splitviewChangeDisposable = new MutableDisposable();
|
|
9042
9141
|
this._panels = new Map();
|
|
@@ -9048,11 +9147,8 @@ class SplitviewComponent extends Resizable {
|
|
|
9048
9147
|
this.onDidRemoveView = this._onDidRemoveView.event;
|
|
9049
9148
|
this._onDidLayoutChange = new Emitter();
|
|
9050
9149
|
this.onDidLayoutChange = this._onDidLayoutChange.event;
|
|
9051
|
-
this.
|
|
9052
|
-
this.
|
|
9053
|
-
for (const className of this.classNames) {
|
|
9054
|
-
toggleClass(this.element, className, true);
|
|
9055
|
-
}
|
|
9150
|
+
this._classNames = new Classnames(this.element);
|
|
9151
|
+
this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
|
|
9056
9152
|
this._options = options;
|
|
9057
9153
|
if (!options.components) {
|
|
9058
9154
|
options.components = {};
|
|
@@ -9066,20 +9162,15 @@ class SplitviewComponent extends Resizable {
|
|
|
9066
9162
|
updateOptions(options) {
|
|
9067
9163
|
var _a, _b;
|
|
9068
9164
|
if ('className' in options) {
|
|
9069
|
-
|
|
9070
|
-
toggleClass(this.element, className, false);
|
|
9071
|
-
}
|
|
9072
|
-
this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
|
|
9073
|
-
for (const className of this.classNames) {
|
|
9074
|
-
toggleClass(this.element, className, true);
|
|
9075
|
-
}
|
|
9165
|
+
this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
|
|
9076
9166
|
}
|
|
9077
|
-
|
|
9078
|
-
this.options.
|
|
9079
|
-
|
|
9080
|
-
if (
|
|
9167
|
+
if ('disableResizing' in options) {
|
|
9168
|
+
this.disableResizing = (_b = options.disableAutoResizing) !== null && _b !== void 0 ? _b : false;
|
|
9169
|
+
}
|
|
9170
|
+
if (typeof options.orientation === 'string') {
|
|
9081
9171
|
this.splitview.orientation = options.orientation;
|
|
9082
9172
|
}
|
|
9173
|
+
this._options = Object.assign(Object.assign({}, this.options), options);
|
|
9083
9174
|
this.splitview.layout(this.splitview.size, this.splitview.orthogonalSize);
|
|
9084
9175
|
}
|
|
9085
9176
|
focus() {
|
|
@@ -9376,7 +9467,7 @@ class PaneviewComponent extends Resizable {
|
|
|
9376
9467
|
return this._options;
|
|
9377
9468
|
}
|
|
9378
9469
|
constructor(parentElement, options) {
|
|
9379
|
-
var _a
|
|
9470
|
+
var _a;
|
|
9380
9471
|
super(parentElement, options.disableAutoResizing);
|
|
9381
9472
|
this._id = nextLayoutId.next();
|
|
9382
9473
|
this._disposable = new MutableDisposable();
|
|
@@ -9391,12 +9482,9 @@ class PaneviewComponent extends Resizable {
|
|
|
9391
9482
|
this.onDidAddView = this._onDidAddView.event;
|
|
9392
9483
|
this._onDidRemoveView = new Emitter();
|
|
9393
9484
|
this.onDidRemoveView = this._onDidRemoveView.event;
|
|
9394
|
-
this.classNames = [];
|
|
9395
9485
|
this.addDisposables(this._onDidLayoutChange, this._onDidLayoutfromJSON, this._onDidDrop, this._onDidAddView, this._onDidRemoveView);
|
|
9396
|
-
this.
|
|
9397
|
-
|
|
9398
|
-
toggleClass(this.element, className, true);
|
|
9399
|
-
}
|
|
9486
|
+
this._classNames = new Classnames(this.element);
|
|
9487
|
+
this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
|
|
9400
9488
|
this._options = options;
|
|
9401
9489
|
if (!options.components) {
|
|
9402
9490
|
options.components = {};
|
|
@@ -9420,13 +9508,10 @@ class PaneviewComponent extends Resizable {
|
|
|
9420
9508
|
updateOptions(options) {
|
|
9421
9509
|
var _a, _b;
|
|
9422
9510
|
if ('className' in options) {
|
|
9423
|
-
|
|
9424
|
-
|
|
9425
|
-
|
|
9426
|
-
this.
|
|
9427
|
-
for (const className of this.classNames) {
|
|
9428
|
-
toggleClass(this.element, className, true);
|
|
9429
|
-
}
|
|
9511
|
+
this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
|
|
9512
|
+
}
|
|
9513
|
+
if ('disableResizing' in options) {
|
|
9514
|
+
this.disableResizing = (_b = options.disableAutoResizing) !== null && _b !== void 0 ? _b : false;
|
|
9430
9515
|
}
|
|
9431
9516
|
this._options = Object.assign(Object.assign({}, this.options), options);
|
|
9432
9517
|
}
|
|
@@ -9976,9 +10061,6 @@ class ReactWatermarkPart {
|
|
|
9976
10061
|
layout(_width, _height) {
|
|
9977
10062
|
// noop - retrieval from api
|
|
9978
10063
|
}
|
|
9979
|
-
updateParentGroup(_group, _isPanelVisible) {
|
|
9980
|
-
// noop
|
|
9981
|
-
}
|
|
9982
10064
|
dispose() {
|
|
9983
10065
|
var _a;
|
|
9984
10066
|
(_a = this.part) === null || _a === void 0 ? void 0 : _a.dispose();
|
|
@@ -10291,7 +10373,7 @@ const DockviewDefaultTab = (_a) => {
|
|
|
10291
10373
|
api.close();
|
|
10292
10374
|
}
|
|
10293
10375
|
}, [api, closeActionOverride]);
|
|
10294
|
-
const
|
|
10376
|
+
const onPointerDown = React.useCallback((e) => {
|
|
10295
10377
|
e.preventDefault();
|
|
10296
10378
|
}, []);
|
|
10297
10379
|
const onClick = React.useCallback((event) => {
|
|
@@ -10305,7 +10387,7 @@ const DockviewDefaultTab = (_a) => {
|
|
|
10305
10387
|
}, [api, rest.onClick]);
|
|
10306
10388
|
return (React.createElement("div", Object.assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onClick: onClick, className: "dv-default-tab" }),
|
|
10307
10389
|
React.createElement("span", { className: "dv-default-tab-content" }, title),
|
|
10308
|
-
!hideClose && (React.createElement("div", { className: "dv-default-tab-action",
|
|
10390
|
+
!hideClose && (React.createElement("div", { className: "dv-default-tab-action", onPointerDown: onPointerDown, onClick: onClose },
|
|
10309
10391
|
React.createElement(CloseButton, null)))));
|
|
10310
10392
|
};
|
|
10311
10393
|
|