dockview-react 1.17.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dockview-react.amd.js +243 -188
- 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 +242 -187
- package/dist/dockview-react.amd.noStyle.js.map +1 -1
- package/dist/dockview-react.cjs.js +243 -188
- package/dist/dockview-react.cjs.js.map +1 -1
- package/dist/dockview-react.esm.js +244 -187
- 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 +243 -188
- 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 +242 -187
- package/dist/dockview-react.noStyle.js.map +1 -1
- package/dist/styles/dockview.css +133 -135
- package/package.json +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-react
|
|
3
|
-
* @version
|
|
3
|
+
* @version 2.0.0
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -34,7 +34,7 @@ function styleInject(css, ref) {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
var css_248z = ".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 = ".dv-svg {\n display: inline-block;\n fill: currentcolor;\n line-height: 1;\n stroke: currentcolor;\n stroke-width: 0;\n}\n.dockview-theme-dark {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: 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-overlay-z-index: 999;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n}\n\n.dockview-theme-light {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: 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-overlay-z-index: 999;\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-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-overlay-z-index: 999;\n --dv-group-view-background-color: #1e1e1e;\n --dv-tabs-and-actions-container-background-color: #252526;\n --dv-activegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-activegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-inactivegroup-visiblepanel-tab-background-color: #1e1e1e;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #2d2d2d;\n --dv-tab-divider-color: #1e1e1e;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: #969696;\n --dv-inactivegroup-visiblepanel-tab-color: #8f8f8f;\n --dv-inactivegroup-hiddenpanel-tab-color: #626262;\n --dv-separator-border: rgb(68, 68, 68);\n --dv-paneview-header-border-color: rgba(204, 204, 204, 0.2);\n --dv-tabs-and-actions-container-background-color: #2d2d30;\n --dv-tabs-and-actions-container-height: 20px;\n --dv-tabs-and-actions-container-font-size: 11px;\n --dv-activegroup-visiblepanel-tab-background-color: #007acc;\n --dv-inactivegroup-visiblepanel-tab-background-color: #3f3f46;\n --dv-activegroup-visiblepanel-tab-color: white;\n --dv-activegroup-hiddenpanel-tab-color: white;\n --dv-inactivegroup-visiblepanel-tab-color: white;\n --dv-inactivegroup-hiddenpanel-tab-color: white;\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-activegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-active-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-activegroup-hiddenpanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container {\n box-sizing: content-box;\n border-bottom: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-active-tab {\n border-top: 2px solid var(--dv-inactivegroup-visiblepanel-tab-background-color);\n}\n.dockview-theme-vs .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container .dv-tab.dv-inactive-tab {\n border-top: 2px solid var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n}\n\n.dockview-theme-abyss {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: 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-overlay-z-index: 999;\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-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-overlay-z-index: 999;\n --dv-group-view-background-color: #282a36;\n --dv-tabs-and-actions-container-background-color: #191a21;\n --dv-activegroup-visiblepanel-tab-background-color: #282a36;\n --dv-activegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-inactivegroup-visiblepanel-tab-background-color: #282a36;\n --dv-inactivegroup-hiddenpanel-tab-background-color: #21222c;\n --dv-tab-divider-color: #191a21;\n --dv-activegroup-visiblepanel-tab-color: rgb(248, 248, 242);\n --dv-activegroup-hiddenpanel-tab-color: rgb(98, 114, 164);\n --dv-inactivegroup-visiblepanel-tab-color: rgba(248, 248, 242, 0.5);\n --dv-inactivegroup-hiddenpanel-tab-color: rgba(98, 114, 164, 0.5);\n --dv-separator-border: #bd93f9;\n --dv-paneview-header-border-color: #bd93f9;\n --dv-paneview-active-outline-color: #6272a4;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n top: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #94527e;\n z-index: 999;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab {\n position: relative;\n}\n.dockview-theme-dracula .dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab::after {\n position: absolute;\n left: 0px;\n bottom: 0px;\n content: \"\";\n width: 100%;\n height: 1px;\n background-color: #5e3d5a;\n z-index: 999;\n}\n\n.dockview-theme-replit {\n --dv-paneview-active-outline-color: dodgerblue;\n --dv-tabs-and-actions-container-font-size: 13px;\n --dv-tabs-and-actions-container-height: 35px;\n --dv-drag-over-background-color: rgba(83, 89, 93, 0.5);\n --dv-drag-over-border-color: 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-overlay-z-index: 999;\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-separator-handle-background-color: #cfd1d3;\n --dv-separator-handle-hover-background-color: #babbbb;\n}\n.dockview-theme-replit .dv-resize-container:has(> .dv-groupview) {\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-groupview {\n overflow: hidden;\n border-radius: 10px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container {\n border-bottom: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab {\n margin: 4px;\n border-radius: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab .dv-svg {\n height: 8px;\n width: 8px;\n}\n.dockview-theme-replit .dv-groupview .dv-tabs-and-actions-container .dv-tab:hover {\n background-color: #e4e5e6 !important;\n}\n.dockview-theme-replit .dv-groupview .dv-content-container {\n background-color: #fcfcfc;\n}\n.dockview-theme-replit .dv-groupview.dv-active-group {\n border: 1px solid rgba(128, 128, 128, 0.35);\n}\n.dockview-theme-replit .dv-groupview.dv-inactive-group {\n border: 1px solid transparent;\n}\n.dockview-theme-replit .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 .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled)::after {\n content: \"\";\n height: 40px;\n width: 4px;\n border-radius: 2px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--dv-separator-handle-background-color);\n position: absolute;\n}\n.dockview-theme-replit .dv-horizontal > .dv-sash-container > .dv-sash:not(.disabled):hover::after {\n background-color: var(--dv-separator-handle-hover-background-color);\n}\n.dv-drop-target {\n position: relative;\n}\n.dv-drop-target > .dv-drop-target-dropzone {\n position: absolute;\n left: 0px;\n top: 0px;\n height: 100%;\n width: 100%;\n z-index: 1000;\n pointer-events: none;\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection {\n position: relative;\n box-sizing: border-box;\n height: 100%;\n width: 100%;\n 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.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-top.dv-drop-target-small-vertical {\n border-top: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-bottom.dv-drop-target-small-vertical {\n border-bottom: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-left.dv-drop-target-small-horizontal {\n border-left: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-drop-target > .dv-drop-target-dropzone > .dv-drop-target-selection.dv-drop-target-right.dv-drop-target-small-horizontal {\n border-right: 1px solid var(--dv-drag-over-border-color);\n}\n.dv-dockview {\n position: relative;\n background-color: var(--dv-group-view-background-color);\n}\n.dv-dockview .dv-watermark-container {\n position: absolute;\n top: 0px;\n left: 0px;\n height: 100%;\n width: 100%;\n z-index: 1;\n}\n.dv-dockview .dv-overlay-render-container {\n position: relative;\n}\n\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-active-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-activegroup-hiddenpanel-tab-background-color);\n color: var(--dv-activegroup-hiddenpanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-active-tab {\n background-color: var(--dv-inactivegroup-visiblepanel-tab-background-color);\n color: var(--dv-inactivegroup-visiblepanel-tab-color);\n}\n.dv-groupview.dv-inactive-group > .dv-tabs-and-actions-container > .dv-tabs-container > .dv-tab.dv-inactive-tab {\n background-color: var(--dv-inactivegroup-hiddenpanel-tab-background-color);\n color: var(--dv-inactivegroup-hiddenpanel-tab-color);\n}\n\n/**\n * when a tab is dragged we lose the above stylings because they are conditional on parent elements\n * therefore we also set some stylings for the dragging event\n **/\n.dv-tab.dv-tab-dragging {\n background-color: var(--dv-activegroup-visiblepanel-tab-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-groupview {\n display: flex;\n flex-direction: column;\n height: 100%;\n background-color: var(--dv-group-view-background-color);\n overflow: hidden;\n}\n.dv-groupview:focus {\n outline: none;\n}\n.dv-groupview.dv-empty > .dv-tabs-and-actions-container {\n display: none;\n}\n.dv-groupview > .dv-content-container {\n flex-grow: 1;\n min-height: 0;\n outline: none;\n}\n.dv-root-wrapper {\n height: 100%;\n width: 100%;\n}\n.dv-grid-view,\n.dv-branch-node {\n height: 100%;\n width: 100%;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-top {\n background-color: red;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-bottom {\n background-color: green;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-left {\n background-color: yellow;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-right {\n background-color: blue;\n}\n.dv-debug .dv-resize-container .dv-resize-handle-topleft,\n.dv-debug .dv-resize-container .dv-resize-handle-topright,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomleft,\n.dv-debug .dv-resize-container .dv-resize-handle-bottomright {\n background-color: cyan;\n}\n\n.dv-resize-container {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: calc(var(--dv-overlay-z-index) - 2);\n border: 1px solid var(--dv-tab-divider-color);\n box-shadow: var(--dv-floating-box-shadow);\n}\n.dv-resize-container.dv-resize-container-dragging {\n opacity: 0.5;\n}\n.dv-resize-container .dv-resize-handle-top {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-bottom {\n height: 4px;\n width: calc(100% - 8px);\n left: 4px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ns-resize;\n}\n.dv-resize-container .dv-resize-handle-left {\n height: calc(100% - 8px);\n width: 4px;\n left: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-right {\n height: calc(100% - 8px);\n width: 4px;\n right: -2px;\n top: 4px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ew-resize;\n}\n.dv-resize-container .dv-resize-handle-topleft {\n height: 4px;\n width: 4px;\n top: -2px;\n left: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: nw-resize;\n}\n.dv-resize-container .dv-resize-handle-topright {\n height: 4px;\n width: 4px;\n right: -2px;\n top: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: ne-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomleft {\n height: 4px;\n width: 4px;\n left: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: sw-resize;\n}\n.dv-resize-container .dv-resize-handle-bottomright {\n height: 4px;\n width: 4px;\n right: -2px;\n bottom: -2px;\n z-index: var(--dv-overlay-z-index);\n position: absolute;\n cursor: se-resize;\n}\n.dv-render-overlay {\n --dv-overlay-z-index: var(--dv-overlay-z-index, 999);\n position: absolute;\n z-index: 1;\n height: 100%;\n}\n.dv-render-overlay.dv-render-overlay-float {\n z-index: calc(var(--dv-overlay-z-index) - 1);\n}\n\n.dv-debug .dv-render-overlay {\n outline: 1px solid red;\n outline-offset: -1;\n}\n.dv-pane-container {\n height: 100%;\n width: 100%;\n}\n.dv-pane-container.dv-animated .dv-view {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-pane-container .dv-view {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n padding: 0px !important;\n}\n.dv-pane-container .dv-view:not(:first-child)::before {\n background-color: transparent !important;\n}\n.dv-pane-container .dv-view:not(:first-child) .dv-pane > .dv-pane-header {\n border-top: 1px solid var(--dv-paneview-header-border-color);\n}\n.dv-pane-container .dv-view .dv-default-header {\n background-color: var(--dv-group-view-background-color);\n color: var(--dv-activegroup-visiblepanel-tab-color);\n display: flex;\n padding: 0px 8px;\n cursor: pointer;\n}\n.dv-pane-container .dv-view .dv-default-header .dv-pane-header-icon {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.dv-pane-container .dv-view .dv-default-header > span {\n padding-left: 8px;\n flex-grow: 1;\n}\n.dv-pane-container:first-of-type > .dv-pane > .dv-pane-header {\n border-top: none !important;\n}\n.dv-pane-container .dv-pane {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n height: 100%;\n}\n.dv-pane-container .dv-pane .dv-pane-header {\n box-sizing: border-box;\n user-select: none;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-header.dv-pane-draggable {\n cursor: pointer;\n}\n.dv-pane-container .dv-pane .dv-pane-header:focus:before, .dv-pane-container .dv-pane .dv-pane-header:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-pane-container .dv-pane .dv-pane-body {\n overflow-y: auto;\n overflow-x: hidden;\n flex-grow: 1;\n position: relative;\n outline: none;\n}\n.dv-pane-container .dv-pane .dv-pane-body:focus:before, .dv-pane-container .dv-pane .dv-pane-body:focus-within:before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n content: \"\";\n pointer-events: none;\n outline: 1px solid;\n outline-width: -1px;\n outline-style: solid;\n outline-offset: -1px;\n outline-color: var(--dv-paneview-active-outline-color);\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-enabled {\n background-color: black;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-disabled {\n background-color: orange;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-maximum {\n background-color: green;\n}\n.dv-debug .dv-split-view-container .dv-sash-container .dv-sash.dv-minimum {\n background-color: red;\n}\n\n.dv-split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container.dv-splitview-disabled > .dv-sash-container > .dv-sash {\n pointer-events: none;\n}\n.dv-split-view-container.dv-animation .dv-view,\n.dv-split-view-container.dv-animation .dv-sash {\n transition-duration: 0.15s;\n transition-timing-function: ease-out;\n}\n.dv-split-view-container.dv-horizontal {\n height: 100%;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash {\n height: 100%;\n width: 4px;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ew-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: w-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: e-resize;\n}\n.dv-split-view-container.dv-horizontal > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 100%;\n width: 1px;\n}\n.dv-split-view-container.dv-vertical {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash {\n width: 100%;\n height: 4px;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-enabled {\n cursor: ns-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-disabled {\n cursor: default;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-maximum {\n cursor: n-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-sash-container > .dv-sash.dv-minimum {\n cursor: s-resize;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view {\n width: 100%;\n}\n.dv-split-view-container.dv-vertical > .dv-view-container > .dv-view:not(:first-child)::before {\n height: 1px;\n width: 100%;\n}\n.dv-split-view-container .dv-sash-container {\n height: 100%;\n width: 100%;\n position: absolute;\n}\n.dv-split-view-container .dv-sash-container .dv-sash {\n position: absolute;\n z-index: 99;\n outline: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n touch-action: none;\n}\n.dv-split-view-container .dv-sash-container .dv-sash:not(.disabled):active {\n transition: background-color 0.1s ease-in-out;\n background-color: var(--dv-active-sash-color, transparent);\n}\n.dv-split-view-container .dv-sash-container .dv-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.dv-split-view-container .dv-view-container {\n position: relative;\n height: 100%;\n width: 100%;\n}\n.dv-split-view-container .dv-view-container .dv-view {\n height: 100%;\n box-sizing: border-box;\n overflow: auto;\n position: absolute;\n}\n.dv-split-view-container.dv-separator-border .dv-view:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-separator-border);\n}\n.dv-dragged {\n transform: translate3d(0px, 0px, 0px); /* forces tab to be drawn on a separate layer (see https://github.com/microsoft/vscode/issues/18733) */\n}\n\n.dv-tab {\n flex-shrink: 0;\n}\n.dv-tab:focus-within, .dv-tab:focus {\n position: relative;\n}\n.dv-tab:focus-within::after, .dv-tab:focus::after {\n position: absolute;\n content: \"\";\n height: 100%;\n width: 100%;\n top: 0px;\n left: 0px;\n pointer-events: none;\n outline: 1px solid var(--dv-tab-divider-color) !important;\n outline-offset: -1px;\n z-index: 5;\n}\n.dv-tab.dv-tab-dragging .dv-default-tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.dv-tab.dv-active-tab .dv-default-tab .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab .dv-default-tab-action {\n visibility: hidden;\n}\n.dv-tab.dv-inactive-tab .dv-default-tab:hover .dv-default-tab-action {\n visibility: visible;\n}\n.dv-tab .dv-default-tab {\n position: relative;\n height: 100%;\n display: flex;\n min-width: 80px;\n align-items: center;\n padding: 0px 8px;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.dv-tab .dv-default-tab .dv-default-tab-content {\n padding: 0px 8px;\n flex-grow: 1;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.dv-tab .dv-default-tab .dv-default-tab-action:hover {\n border-radius: 2px;\n background-color: var(--dv-icon-hover-background-color);\n}\n.dv-tabs-and-actions-container {\n display: flex;\n background-color: var(--dv-tabs-and-actions-container-background-color);\n flex-shrink: 0;\n box-sizing: border-box;\n height: var(--dv-tabs-and-actions-container-height);\n font-size: var(--dv-tabs-and-actions-container-font-size);\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container {\n flex-grow: 1;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-tabs-container .dv-tab {\n flex-grow: 1;\n}\n.dv-tabs-and-actions-container.dv-single-tab.dv-full-width-single-tab .dv-void-container {\n flex-grow: 0;\n}\n.dv-tabs-and-actions-container .dv-void-container {\n display: flex;\n flex-grow: 1;\n cursor: grab;\n}\n.dv-tabs-and-actions-container .dv-tabs-container {\n display: flex;\n overflow-x: overlay;\n overflow-y: hidden;\n scrollbar-width: thin;\n /* Track */\n /* Handle */\n}\n.dv-tabs-and-actions-container .dv-tabs-container::-webkit-scrollbar {\n height: 3px;\n}\n.dv-tabs-and-actions-container .dv-tabs-container::-webkit-scrollbar-track {\n background: transparent;\n}\n.dv-tabs-and-actions-container .dv-tabs-container::-webkit-scrollbar-thumb {\n background: var(--dv-tabs-container-scrollbar-color);\n}\n.dv-tabs-and-actions-container .dv-tabs-container .dv-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.dv-tabs-and-actions-container .dv-tabs-container .dv-tab:not(:first-child)::before {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n pointer-events: none;\n background-color: var(--dv-tab-divider-color);\n width: 1px;\n height: 100%;\n}\n.dv-watermark {\n display: flex;\n width: 100%;\n}\n.dv-watermark.dv-has-actions .dv-watermark-title .dv-actions-container {\n display: none;\n}\n.dv-watermark .dv-watermark-title {\n height: 35px;\n width: 100%;\n display: flex;\n}\n.dv-watermark .dv-watermark-content {\n flex-grow: 1;\n}\n.dv-watermark .dv-actions-container {\n display: flex;\n align-items: center;\n padding: 0px 8px;\n}\n.dv-watermark .dv-actions-container .dv-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.dv-watermark .dv-actions-container .dv-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 {
|
|
@@ -355,31 +355,6 @@ class MutableDisposable {
|
|
|
355
355
|
}
|
|
356
356
|
}
|
|
357
357
|
|
|
358
|
-
function createComponent(id, componentName, components = {}, frameworkComponents = {}, createFrameworkComponent, fallback) {
|
|
359
|
-
const Component = typeof componentName === 'string'
|
|
360
|
-
? components[componentName]
|
|
361
|
-
: undefined;
|
|
362
|
-
const FrameworkComponent = typeof componentName === 'string'
|
|
363
|
-
? frameworkComponents[componentName]
|
|
364
|
-
: undefined;
|
|
365
|
-
if (Component && FrameworkComponent) {
|
|
366
|
-
throw new Error(`Cannot create '${id}'. component '${componentName}' registered as both a component and frameworkComponent`);
|
|
367
|
-
}
|
|
368
|
-
if (FrameworkComponent) {
|
|
369
|
-
if (!createFrameworkComponent) {
|
|
370
|
-
throw new Error(`Cannot create '${id}' for framework component '${componentName}'. you must register a frameworkPanelWrapper to use framework components`);
|
|
371
|
-
}
|
|
372
|
-
return createFrameworkComponent.createComponent(id, componentName, FrameworkComponent);
|
|
373
|
-
}
|
|
374
|
-
if (!Component) {
|
|
375
|
-
if (fallback) {
|
|
376
|
-
return fallback();
|
|
377
|
-
}
|
|
378
|
-
throw new Error(`Cannot create '${id}', no component '${componentName}' provided`);
|
|
379
|
-
}
|
|
380
|
-
return new Component(id, componentName);
|
|
381
|
-
}
|
|
382
|
-
|
|
383
358
|
function watchElementResize(element, cb) {
|
|
384
359
|
const observer = new ResizeObserver((entires) => {
|
|
385
360
|
/**
|
|
@@ -848,10 +823,10 @@ class Splitview {
|
|
|
848
823
|
const tmp = this.size;
|
|
849
824
|
this.size = this.orthogonalSize;
|
|
850
825
|
this.orthogonalSize = tmp;
|
|
851
|
-
removeClasses(this.element, 'horizontal', 'vertical');
|
|
826
|
+
removeClasses(this.element, 'dv-horizontal', 'dv-vertical');
|
|
852
827
|
this.element.classList.add(this.orientation == Orientation.HORIZONTAL
|
|
853
|
-
? 'horizontal'
|
|
854
|
-
: 'vertical');
|
|
828
|
+
? 'dv-horizontal'
|
|
829
|
+
: 'dv-vertical');
|
|
855
830
|
}
|
|
856
831
|
get minimumSize() {
|
|
857
832
|
return this.viewItems.reduce((r, item) => r + item.minimumSize, 0);
|
|
@@ -1029,11 +1004,11 @@ class Splitview {
|
|
|
1029
1004
|
}
|
|
1030
1005
|
style(styles) {
|
|
1031
1006
|
if ((styles === null || styles === void 0 ? void 0 : styles.separatorBorder) === 'transparent') {
|
|
1032
|
-
removeClasses(this.element, 'separator-border');
|
|
1007
|
+
removeClasses(this.element, 'dv-separator-border');
|
|
1033
1008
|
this.element.style.removeProperty('--dv-separator-border');
|
|
1034
1009
|
}
|
|
1035
1010
|
else {
|
|
1036
|
-
addClasses(this.element, 'separator-border');
|
|
1011
|
+
addClasses(this.element, 'dv-separator-border');
|
|
1037
1012
|
if (styles === null || styles === void 0 ? void 0 : styles.separatorBorder) {
|
|
1038
1013
|
this.element.style.setProperty('--dv-separator-border', styles.separatorBorder);
|
|
1039
1014
|
}
|
|
@@ -1103,7 +1078,7 @@ class Splitview {
|
|
|
1103
1078
|
}
|
|
1104
1079
|
addView(view, size = { type: 'distribute' }, index = this.viewItems.length, skipLayout) {
|
|
1105
1080
|
const container = document.createElement('div');
|
|
1106
|
-
container.className = 'view';
|
|
1081
|
+
container.className = 'dv-view';
|
|
1107
1082
|
container.appendChild(view.element);
|
|
1108
1083
|
let viewSize;
|
|
1109
1084
|
if (typeof size === 'number') {
|
|
@@ -1135,7 +1110,7 @@ class Splitview {
|
|
|
1135
1110
|
if (this.viewItems.length > 1) {
|
|
1136
1111
|
//add sash
|
|
1137
1112
|
const sash = document.createElement('div');
|
|
1138
|
-
sash.className = 'sash';
|
|
1113
|
+
sash.className = 'dv-sash';
|
|
1139
1114
|
const onPointerStart = (event) => {
|
|
1140
1115
|
for (const item of this.viewItems) {
|
|
1141
1116
|
item.enabled = false;
|
|
@@ -1394,7 +1369,8 @@ class Splitview {
|
|
|
1394
1369
|
const offset = i === 0 || visiblePanelsBeforeThisView === 0
|
|
1395
1370
|
? 0
|
|
1396
1371
|
: viewLeftOffsets[i - 1] +
|
|
1397
|
-
(visiblePanelsBeforeThisView / sashCount) *
|
|
1372
|
+
(visiblePanelsBeforeThisView / sashCount) *
|
|
1373
|
+
marginReducedSize;
|
|
1398
1374
|
if (i < this.viewItems.length - 1) {
|
|
1399
1375
|
// calculate sash position
|
|
1400
1376
|
const newSize = view.visible
|
|
@@ -1505,27 +1481,27 @@ class Splitview {
|
|
|
1505
1481
|
}
|
|
1506
1482
|
}
|
|
1507
1483
|
updateSash(sash, state) {
|
|
1508
|
-
toggleClass(sash.container, 'disabled', state === SashState.DISABLED);
|
|
1509
|
-
toggleClass(sash.container, 'enabled', state === SashState.ENABLED);
|
|
1510
|
-
toggleClass(sash.container, 'maximum', state === SashState.MAXIMUM);
|
|
1511
|
-
toggleClass(sash.container, 'minimum', state === SashState.MINIMUM);
|
|
1484
|
+
toggleClass(sash.container, 'dv-disabled', state === SashState.DISABLED);
|
|
1485
|
+
toggleClass(sash.container, 'dv-enabled', state === SashState.ENABLED);
|
|
1486
|
+
toggleClass(sash.container, 'dv-maximum', state === SashState.MAXIMUM);
|
|
1487
|
+
toggleClass(sash.container, 'dv-minimum', state === SashState.MINIMUM);
|
|
1512
1488
|
}
|
|
1513
1489
|
createViewContainer() {
|
|
1514
1490
|
const element = document.createElement('div');
|
|
1515
|
-
element.className = 'view-container';
|
|
1491
|
+
element.className = 'dv-view-container';
|
|
1516
1492
|
return element;
|
|
1517
1493
|
}
|
|
1518
1494
|
createSashContainer() {
|
|
1519
1495
|
const element = document.createElement('div');
|
|
1520
|
-
element.className = 'sash-container';
|
|
1496
|
+
element.className = 'dv-sash-container';
|
|
1521
1497
|
return element;
|
|
1522
1498
|
}
|
|
1523
1499
|
createContainer() {
|
|
1524
1500
|
const element = document.createElement('div');
|
|
1525
1501
|
const orientationClassname = this._orientation === Orientation.HORIZONTAL
|
|
1526
|
-
? 'horizontal'
|
|
1527
|
-
: 'vertical';
|
|
1528
|
-
element.className = `split-view-container ${orientationClassname}`;
|
|
1502
|
+
? 'dv-horizontal'
|
|
1503
|
+
: 'dv-vertical';
|
|
1504
|
+
element.className = `dv-split-view-container ${orientationClassname}`;
|
|
1529
1505
|
return element;
|
|
1530
1506
|
}
|
|
1531
1507
|
dispose() {
|
|
@@ -1576,7 +1552,7 @@ class Paneview extends CompositeDisposable {
|
|
|
1576
1552
|
this.onDidChange = this._onDidChange.event;
|
|
1577
1553
|
this._orientation = (_a = options.orientation) !== null && _a !== void 0 ? _a : Orientation.VERTICAL;
|
|
1578
1554
|
this.element = document.createElement('div');
|
|
1579
|
-
this.element.className = 'pane-container';
|
|
1555
|
+
this.element.className = 'dv-pane-container';
|
|
1580
1556
|
container.appendChild(this.element);
|
|
1581
1557
|
this.splitview = new Splitview(this.element, {
|
|
1582
1558
|
orientation: this._orientation,
|
|
@@ -1668,10 +1644,10 @@ class Paneview extends CompositeDisposable {
|
|
|
1668
1644
|
clearTimeout(this.animationTimer);
|
|
1669
1645
|
this.animationTimer = undefined;
|
|
1670
1646
|
}
|
|
1671
|
-
addClasses(this.element, 'animated');
|
|
1647
|
+
addClasses(this.element, 'dv-animated');
|
|
1672
1648
|
this.animationTimer = setTimeout(() => {
|
|
1673
1649
|
this.animationTimer = undefined;
|
|
1674
|
-
removeClasses(this.element, 'animated');
|
|
1650
|
+
removeClasses(this.element, 'dv-animated');
|
|
1675
1651
|
}, 200);
|
|
1676
1652
|
}
|
|
1677
1653
|
dispose() {
|
|
@@ -1896,7 +1872,7 @@ class BranchNode extends CompositeDisposable {
|
|
|
1896
1872
|
this._orthogonalSize = orthogonalSize;
|
|
1897
1873
|
this._size = size;
|
|
1898
1874
|
this.element = document.createElement('div');
|
|
1899
|
-
this.element.className = 'branch-node';
|
|
1875
|
+
this.element.className = 'dv-branch-node';
|
|
1900
1876
|
if (!childDescriptors) {
|
|
1901
1877
|
this.splitview = new Splitview(this.element, {
|
|
1902
1878
|
orientation: this.orientation,
|
|
@@ -2107,7 +2083,7 @@ function getGridLocation(element) {
|
|
|
2107
2083
|
if (!parentElement) {
|
|
2108
2084
|
throw new Error('Invalid grid element');
|
|
2109
2085
|
}
|
|
2110
|
-
if (/\
|
|
2086
|
+
if (/\bdv-grid-view\b/.test(parentElement.className)) {
|
|
2111
2087
|
return [];
|
|
2112
2088
|
}
|
|
2113
2089
|
const index = indexInParent(parentElement);
|
|
@@ -2455,7 +2431,7 @@ class Gridview {
|
|
|
2455
2431
|
this._onDidMaximizedNodeChange = new Emitter();
|
|
2456
2432
|
this.onDidMaximizedNodeChange = this._onDidMaximizedNodeChange.event;
|
|
2457
2433
|
this.element = document.createElement('div');
|
|
2458
|
-
this.element.className = 'grid-view';
|
|
2434
|
+
this.element.className = 'dv-grid-view';
|
|
2459
2435
|
this._locked = locked !== null && locked !== void 0 ? locked : false;
|
|
2460
2436
|
this._margin = margin !== null && margin !== void 0 ? margin : 0;
|
|
2461
2437
|
this.root = new BranchNode(orientation, proportionalLayout, styles, 0, 0, this.locked, this.margin);
|
|
@@ -3677,7 +3653,7 @@ class DragHandler extends CompositeDisposable {
|
|
|
3677
3653
|
* dnd logic. You can see the code at
|
|
3678
3654
|
* https://github.com/react-dnd/react-dnd/blob/main/packages/backend-html5/src/HTML5BackendImpl.ts#L542
|
|
3679
3655
|
*/
|
|
3680
|
-
event.dataTransfer.setData('text/plain', '
|
|
3656
|
+
event.dataTransfer.setData('text/plain', '');
|
|
3681
3657
|
}
|
|
3682
3658
|
}
|
|
3683
3659
|
}), addDisposableListener(this.el, 'dragend', () => {
|
|
@@ -3851,12 +3827,12 @@ class Droptarget extends CompositeDisposable {
|
|
|
3851
3827
|
this.markAsUsed(e);
|
|
3852
3828
|
if (!this.targetElement) {
|
|
3853
3829
|
this.targetElement = document.createElement('div');
|
|
3854
|
-
this.targetElement.className = 'drop-target-dropzone';
|
|
3830
|
+
this.targetElement.className = 'dv-drop-target-dropzone';
|
|
3855
3831
|
this.overlayElement = document.createElement('div');
|
|
3856
|
-
this.overlayElement.className = 'drop-target-selection';
|
|
3832
|
+
this.overlayElement.className = 'dv-drop-target-selection';
|
|
3857
3833
|
this._state = 'center';
|
|
3858
3834
|
this.targetElement.appendChild(this.overlayElement);
|
|
3859
|
-
this.element.classList.add('drop-target');
|
|
3835
|
+
this.element.classList.add('dv-drop-target');
|
|
3860
3836
|
this.element.append(this.targetElement);
|
|
3861
3837
|
}
|
|
3862
3838
|
this.toggleClasses(quadrant, width, height);
|
|
@@ -3994,7 +3970,7 @@ class Droptarget extends CompositeDisposable {
|
|
|
3994
3970
|
this.element.removeChild(this.targetElement);
|
|
3995
3971
|
this.targetElement = undefined;
|
|
3996
3972
|
this.overlayElement = undefined;
|
|
3997
|
-
this.element.classList.remove('drop-target');
|
|
3973
|
+
this.element.classList.remove('dv-drop-target');
|
|
3998
3974
|
}
|
|
3999
3975
|
}
|
|
4000
3976
|
}
|
|
@@ -4331,7 +4307,7 @@ class PaneviewPanel extends BasePanelView {
|
|
|
4331
4307
|
this._headerVisible = isHeaderVisible;
|
|
4332
4308
|
this._onDidChangeExpansionState.fire(this.isExpanded()); // initialize value
|
|
4333
4309
|
this._orientation = orientation;
|
|
4334
|
-
this.element.classList.add('pane');
|
|
4310
|
+
this.element.classList.add('dv-pane');
|
|
4335
4311
|
this.addDisposables(this.api.onWillVisibilityChange((event) => {
|
|
4336
4312
|
const { isVisible } = event;
|
|
4337
4313
|
const { accessor } = this._params;
|
|
@@ -4428,14 +4404,14 @@ class PaneviewPanel extends BasePanelView {
|
|
|
4428
4404
|
renderOnce() {
|
|
4429
4405
|
this.header = document.createElement('div');
|
|
4430
4406
|
this.header.tabIndex = 0;
|
|
4431
|
-
this.header.className = 'pane-header';
|
|
4407
|
+
this.header.className = 'dv-pane-header';
|
|
4432
4408
|
this.header.style.height = `${this.headerSize}px`;
|
|
4433
4409
|
this.header.style.lineHeight = `${this.headerSize}px`;
|
|
4434
4410
|
this.header.style.minHeight = `${this.headerSize}px`;
|
|
4435
4411
|
this.header.style.maxHeight = `${this.headerSize}px`;
|
|
4436
4412
|
this.element.appendChild(this.header);
|
|
4437
4413
|
this.body = document.createElement('div');
|
|
4438
|
-
this.body.className = 'pane-body';
|
|
4414
|
+
this.body.className = 'dv-pane-body';
|
|
4439
4415
|
this.element.appendChild(this.body);
|
|
4440
4416
|
}
|
|
4441
4417
|
// TODO slightly hacky by-pass of the component to create a body and header component
|
|
@@ -4556,7 +4532,7 @@ class ContentContainer extends CompositeDisposable {
|
|
|
4556
4532
|
this._onDidBlur = new Emitter();
|
|
4557
4533
|
this.onDidBlur = this._onDidBlur.event;
|
|
4558
4534
|
this._element = document.createElement('div');
|
|
4559
|
-
this._element.className = 'content-container';
|
|
4535
|
+
this._element.className = 'dv-content-container';
|
|
4560
4536
|
this._element.tabIndex = -1;
|
|
4561
4537
|
this.addDisposables(this._onDidFocus, this._onDidBlur);
|
|
4562
4538
|
this.dropTarget = new Droptarget(this.element, {
|
|
@@ -4629,6 +4605,8 @@ class ContentContainer extends CompositeDisposable {
|
|
|
4629
4605
|
referenceContainer: this,
|
|
4630
4606
|
});
|
|
4631
4607
|
break;
|
|
4608
|
+
default:
|
|
4609
|
+
throw new Error(`dockview: invalid renderer type '${panel.api.renderer}'`);
|
|
4632
4610
|
}
|
|
4633
4611
|
if (doRender) {
|
|
4634
4612
|
const focusTracker = trackFocus(container);
|
|
@@ -4695,10 +4673,10 @@ class Tab extends CompositeDisposable {
|
|
|
4695
4673
|
this._onDragStart = new Emitter();
|
|
4696
4674
|
this.onDragStart = this._onDragStart.event;
|
|
4697
4675
|
this._element = document.createElement('div');
|
|
4698
|
-
this._element.className = 'tab';
|
|
4676
|
+
this._element.className = 'dv-tab';
|
|
4699
4677
|
this._element.tabIndex = 0;
|
|
4700
4678
|
this._element.draggable = true;
|
|
4701
|
-
toggleClass(this.element, 'inactive-tab', true);
|
|
4679
|
+
toggleClass(this.element, 'dv-inactive-tab', true);
|
|
4702
4680
|
const dragHandler = new TabDragHandler(this._element, this.accessor, this.group, this.panel);
|
|
4703
4681
|
this.dropTarget = new Droptarget(this._element, {
|
|
4704
4682
|
acceptedTargetZones: ['center'],
|
|
@@ -4731,8 +4709,8 @@ class Tab extends CompositeDisposable {
|
|
|
4731
4709
|
}), this.dropTarget);
|
|
4732
4710
|
}
|
|
4733
4711
|
setActive(isActive) {
|
|
4734
|
-
toggleClass(this.element, 'active-tab', isActive);
|
|
4735
|
-
toggleClass(this.element, 'inactive-tab', !isActive);
|
|
4712
|
+
toggleClass(this.element, 'dv-active-tab', isActive);
|
|
4713
|
+
toggleClass(this.element, 'dv-inactive-tab', !isActive);
|
|
4736
4714
|
}
|
|
4737
4715
|
setContent(part) {
|
|
4738
4716
|
if (this.content) {
|
|
@@ -4820,7 +4798,7 @@ class VoidContainer extends CompositeDisposable {
|
|
|
4820
4798
|
this._onDragStart = new Emitter();
|
|
4821
4799
|
this.onDragStart = this._onDragStart.event;
|
|
4822
4800
|
this._element = document.createElement('div');
|
|
4823
|
-
this._element.className = 'void-container';
|
|
4801
|
+
this._element.className = 'dv-void-container';
|
|
4824
4802
|
this._element.tabIndex = 0;
|
|
4825
4803
|
this._element.draggable = true;
|
|
4826
4804
|
this.addDisposables(this._onDrop, this._onDragStart, addDisposableListener(this._element, 'pointerdown', () => {
|
|
@@ -4940,16 +4918,16 @@ class TabsContainer extends CompositeDisposable {
|
|
|
4940
4918
|
this._onWillShowOverlay = new Emitter();
|
|
4941
4919
|
this.onWillShowOverlay = this._onWillShowOverlay.event;
|
|
4942
4920
|
this._element = document.createElement('div');
|
|
4943
|
-
this._element.className = 'tabs-and-actions-container';
|
|
4921
|
+
this._element.className = 'dv-tabs-and-actions-container';
|
|
4944
4922
|
toggleClass(this._element, 'dv-full-width-single-tab', this.accessor.options.singleTabMode === 'fullwidth');
|
|
4945
4923
|
this.rightActionsContainer = document.createElement('div');
|
|
4946
|
-
this.rightActionsContainer.className = 'right-actions-container';
|
|
4924
|
+
this.rightActionsContainer.className = 'dv-right-actions-container';
|
|
4947
4925
|
this.leftActionsContainer = document.createElement('div');
|
|
4948
|
-
this.leftActionsContainer.className = 'left-actions-container';
|
|
4926
|
+
this.leftActionsContainer.className = 'dv-left-actions-container';
|
|
4949
4927
|
this.preActionsContainer = document.createElement('div');
|
|
4950
|
-
this.preActionsContainer.className = 'pre-actions-container';
|
|
4928
|
+
this.preActionsContainer.className = 'dv-pre-actions-container';
|
|
4951
4929
|
this.tabContainer = document.createElement('div');
|
|
4952
|
-
this.tabContainer.className = 'tabs-container';
|
|
4930
|
+
this.tabContainer.className = 'dv-tabs-container';
|
|
4953
4931
|
this.voidContainer = new VoidContainer(this.accessor, this.group);
|
|
4954
4932
|
this._element.appendChild(this.preActionsContainer);
|
|
4955
4933
|
this._element.appendChild(this.tabContainer);
|
|
@@ -5038,14 +5016,10 @@ class TabsContainer extends CompositeDisposable {
|
|
|
5038
5016
|
});
|
|
5039
5017
|
}
|
|
5040
5018
|
openPanel(panel, index = this.tabs.length) {
|
|
5041
|
-
var _a;
|
|
5042
5019
|
if (this.tabs.find((tab) => tab.value.panel.id === panel.id)) {
|
|
5043
5020
|
return;
|
|
5044
5021
|
}
|
|
5045
5022
|
const tab = new Tab(panel, this.accessor, this.group);
|
|
5046
|
-
if (!((_a = panel.view) === null || _a === void 0 ? void 0 : _a.tab)) {
|
|
5047
|
-
throw new Error('invalid header component');
|
|
5048
|
-
}
|
|
5049
5023
|
tab.setContent(panel.view.tab);
|
|
5050
5024
|
const disposable = new CompositeDisposable(tab.onDragStart((event) => {
|
|
5051
5025
|
this._onTabDragStart.fire({ nativeEvent: event, panel });
|
|
@@ -5235,7 +5209,7 @@ class WillShowOverlayLocationEvent {
|
|
|
5235
5209
|
}
|
|
5236
5210
|
class DockviewGroupPanelModel extends CompositeDisposable {
|
|
5237
5211
|
get element() {
|
|
5238
|
-
throw new Error('not supported');
|
|
5212
|
+
throw new Error('dockview: not supported');
|
|
5239
5213
|
}
|
|
5240
5214
|
get activePanel() {
|
|
5241
5215
|
return this._activePanel;
|
|
@@ -5245,7 +5219,7 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5245
5219
|
}
|
|
5246
5220
|
set locked(value) {
|
|
5247
5221
|
this._locked = value;
|
|
5248
|
-
toggleClass(this.container, 'locked-groupview', value === 'no-drop-target' || value);
|
|
5222
|
+
toggleClass(this.container, 'dv-locked-groupview', value === 'no-drop-target' || value);
|
|
5249
5223
|
}
|
|
5250
5224
|
get isActive() {
|
|
5251
5225
|
return this._isGroupActive;
|
|
@@ -5316,6 +5290,7 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5316
5290
|
this._locked = false;
|
|
5317
5291
|
this._location = { type: 'grid' };
|
|
5318
5292
|
this.mostRecentlyUsed = [];
|
|
5293
|
+
this._overwriteRenderContainer = null;
|
|
5319
5294
|
this._onDidChange = new Emitter();
|
|
5320
5295
|
this.onDidChange = this._onDidChange.event;
|
|
5321
5296
|
this._width = 0;
|
|
@@ -5346,8 +5321,7 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5346
5321
|
this.onDidActivePanelChange = this._onDidActivePanelChange.event;
|
|
5347
5322
|
this._onUnhandledDragOverEvent = new Emitter();
|
|
5348
5323
|
this.onUnhandledDragOverEvent = this._onUnhandledDragOverEvent.event;
|
|
5349
|
-
this.
|
|
5350
|
-
toggleClass(this.container, 'groupview', true);
|
|
5324
|
+
toggleClass(this.container, 'dv-groupview', true);
|
|
5351
5325
|
this._api = new DockviewApi(this.accessor);
|
|
5352
5326
|
this.tabsContainer = new TabsContainer(this.accessor, this.groupPanel);
|
|
5353
5327
|
this.contentContainer = new ContentContainer(this.accessor, this);
|
|
@@ -5592,8 +5566,8 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5592
5566
|
return;
|
|
5593
5567
|
}
|
|
5594
5568
|
this._isGroupActive = isGroupActive;
|
|
5595
|
-
toggleClass(this.container, 'active-group', isGroupActive);
|
|
5596
|
-
toggleClass(this.container, 'inactive-group', !isGroupActive);
|
|
5569
|
+
toggleClass(this.container, 'dv-active-group', isGroupActive);
|
|
5570
|
+
toggleClass(this.container, 'dv-inactive-group', !isGroupActive);
|
|
5597
5571
|
this.tabsContainer.setActive(this.isActive);
|
|
5598
5572
|
if (!this._activePanel && this.panels.length > 0) {
|
|
5599
5573
|
this.doSetActivePanel(this.panels[0]);
|
|
@@ -5685,7 +5659,7 @@ class DockviewGroupPanelModel extends CompositeDisposable {
|
|
|
5685
5659
|
}
|
|
5686
5660
|
updateContainer() {
|
|
5687
5661
|
var _a, _b;
|
|
5688
|
-
toggleClass(this.container, 'empty', this.isEmpty);
|
|
5662
|
+
toggleClass(this.container, 'dv-empty', this.isEmpty);
|
|
5689
5663
|
this.panels.forEach((panel) => panel.runEvents());
|
|
5690
5664
|
if (this.isEmpty && !this.watermark) {
|
|
5691
5665
|
const watermark = this.accessor.createWatermarkComponent();
|
|
@@ -5826,6 +5800,34 @@ class GridviewPanel extends BasePanelView {
|
|
|
5826
5800
|
return this._snap;
|
|
5827
5801
|
}
|
|
5828
5802
|
get minimumWidth() {
|
|
5803
|
+
/**
|
|
5804
|
+
* defer to protected function to allow subclasses to override easily.
|
|
5805
|
+
* see https://github.com/microsoft/TypeScript/issues/338
|
|
5806
|
+
*/
|
|
5807
|
+
return this.__minimumWidth();
|
|
5808
|
+
}
|
|
5809
|
+
get minimumHeight() {
|
|
5810
|
+
/**
|
|
5811
|
+
* defer to protected function to allow subclasses to override easily.
|
|
5812
|
+
* see https://github.com/microsoft/TypeScript/issues/338
|
|
5813
|
+
*/
|
|
5814
|
+
return this.__minimumHeight();
|
|
5815
|
+
}
|
|
5816
|
+
get maximumHeight() {
|
|
5817
|
+
/**
|
|
5818
|
+
* defer to protected function to allow subclasses to override easily.
|
|
5819
|
+
* see https://github.com/microsoft/TypeScript/issues/338
|
|
5820
|
+
*/
|
|
5821
|
+
return this.__maximumHeight();
|
|
5822
|
+
}
|
|
5823
|
+
get maximumWidth() {
|
|
5824
|
+
/**
|
|
5825
|
+
* defer to protected function to allow subclasses to override easily.
|
|
5826
|
+
* see https://github.com/microsoft/TypeScript/issues/338
|
|
5827
|
+
*/
|
|
5828
|
+
return this.__maximumWidth();
|
|
5829
|
+
}
|
|
5830
|
+
__minimumWidth() {
|
|
5829
5831
|
const width = typeof this._minimumWidth === 'function'
|
|
5830
5832
|
? this._minimumWidth()
|
|
5831
5833
|
: this._minimumWidth;
|
|
@@ -5835,7 +5837,17 @@ class GridviewPanel extends BasePanelView {
|
|
|
5835
5837
|
}
|
|
5836
5838
|
return width;
|
|
5837
5839
|
}
|
|
5838
|
-
|
|
5840
|
+
__maximumWidth() {
|
|
5841
|
+
const width = typeof this._maximumWidth === 'function'
|
|
5842
|
+
? this._maximumWidth()
|
|
5843
|
+
: this._maximumWidth;
|
|
5844
|
+
if (width !== this._evaluatedMaximumWidth) {
|
|
5845
|
+
this._evaluatedMaximumWidth = width;
|
|
5846
|
+
this.updateConstraints();
|
|
5847
|
+
}
|
|
5848
|
+
return width;
|
|
5849
|
+
}
|
|
5850
|
+
__minimumHeight() {
|
|
5839
5851
|
const height = typeof this._minimumHeight === 'function'
|
|
5840
5852
|
? this._minimumHeight()
|
|
5841
5853
|
: this._minimumHeight;
|
|
@@ -5845,7 +5857,7 @@ class GridviewPanel extends BasePanelView {
|
|
|
5845
5857
|
}
|
|
5846
5858
|
return height;
|
|
5847
5859
|
}
|
|
5848
|
-
|
|
5860
|
+
__maximumHeight() {
|
|
5849
5861
|
const height = typeof this._maximumHeight === 'function'
|
|
5850
5862
|
? this._maximumHeight()
|
|
5851
5863
|
: this._maximumHeight;
|
|
@@ -5855,16 +5867,6 @@ class GridviewPanel extends BasePanelView {
|
|
|
5855
5867
|
}
|
|
5856
5868
|
return height;
|
|
5857
5869
|
}
|
|
5858
|
-
get maximumWidth() {
|
|
5859
|
-
const width = typeof this._maximumWidth === 'function'
|
|
5860
|
-
? this._maximumWidth()
|
|
5861
|
-
: this._maximumWidth;
|
|
5862
|
-
if (width !== this._evaluatedMaximumWidth) {
|
|
5863
|
-
this._evaluatedMaximumWidth = width;
|
|
5864
|
-
this.updateConstraints();
|
|
5865
|
-
}
|
|
5866
|
-
return width;
|
|
5867
|
-
}
|
|
5868
5870
|
get isActive() {
|
|
5869
5871
|
return this.api.isActive;
|
|
5870
5872
|
}
|
|
@@ -6015,6 +6017,7 @@ class DockviewGroupPanelApiImpl extends GridviewPanelApiImpl {
|
|
|
6015
6017
|
position: options.group
|
|
6016
6018
|
? (_c = options.position) !== null && _c !== void 0 ? _c : 'center'
|
|
6017
6019
|
: 'center',
|
|
6020
|
+
index: options.index,
|
|
6018
6021
|
},
|
|
6019
6022
|
});
|
|
6020
6023
|
}
|
|
@@ -6066,30 +6069,34 @@ class DockviewGroupPanel extends GridviewPanel {
|
|
|
6066
6069
|
get minimumWidth() {
|
|
6067
6070
|
var _a;
|
|
6068
6071
|
const activePanelMinimumWidth = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.minimumWidth;
|
|
6069
|
-
|
|
6070
|
-
|
|
6071
|
-
|
|
6072
|
+
if (typeof activePanelMinimumWidth === 'number') {
|
|
6073
|
+
return activePanelMinimumWidth;
|
|
6074
|
+
}
|
|
6075
|
+
return super.__minimumWidth();
|
|
6072
6076
|
}
|
|
6073
6077
|
get minimumHeight() {
|
|
6074
6078
|
var _a;
|
|
6075
6079
|
const activePanelMinimumHeight = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.minimumHeight;
|
|
6076
|
-
|
|
6077
|
-
|
|
6078
|
-
|
|
6080
|
+
if (typeof activePanelMinimumHeight === 'number') {
|
|
6081
|
+
return activePanelMinimumHeight;
|
|
6082
|
+
}
|
|
6083
|
+
return super.__minimumHeight();
|
|
6079
6084
|
}
|
|
6080
6085
|
get maximumWidth() {
|
|
6081
6086
|
var _a;
|
|
6082
6087
|
const activePanelMaximumWidth = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.maximumWidth;
|
|
6083
|
-
|
|
6084
|
-
|
|
6085
|
-
|
|
6088
|
+
if (typeof activePanelMaximumWidth === 'number') {
|
|
6089
|
+
return activePanelMaximumWidth;
|
|
6090
|
+
}
|
|
6091
|
+
return super.__maximumWidth();
|
|
6086
6092
|
}
|
|
6087
6093
|
get maximumHeight() {
|
|
6088
6094
|
var _a;
|
|
6089
6095
|
const activePanelMaximumHeight = (_a = this.activePanel) === null || _a === void 0 ? void 0 : _a.maximumHeight;
|
|
6090
|
-
|
|
6091
|
-
|
|
6092
|
-
|
|
6096
|
+
if (typeof activePanelMaximumHeight === 'number') {
|
|
6097
|
+
return activePanelMaximumHeight;
|
|
6098
|
+
}
|
|
6099
|
+
return super.__maximumHeight();
|
|
6093
6100
|
}
|
|
6094
6101
|
get panels() {
|
|
6095
6102
|
return this._model.panels;
|
|
@@ -6203,12 +6210,14 @@ class DockviewPanelApiImpl extends GridviewPanelApiImpl {
|
|
|
6203
6210
|
return this.group.api.getWindow();
|
|
6204
6211
|
}
|
|
6205
6212
|
moveTo(options) {
|
|
6206
|
-
var _a;
|
|
6213
|
+
var _a, _b;
|
|
6207
6214
|
this.accessor.moveGroupOrPanel({
|
|
6208
6215
|
from: { groupId: this._group.id, panelId: this.panel.id },
|
|
6209
6216
|
to: {
|
|
6210
|
-
group: options.group,
|
|
6211
|
-
position:
|
|
6217
|
+
group: (_a = options.group) !== null && _a !== void 0 ? _a : this._group,
|
|
6218
|
+
position: options.group
|
|
6219
|
+
? (_b = options.position) !== null && _b !== void 0 ? _b : 'center'
|
|
6220
|
+
: 'center',
|
|
6212
6221
|
index: options.index,
|
|
6213
6222
|
},
|
|
6214
6223
|
});
|
|
@@ -6427,7 +6436,7 @@ const createSvgElementFromPath = (params) => {
|
|
|
6427
6436
|
svg.setAttributeNS(null, 'viewBox', params.viewbox);
|
|
6428
6437
|
svg.setAttributeNS(null, 'aria-hidden', 'false');
|
|
6429
6438
|
svg.setAttributeNS(null, 'focusable', 'false');
|
|
6430
|
-
svg.classList.add('
|
|
6439
|
+
svg.classList.add('dv-svg');
|
|
6431
6440
|
const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
6432
6441
|
path.setAttributeNS(null, 'd', params.path);
|
|
6433
6442
|
svg.appendChild(path);
|
|
@@ -6598,19 +6607,19 @@ class Watermark extends CompositeDisposable {
|
|
|
6598
6607
|
constructor() {
|
|
6599
6608
|
super();
|
|
6600
6609
|
this._element = document.createElement('div');
|
|
6601
|
-
this._element.className = 'watermark';
|
|
6610
|
+
this._element.className = 'dv-watermark';
|
|
6602
6611
|
const title = document.createElement('div');
|
|
6603
|
-
title.className = 'watermark-title';
|
|
6612
|
+
title.className = 'dv-watermark-title';
|
|
6604
6613
|
const emptySpace = document.createElement('span');
|
|
6605
6614
|
emptySpace.style.flexGrow = '1';
|
|
6606
6615
|
const content = document.createElement('div');
|
|
6607
|
-
content.className = 'watermark-content';
|
|
6616
|
+
content.className = 'dv-watermark-content';
|
|
6608
6617
|
this._element.appendChild(title);
|
|
6609
6618
|
this._element.appendChild(content);
|
|
6610
6619
|
const actionsContainer = document.createElement('div');
|
|
6611
|
-
actionsContainer.className = 'actions-container';
|
|
6620
|
+
actionsContainer.className = 'dv-actions-container';
|
|
6612
6621
|
const closeAnchor = document.createElement('div');
|
|
6613
|
-
closeAnchor.className = 'close-action';
|
|
6622
|
+
closeAnchor.className = 'dv-close-action';
|
|
6614
6623
|
closeAnchor.appendChild(createCloseButton());
|
|
6615
6624
|
actionsContainer.appendChild(closeAnchor);
|
|
6616
6625
|
title.appendChild(emptySpace);
|
|
@@ -6630,11 +6639,10 @@ class Watermark extends CompositeDisposable {
|
|
|
6630
6639
|
}
|
|
6631
6640
|
render() {
|
|
6632
6641
|
const isOneGroup = !!(this._api && this._api.size <= 1);
|
|
6633
|
-
toggleClass(this.element, 'has-actions', isOneGroup);
|
|
6642
|
+
toggleClass(this.element, 'dv-has-actions', isOneGroup);
|
|
6634
6643
|
}
|
|
6635
6644
|
}
|
|
6636
6645
|
|
|
6637
|
-
const DEFAULT_OVERLAY_Z_INDEX = 999;
|
|
6638
6646
|
class AriaLevelTracker {
|
|
6639
6647
|
constructor() {
|
|
6640
6648
|
this._orderedList = [];
|
|
@@ -6653,7 +6661,7 @@ class AriaLevelTracker {
|
|
|
6653
6661
|
update() {
|
|
6654
6662
|
for (let i = 0; i < this._orderedList.length; i++) {
|
|
6655
6663
|
this._orderedList[i].setAttribute('aria-level', `${i}`);
|
|
6656
|
-
this._orderedList[i].style.zIndex =
|
|
6664
|
+
this._orderedList[i].style.zIndex = `calc(var(--dv-overlay-z-index, 999) + ${i * 2})`;
|
|
6657
6665
|
}
|
|
6658
6666
|
}
|
|
6659
6667
|
}
|
|
@@ -7110,7 +7118,7 @@ class OverlayRenderContainer extends CompositeDisposable {
|
|
|
7110
7118
|
const element = floatingGroup.overlay.element;
|
|
7111
7119
|
const update = () => {
|
|
7112
7120
|
const level = Number(element.getAttribute('aria-level'));
|
|
7113
|
-
focusContainer.style.zIndex =
|
|
7121
|
+
focusContainer.style.zIndex = `calc(var(--dv-overlay-z-index, 999) + ${level * 2 + 1})`;
|
|
7114
7122
|
};
|
|
7115
7123
|
const observer = new MutationObserver(() => {
|
|
7116
7124
|
update();
|
|
@@ -7242,7 +7250,6 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7242
7250
|
window: this._window.value,
|
|
7243
7251
|
});
|
|
7244
7252
|
this._window.disposable.dispose();
|
|
7245
|
-
this._window.value.close();
|
|
7246
7253
|
this._window = null;
|
|
7247
7254
|
this._onDidClose.fire();
|
|
7248
7255
|
}
|
|
@@ -7274,7 +7281,9 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7274
7281
|
}
|
|
7275
7282
|
const disposable = new CompositeDisposable();
|
|
7276
7283
|
this._window = { value: externalWindow, disposable };
|
|
7277
|
-
disposable.addDisposables(
|
|
7284
|
+
disposable.addDisposables(Disposable.from(() => {
|
|
7285
|
+
externalWindow.close();
|
|
7286
|
+
}), addDisposableWindowListener(window, 'beforeunload', () => {
|
|
7278
7287
|
/**
|
|
7279
7288
|
* before the main window closes we should close this popup too
|
|
7280
7289
|
* to be good citizens
|
|
@@ -7291,7 +7300,7 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7291
7300
|
id: this.target,
|
|
7292
7301
|
window: externalWindow,
|
|
7293
7302
|
});
|
|
7294
|
-
return new Promise((resolve) => {
|
|
7303
|
+
return new Promise((resolve, reject) => {
|
|
7295
7304
|
externalWindow.addEventListener('unload', (e) => {
|
|
7296
7305
|
// if page fails to load before unloading
|
|
7297
7306
|
// this.close();
|
|
@@ -7300,21 +7309,27 @@ class PopoutWindow extends CompositeDisposable {
|
|
|
7300
7309
|
/**
|
|
7301
7310
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
|
|
7302
7311
|
*/
|
|
7303
|
-
|
|
7304
|
-
|
|
7305
|
-
|
|
7306
|
-
|
|
7307
|
-
|
|
7308
|
-
* beforeunload must be registered after load for reasons I could not determine
|
|
7309
|
-
* otherwise the beforeunload event will not fire when the window is closed
|
|
7310
|
-
*/
|
|
7311
|
-
addDisposableWindowListener(externalWindow, 'beforeunload', () => {
|
|
7312
|
+
try {
|
|
7313
|
+
const externalDocument = externalWindow.document;
|
|
7314
|
+
externalDocument.title = document.title;
|
|
7315
|
+
externalDocument.body.appendChild(container);
|
|
7316
|
+
addStyles(externalDocument, window.document.styleSheets);
|
|
7312
7317
|
/**
|
|
7313
|
-
*
|
|
7318
|
+
* beforeunload must be registered after load for reasons I could not determine
|
|
7319
|
+
* otherwise the beforeunload event will not fire when the window is closed
|
|
7314
7320
|
*/
|
|
7315
|
-
|
|
7316
|
-
|
|
7317
|
-
|
|
7321
|
+
addDisposableWindowListener(externalWindow, 'beforeunload', () => {
|
|
7322
|
+
/**
|
|
7323
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
|
|
7324
|
+
*/
|
|
7325
|
+
this.close();
|
|
7326
|
+
});
|
|
7327
|
+
resolve(container);
|
|
7328
|
+
}
|
|
7329
|
+
catch (err) {
|
|
7330
|
+
// only except this is the DOM isn't setup. e.g. in a in correctly configured test
|
|
7331
|
+
reject(err);
|
|
7332
|
+
}
|
|
7318
7333
|
});
|
|
7319
7334
|
});
|
|
7320
7335
|
});
|
|
@@ -7567,9 +7582,6 @@ class DockviewComponent extends BaseGrid {
|
|
|
7567
7582
|
}
|
|
7568
7583
|
const box = getBox();
|
|
7569
7584
|
const groupId = (_b = (_a = options === null || options === void 0 ? void 0 : options.overridePopoutGroup) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : this.getNextGroupId();
|
|
7570
|
-
if (itemToPopout.api.location.type === 'grid') {
|
|
7571
|
-
itemToPopout.api.setVisible(false);
|
|
7572
|
-
}
|
|
7573
7585
|
const _window = new PopoutWindow(`${this.id}-${groupId}`, // unique id
|
|
7574
7586
|
theme !== null && theme !== void 0 ? theme : '', {
|
|
7575
7587
|
url: (_c = options === null || options === void 0 ? void 0 : options.popoutUrl) !== null && _c !== void 0 ? _c : '/popout.html',
|
|
@@ -7588,11 +7600,11 @@ class DockviewComponent extends BaseGrid {
|
|
|
7588
7600
|
.then((popoutContainer) => {
|
|
7589
7601
|
var _a;
|
|
7590
7602
|
if (_window.isDisposed) {
|
|
7591
|
-
return;
|
|
7603
|
+
return false;
|
|
7592
7604
|
}
|
|
7593
7605
|
if (popoutContainer === null) {
|
|
7594
7606
|
popoutWindowDisposable.dispose();
|
|
7595
|
-
return;
|
|
7607
|
+
return false;
|
|
7596
7608
|
}
|
|
7597
7609
|
const gready = document.createElement('div');
|
|
7598
7610
|
gready.className = 'dv-overlay-render-container';
|
|
@@ -7601,30 +7613,40 @@ class DockviewComponent extends BaseGrid {
|
|
|
7601
7613
|
? itemToPopout.group
|
|
7602
7614
|
: itemToPopout;
|
|
7603
7615
|
const referenceLocation = itemToPopout.api.location.type;
|
|
7604
|
-
|
|
7616
|
+
/**
|
|
7617
|
+
* The group that is being added doesn't already exist within the DOM, the most likely occurance
|
|
7618
|
+
* of this case is when being called from the `fromJSON(...)` method
|
|
7619
|
+
*/
|
|
7620
|
+
const isGroupAddedToDom = referenceGroup.element.parentElement !== null;
|
|
7621
|
+
const group = !isGroupAddedToDom
|
|
7622
|
+
? referenceGroup
|
|
7623
|
+
: (_a = options === null || options === void 0 ? void 0 : options.overridePopoutGroup) !== null && _a !== void 0 ? _a : this.createGroup({ id: groupId });
|
|
7605
7624
|
group.model.renderContainer = overlayRenderContainer;
|
|
7606
|
-
|
|
7625
|
+
group.layout(_window.window.innerWidth, _window.window.innerHeight);
|
|
7626
|
+
if (!this._groups.has(group.api.id)) {
|
|
7607
7627
|
this._onDidAddGroup.fire(group);
|
|
7608
7628
|
}
|
|
7609
|
-
if (
|
|
7610
|
-
|
|
7611
|
-
|
|
7612
|
-
|
|
7613
|
-
|
|
7614
|
-
|
|
7615
|
-
|
|
7616
|
-
|
|
7617
|
-
|
|
7618
|
-
|
|
7619
|
-
|
|
7620
|
-
|
|
7621
|
-
|
|
7622
|
-
|
|
7623
|
-
|
|
7624
|
-
|
|
7625
|
-
|
|
7626
|
-
|
|
7627
|
-
|
|
7629
|
+
if (!(options === null || options === void 0 ? void 0 : options.overridePopoutGroup) && isGroupAddedToDom) {
|
|
7630
|
+
if (itemToPopout instanceof DockviewPanel) {
|
|
7631
|
+
this.movingLock(() => {
|
|
7632
|
+
const panel = referenceGroup.model.removePanel(itemToPopout);
|
|
7633
|
+
group.model.openPanel(panel);
|
|
7634
|
+
});
|
|
7635
|
+
}
|
|
7636
|
+
else {
|
|
7637
|
+
this.movingLock(() => moveGroupWithoutDestroying({
|
|
7638
|
+
from: referenceGroup,
|
|
7639
|
+
to: group,
|
|
7640
|
+
}));
|
|
7641
|
+
switch (referenceLocation) {
|
|
7642
|
+
case 'grid':
|
|
7643
|
+
referenceGroup.api.setVisible(false);
|
|
7644
|
+
break;
|
|
7645
|
+
case 'floating':
|
|
7646
|
+
case 'popout':
|
|
7647
|
+
this.removeGroup(referenceGroup);
|
|
7648
|
+
break;
|
|
7649
|
+
}
|
|
7628
7650
|
}
|
|
7629
7651
|
}
|
|
7630
7652
|
popoutContainer.classList.add('dv-dockview');
|
|
@@ -7635,6 +7657,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
7635
7657
|
type: 'popout',
|
|
7636
7658
|
getWindow: () => _window.window,
|
|
7637
7659
|
};
|
|
7660
|
+
if (isGroupAddedToDom &&
|
|
7661
|
+
itemToPopout.api.location.type === 'grid') {
|
|
7662
|
+
itemToPopout.api.setVisible(false);
|
|
7663
|
+
}
|
|
7638
7664
|
this.doSetGroupAndPanelActive(group);
|
|
7639
7665
|
popoutWindowDisposable.addDisposables(group.api.onDidActiveChange((event) => {
|
|
7640
7666
|
var _a;
|
|
@@ -7649,9 +7675,13 @@ class DockviewComponent extends BaseGrid {
|
|
|
7649
7675
|
const value = {
|
|
7650
7676
|
window: _window,
|
|
7651
7677
|
popoutGroup: group,
|
|
7652
|
-
referenceGroup:
|
|
7653
|
-
?
|
|
7654
|
-
:
|
|
7678
|
+
referenceGroup: !isGroupAddedToDom
|
|
7679
|
+
? undefined
|
|
7680
|
+
: referenceGroup
|
|
7681
|
+
? this.getPanel(referenceGroup.id)
|
|
7682
|
+
? referenceGroup.id
|
|
7683
|
+
: undefined
|
|
7684
|
+
: undefined,
|
|
7655
7685
|
disposable: {
|
|
7656
7686
|
dispose: () => {
|
|
7657
7687
|
popoutWindowDisposable.dispose();
|
|
@@ -7666,9 +7696,10 @@ class DockviewComponent extends BaseGrid {
|
|
|
7666
7696
|
* window dimensions
|
|
7667
7697
|
*/
|
|
7668
7698
|
addDisposableWindowListener(_window.window, 'resize', () => {
|
|
7669
|
-
group.layout(window.innerWidth, window.innerHeight);
|
|
7699
|
+
group.layout(_window.window.innerWidth, _window.window.innerHeight);
|
|
7670
7700
|
}), overlayRenderContainer, Disposable.from(() => {
|
|
7671
|
-
if (
|
|
7701
|
+
if (isGroupAddedToDom &&
|
|
7702
|
+
this.getPanel(referenceGroup.id)) {
|
|
7672
7703
|
this.movingLock(() => moveGroupWithoutDestroying({
|
|
7673
7704
|
from: group,
|
|
7674
7705
|
to: referenceGroup,
|
|
@@ -7683,21 +7714,27 @@ class DockviewComponent extends BaseGrid {
|
|
|
7683
7714
|
}
|
|
7684
7715
|
}
|
|
7685
7716
|
else if (this.getPanel(group.id)) {
|
|
7686
|
-
|
|
7717
|
+
this.doRemoveGroup(group, {
|
|
7687
7718
|
skipDispose: true,
|
|
7688
7719
|
skipActive: true,
|
|
7720
|
+
skipPopoutReturn: true,
|
|
7689
7721
|
});
|
|
7722
|
+
const removedGroup = group;
|
|
7690
7723
|
removedGroup.model.renderContainer =
|
|
7691
7724
|
this.overlayRenderContainer;
|
|
7692
7725
|
removedGroup.model.location = { type: 'grid' };
|
|
7693
7726
|
returnedGroup = removedGroup;
|
|
7727
|
+
this.doAddGroup(removedGroup, [0]);
|
|
7728
|
+
this.doSetGroupAndPanelActive(removedGroup);
|
|
7694
7729
|
}
|
|
7695
7730
|
}));
|
|
7696
7731
|
this._popoutGroups.push(value);
|
|
7697
7732
|
this.updateWatermark();
|
|
7733
|
+
return true;
|
|
7698
7734
|
})
|
|
7699
7735
|
.catch((err) => {
|
|
7700
7736
|
console.error('dockview: failed to create popout window', err);
|
|
7737
|
+
return false;
|
|
7701
7738
|
});
|
|
7702
7739
|
}
|
|
7703
7740
|
addFloatingGroup(item, options) {
|
|
@@ -7801,7 +7838,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
7801
7838
|
: (_c = (_b = this.options.floatingGroupBounds) === null || _b === void 0 ? void 0 : _b.minimumWidthWithinViewport) !== null && _c !== void 0 ? _c : DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE, minimumInViewportHeight: this.options.floatingGroupBounds === 'boundedWithinViewport'
|
|
7802
7839
|
? undefined
|
|
7803
7840
|
: (_e = (_d = this.options.floatingGroupBounds) === null || _d === void 0 ? void 0 : _d.minimumHeightWithinViewport) !== null && _e !== void 0 ? _e : DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE }));
|
|
7804
|
-
const el = group.element.querySelector('.void-container');
|
|
7841
|
+
const el = group.element.querySelector('.dv-void-container');
|
|
7805
7842
|
if (!el) {
|
|
7806
7843
|
throw new Error('failed to find drag handle');
|
|
7807
7844
|
}
|
|
@@ -8084,7 +8121,6 @@ class DockviewComponent extends BaseGrid {
|
|
|
8084
8121
|
this.addPopoutGroup((_c = (gridReferenceGroup
|
|
8085
8122
|
? this.getPanel(gridReferenceGroup)
|
|
8086
8123
|
: undefined)) !== null && _c !== void 0 ? _c : group, {
|
|
8087
|
-
skipRemoveGroup: true,
|
|
8088
8124
|
position: position !== null && position !== void 0 ? position : undefined,
|
|
8089
8125
|
overridePopoutGroup: gridReferenceGroup
|
|
8090
8126
|
? group
|
|
@@ -8102,6 +8138,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8102
8138
|
}
|
|
8103
8139
|
}
|
|
8104
8140
|
catch (err) {
|
|
8141
|
+
console.error('dockview: failed to deserialize layout. Reverting changes', err);
|
|
8105
8142
|
/**
|
|
8106
8143
|
* Takes all the successfully created groups and remove all of their panels.
|
|
8107
8144
|
*/
|
|
@@ -8169,11 +8206,13 @@ class DockviewComponent extends BaseGrid {
|
|
|
8169
8206
|
width: options.initialWidth,
|
|
8170
8207
|
height: options.initialHeight,
|
|
8171
8208
|
};
|
|
8209
|
+
let index;
|
|
8172
8210
|
if (options.position) {
|
|
8173
8211
|
if (isPanelOptionsWithPanel(options.position)) {
|
|
8174
8212
|
const referencePanel = typeof options.position.referencePanel === 'string'
|
|
8175
8213
|
? this.getGroupPanel(options.position.referencePanel)
|
|
8176
8214
|
: options.position.referencePanel;
|
|
8215
|
+
index = options.position.index;
|
|
8177
8216
|
if (!referencePanel) {
|
|
8178
8217
|
throw new Error(`referencePanel '${options.position.referencePanel}' does not exist`);
|
|
8179
8218
|
}
|
|
@@ -8184,6 +8223,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8184
8223
|
typeof options.position.referenceGroup === 'string'
|
|
8185
8224
|
? (_a = this._groups.get(options.position.referenceGroup)) === null || _a === void 0 ? void 0 : _a.value
|
|
8186
8225
|
: options.position.referenceGroup;
|
|
8226
|
+
index = options.position.index;
|
|
8187
8227
|
if (!referenceGroup) {
|
|
8188
8228
|
throw new Error(`referenceGroup '${options.position.referenceGroup}' does not exist`);
|
|
8189
8229
|
}
|
|
@@ -8194,6 +8234,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8194
8234
|
group.model.openPanel(panel, {
|
|
8195
8235
|
skipSetActive: options.inactive,
|
|
8196
8236
|
skipSetGroupActive: options.inactive,
|
|
8237
|
+
index,
|
|
8197
8238
|
});
|
|
8198
8239
|
if (!options.inactive) {
|
|
8199
8240
|
this.doSetGroupAndPanelActive(group);
|
|
@@ -8223,6 +8264,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8223
8264
|
group.model.openPanel(panel, {
|
|
8224
8265
|
skipSetActive: options.inactive,
|
|
8225
8266
|
skipSetGroupActive: options.inactive,
|
|
8267
|
+
index,
|
|
8226
8268
|
});
|
|
8227
8269
|
}
|
|
8228
8270
|
else if (referenceGroup.api.location.type === 'floating' ||
|
|
@@ -8231,6 +8273,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8231
8273
|
referenceGroup.model.openPanel(panel, {
|
|
8232
8274
|
skipSetActive: options.inactive,
|
|
8233
8275
|
skipSetGroupActive: options.inactive,
|
|
8276
|
+
index,
|
|
8234
8277
|
});
|
|
8235
8278
|
referenceGroup.api.setSize({
|
|
8236
8279
|
width: initial === null || initial === void 0 ? void 0 : initial.width,
|
|
@@ -8251,6 +8294,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8251
8294
|
group.model.openPanel(panel, {
|
|
8252
8295
|
skipSetActive: options.inactive,
|
|
8253
8296
|
skipSetGroupActive: options.inactive,
|
|
8297
|
+
index,
|
|
8254
8298
|
});
|
|
8255
8299
|
if (!options.inactive) {
|
|
8256
8300
|
this.doSetGroupAndPanelActive(group);
|
|
@@ -8269,6 +8313,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8269
8313
|
group.model.openPanel(panel, {
|
|
8270
8314
|
skipSetActive: options.inactive,
|
|
8271
8315
|
skipSetGroupActive: options.inactive,
|
|
8316
|
+
index,
|
|
8272
8317
|
});
|
|
8273
8318
|
}
|
|
8274
8319
|
else {
|
|
@@ -8279,6 +8324,7 @@ class DockviewComponent extends BaseGrid {
|
|
|
8279
8324
|
group.model.openPanel(panel, {
|
|
8280
8325
|
skipSetActive: options.inactive,
|
|
8281
8326
|
skipSetGroupActive: options.inactive,
|
|
8327
|
+
index,
|
|
8282
8328
|
});
|
|
8283
8329
|
if (!options.inactive) {
|
|
8284
8330
|
this.doSetGroupAndPanelActive(group);
|
|
@@ -8819,6 +8865,31 @@ class DockviewComponent extends BaseGrid {
|
|
|
8819
8865
|
}
|
|
8820
8866
|
}
|
|
8821
8867
|
|
|
8868
|
+
function createComponent(id, componentName, components = {}, frameworkComponents = {}, createFrameworkComponent, fallback) {
|
|
8869
|
+
const Component = typeof componentName === 'string'
|
|
8870
|
+
? components[componentName]
|
|
8871
|
+
: undefined;
|
|
8872
|
+
const FrameworkComponent = typeof componentName === 'string'
|
|
8873
|
+
? frameworkComponents[componentName]
|
|
8874
|
+
: undefined;
|
|
8875
|
+
if (Component && FrameworkComponent) {
|
|
8876
|
+
throw new Error(`Cannot create '${id}'. component '${componentName}' registered as both a component and frameworkComponent`);
|
|
8877
|
+
}
|
|
8878
|
+
if (FrameworkComponent) {
|
|
8879
|
+
if (!createFrameworkComponent) {
|
|
8880
|
+
throw new Error(`Cannot create '${id}' for framework component '${componentName}'. you must register a frameworkPanelWrapper to use framework components`);
|
|
8881
|
+
}
|
|
8882
|
+
return createFrameworkComponent.createComponent(id, componentName, FrameworkComponent);
|
|
8883
|
+
}
|
|
8884
|
+
if (!Component) {
|
|
8885
|
+
if (fallback) {
|
|
8886
|
+
return fallback();
|
|
8887
|
+
}
|
|
8888
|
+
throw new Error(`Cannot create '${id}', no component '${componentName}' provided`);
|
|
8889
|
+
}
|
|
8890
|
+
return new Component(id, componentName);
|
|
8891
|
+
}
|
|
8892
|
+
|
|
8822
8893
|
class GridviewComponent extends BaseGrid {
|
|
8823
8894
|
get orientation() {
|
|
8824
8895
|
return this.gridview.orientation;
|
|
@@ -9367,12 +9438,14 @@ class DefaultHeader extends CompositeDisposable {
|
|
|
9367
9438
|
this._expandedIcon = createExpandMoreButton();
|
|
9368
9439
|
this._collapsedIcon = createChevronRightButton();
|
|
9369
9440
|
this.disposable = new MutableDisposable();
|
|
9370
|
-
this.apiRef = {
|
|
9441
|
+
this.apiRef = {
|
|
9442
|
+
api: null,
|
|
9443
|
+
};
|
|
9371
9444
|
this._element = document.createElement('div');
|
|
9372
|
-
this.element.className = 'default-header';
|
|
9445
|
+
this.element.className = 'dv-default-header';
|
|
9373
9446
|
this._content = document.createElement('span');
|
|
9374
9447
|
this._expander = document.createElement('div');
|
|
9375
|
-
this._expander.className = '
|
|
9448
|
+
this._expander.className = 'dv-pane-header-icon';
|
|
9376
9449
|
this.element.appendChild(this._expander);
|
|
9377
9450
|
this.element.appendChild(this._content);
|
|
9378
9451
|
this.addDisposables(addDisposableListener(this._element, 'click', () => {
|
|
@@ -10229,22 +10302,6 @@ const DockviewReact = React.forwardRef((props, ref) => {
|
|
|
10229
10302
|
disposable.dispose();
|
|
10230
10303
|
};
|
|
10231
10304
|
}, [props.onDidDrop]);
|
|
10232
|
-
React.useEffect(() => {
|
|
10233
|
-
if (!dockviewRef.current) {
|
|
10234
|
-
return () => {
|
|
10235
|
-
// noop
|
|
10236
|
-
};
|
|
10237
|
-
}
|
|
10238
|
-
const disposable = dockviewRef.current.onUnhandledDragOverEvent((event) => {
|
|
10239
|
-
var _a;
|
|
10240
|
-
if ((_a = props.showDndOverlay) === null || _a === void 0 ? void 0 : _a.call(props, event)) {
|
|
10241
|
-
event.accept();
|
|
10242
|
-
}
|
|
10243
|
-
});
|
|
10244
|
-
return () => {
|
|
10245
|
-
disposable.dispose();
|
|
10246
|
-
};
|
|
10247
|
-
}, [props.showDndOverlay]);
|
|
10248
10305
|
React.useEffect(() => {
|
|
10249
10306
|
if (!dockviewRef.current) {
|
|
10250
10307
|
return () => {
|
|
@@ -10639,5 +10696,5 @@ const PaneviewReact = React.forwardRef((props, ref) => {
|
|
|
10639
10696
|
});
|
|
10640
10697
|
PaneviewReact.displayName = 'PaneviewComponent';
|
|
10641
10698
|
|
|
10642
|
-
export { BaseGrid, ContentContainer, DefaultDockviewDeserialzier, DefaultTab, DockviewApi, DockviewComponent, CompositeDisposable as DockviewCompositeDisposable, DockviewDefaultTab, DockviewDidDropEvent, Disposable as DockviewDisposable, Emitter as DockviewEmitter, Event as DockviewEvent, DockviewGroupPanel, DockviewGroupPanelModel, MutableDisposable as DockviewMutableDisposable, DockviewPanel, DockviewReact, DockviewUnhandledDragOverEvent, DockviewWillDropEvent, DraggablePaneviewPanel, Gridview, GridviewApi, GridviewComponent, GridviewPanel, GridviewReact, LayoutPriority,
|
|
10699
|
+
export { BaseGrid, ContentContainer, DefaultDockviewDeserialzier, DefaultTab, DockviewApi, DockviewComponent, CompositeDisposable as DockviewCompositeDisposable, DockviewDefaultTab, DockviewDidDropEvent, Disposable as DockviewDisposable, Emitter as DockviewEmitter, Event as DockviewEvent, DockviewGroupPanel, DockviewGroupPanelModel, MutableDisposable as DockviewMutableDisposable, DockviewPanel, DockviewReact, DockviewUnhandledDragOverEvent, DockviewWillDropEvent, DraggablePaneviewPanel, Gridview, GridviewApi, GridviewComponent, GridviewPanel, GridviewReact, LayoutPriority, Orientation, PROPERTY_KEYS, PaneFramework, PaneTransfer, PanelTransfer, Paneview, PaneviewApi, PaneviewComponent, PaneviewPanel, PaneviewReact, ReactPart, ReactPartContext, SashState, Sizing, Splitview, SplitviewApi, SplitviewComponent, SplitviewPanel, SplitviewReact, Tab, WillShowOverlayLocationEvent, createDockview, createGridview, createPaneview, createSplitview, directionToPosition, getDirectionOrientation, getGridLocation, getLocationOrientation, getPaneData, getPanelData, getRelativeLocation, indexInParent, isGridBranchNode, isGroupOptionsWithGroup, isGroupOptionsWithPanel, isPanelOptionsWithGroup, isPanelOptionsWithPanel, isReactComponent, orthogonal, positionToDirection, toTarget, usePortalsLifecycle };
|
|
10643
10700
|
//# sourceMappingURL=dockview-react.esm.js.map
|