dockview-core 1.7.5 → 1.7.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/gridview/gridview.d.ts.map +1 -1
- package/dist/cjs/gridview/gridview.js +31 -13
- package/dist/cjs/gridview/gridview.js.map +1 -1
- package/dist/cjs/splitview/splitview.d.ts.map +1 -1
- package/dist/cjs/splitview/splitview.js +12 -11
- package/dist/cjs/splitview/splitview.js.map +1 -1
- package/dist/dockview-core.amd.js +46 -27
- package/dist/dockview-core.amd.min.js +2 -2
- package/dist/dockview-core.amd.min.noStyle.js +2 -2
- package/dist/dockview-core.amd.noStyle.js +45 -26
- package/dist/dockview-core.cjs.js +46 -27
- package/dist/dockview-core.esm.js +46 -27
- package/dist/dockview-core.esm.min.js +2 -2
- package/dist/dockview-core.js +46 -27
- package/dist/dockview-core.min.js +2 -2
- package/dist/dockview-core.min.noStyle.js +2 -2
- package/dist/dockview-core.noStyle.js +45 -26
- package/dist/esm/gridview/gridview.d.ts.map +1 -1
- package/dist/esm/gridview/gridview.js +31 -13
- package/dist/esm/gridview/gridview.js.map +1 -1
- package/dist/esm/splitview/splitview.d.ts.map +1 -1
- package/dist/esm/splitview/splitview.js +12 -11
- package/dist/esm/splitview/splitview.js.map +1 -1
- package/dist/styles/dockview.css +1 -0
- package/package.json +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview-core
|
|
3
|
-
* @version 1.7.
|
|
3
|
+
* @version 1.7.6
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
@@ -31,7 +31,7 @@ function styleInject(css, ref) {
|
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
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-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-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-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-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-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.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: 10000;\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.small-top {\n border-top: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-bottom {\n border-bottom: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-left {\n border-left: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-right {\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}\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 overflow: hidden;\n outline: none;\n}\n.grid-view,\n.branch-node {\n height: 100%;\n width: 100%;\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.split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\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}\n.split-view-container .sash-container .sash: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: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.dv-tab-dragging .tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.tab.active-tab > .default-tab .tab-action {\n visibility: visible;\n}\n.tab.inactive-tab > .default-tab .tab-action {\n visibility: hidden;\n}\n.tab.inactive-tab > .default-tab:hover .tab-action {\n visibility: visible;\n}\n.tab .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: elipsis;\n}\n.tab .default-tab .tab-content {\n padding: 0px 8px;\n flex-grow: 1;\n}\n.tab .default-tab .action-container {\n text-align: right;\n display: flex;\n}\n.tab .default-tab .action-container .tab-list {\n display: flex;\n padding: 0px;\n margin: 0px;\n justify-content: flex-end;\n}\n.tab .default-tab .action-container .tab-list .tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.tab .default-tab .action-container .tab-list .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}";
|
|
34
|
+
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-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-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-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-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-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.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: 10000;\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.small-top {\n border-top: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-bottom {\n border-bottom: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-left {\n border-left: 1px solid var(--dv-drag-over-border-color);\n}\n.drop-target > .drop-target-dropzone > .drop-target-selection.small-right {\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}\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 overflow: hidden;\n outline: none;\n}\n.grid-view,\n.branch-node {\n height: 100%;\n width: 100%;\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.split-view-container {\n position: relative;\n overflow: hidden;\n height: 100%;\n width: 100%;\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: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: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.dv-tab-dragging .tab-action {\n background-color: var(--dv-activegroup-visiblepanel-tab-color);\n}\n.tab.active-tab > .default-tab .tab-action {\n visibility: visible;\n}\n.tab.inactive-tab > .default-tab .tab-action {\n visibility: hidden;\n}\n.tab.inactive-tab > .default-tab:hover .tab-action {\n visibility: visible;\n}\n.tab .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: elipsis;\n}\n.tab .default-tab .tab-content {\n padding: 0px 8px;\n flex-grow: 1;\n}\n.tab .default-tab .action-container {\n text-align: right;\n display: flex;\n}\n.tab .default-tab .action-container .tab-list {\n display: flex;\n padding: 0px;\n margin: 0px;\n justify-content: flex-end;\n}\n.tab .default-tab .action-container .tab-list .tab-action {\n padding: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n}\n.tab .default-tab .action-container .tab-list .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}";
|
|
35
35
|
styleInject(css_248z);
|
|
36
36
|
|
|
37
37
|
class TransferObject {
|
|
@@ -918,7 +918,7 @@ class Splitview {
|
|
|
918
918
|
//add sash
|
|
919
919
|
const sash = document.createElement('div');
|
|
920
920
|
sash.className = 'sash';
|
|
921
|
-
const
|
|
921
|
+
const onPointerStart = (event) => {
|
|
922
922
|
for (const item of this.viewItems) {
|
|
923
923
|
item.enabled = false;
|
|
924
924
|
}
|
|
@@ -977,11 +977,10 @@ class Splitview {
|
|
|
977
977
|
size: snappedViewItem.size,
|
|
978
978
|
};
|
|
979
979
|
}
|
|
980
|
-
|
|
981
|
-
const mousemove = (mousemoveEvent) => {
|
|
980
|
+
const onPointerMove = (event) => {
|
|
982
981
|
const current = this._orientation === Orientation.HORIZONTAL
|
|
983
|
-
?
|
|
984
|
-
:
|
|
982
|
+
? event.clientX
|
|
983
|
+
: event.clientY;
|
|
985
984
|
const delta = current - start;
|
|
986
985
|
this.resize(sashIndex, delta, sizes, undefined, undefined, minDelta, maxDelta, snapBefore, snapAfter);
|
|
987
986
|
this.distributeEmptySpace();
|
|
@@ -995,18 +994,20 @@ class Splitview {
|
|
|
995
994
|
iframe.style.pointerEvents = 'auto';
|
|
996
995
|
}
|
|
997
996
|
this.saveProportions();
|
|
998
|
-
document.removeEventListener('
|
|
999
|
-
document.removeEventListener('
|
|
997
|
+
document.removeEventListener('pointermove', onPointerMove);
|
|
998
|
+
document.removeEventListener('pointerup', end);
|
|
999
|
+
document.removeEventListener('pointercancel', end);
|
|
1000
1000
|
this._onDidSashEnd.fire(undefined);
|
|
1001
1001
|
};
|
|
1002
|
-
document.addEventListener('
|
|
1003
|
-
document.addEventListener('
|
|
1002
|
+
document.addEventListener('pointermove', onPointerMove);
|
|
1003
|
+
document.addEventListener('pointerup', end);
|
|
1004
|
+
document.addEventListener('pointercancel', end);
|
|
1004
1005
|
};
|
|
1005
|
-
sash.addEventListener('
|
|
1006
|
+
sash.addEventListener('pointerdown', onPointerStart);
|
|
1006
1007
|
const sashItem = {
|
|
1007
1008
|
container: sash,
|
|
1008
1009
|
disposable: () => {
|
|
1009
|
-
sash.removeEventListener('
|
|
1010
|
+
sash.removeEventListener('pointerdown', onPointerStart);
|
|
1010
1011
|
this.sashContainer.removeChild(sash);
|
|
1011
1012
|
},
|
|
1012
1013
|
};
|
|
@@ -2099,52 +2100,70 @@ class Gridview {
|
|
|
2099
2100
|
if (!(parent instanceof BranchNode)) {
|
|
2100
2101
|
throw new Error('Invalid location');
|
|
2101
2102
|
}
|
|
2102
|
-
const
|
|
2103
|
-
if (!(
|
|
2103
|
+
const nodeToRemove = parent.children[index];
|
|
2104
|
+
if (!(nodeToRemove instanceof LeafNode)) {
|
|
2104
2105
|
throw new Error('Invalid location');
|
|
2105
2106
|
}
|
|
2106
2107
|
parent.removeChild(index, sizing);
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2110
|
-
|
|
2111
|
-
|
|
2112
|
-
|
|
2108
|
+
nodeToRemove.dispose();
|
|
2109
|
+
if (parent.children.length !== 1) {
|
|
2110
|
+
return nodeToRemove.view;
|
|
2111
|
+
}
|
|
2112
|
+
// if the parent has only one child and we know the parent is a BranchNode we can make the tree
|
|
2113
|
+
// more efficiently spaced by replacing the parent BranchNode with the child.
|
|
2114
|
+
// if that child is a LeafNode then we simply replace the BranchNode with the child otherwise if the child
|
|
2115
|
+
// is a BranchNode too we should spread it's children into the grandparent.
|
|
2116
|
+
// refer to the remaining child as the sibling
|
|
2113
2117
|
const sibling = parent.children[0];
|
|
2114
2118
|
if (pathToParent.length === 0) {
|
|
2115
|
-
// parent is root
|
|
2119
|
+
// if the parent is root
|
|
2116
2120
|
if (sibling instanceof LeafNode) {
|
|
2117
|
-
|
|
2121
|
+
// if the sibling is a leaf node no action is required
|
|
2122
|
+
return nodeToRemove.view;
|
|
2118
2123
|
}
|
|
2119
|
-
//
|
|
2124
|
+
// otherwise the sibling is a branch node. since the parent is the root and the root has only one child
|
|
2125
|
+
// which is a branch node we can just set this branch node to be the new root node
|
|
2126
|
+
// for good housekeeping we'll removing the sibling from it's existing tree
|
|
2120
2127
|
parent.removeChild(0, sizing);
|
|
2128
|
+
// and set that sibling node to be root
|
|
2121
2129
|
this.root = sibling;
|
|
2122
|
-
return
|
|
2130
|
+
return nodeToRemove.view;
|
|
2123
2131
|
}
|
|
2132
|
+
// otherwise the parent is apart of a large sub-tree
|
|
2124
2133
|
const [grandParent, ..._] = [...pathToParent].reverse();
|
|
2125
2134
|
const [parentIndex, ...__] = [...rest].reverse();
|
|
2126
2135
|
const isSiblingVisible = parent.isChildVisible(0);
|
|
2136
|
+
// either way we need to remove the sibling from it's existing tree
|
|
2127
2137
|
parent.removeChild(0, sizing);
|
|
2138
|
+
// note the sizes of all of the grandparents children
|
|
2128
2139
|
const sizes = grandParent.children.map((_size, i) => grandParent.getChildSize(i));
|
|
2129
|
-
|
|
2140
|
+
// remove the parent from the grandparent since we are moving the sibling to take the parents place
|
|
2141
|
+
// this parent is no longer used and can be disposed of
|
|
2142
|
+
grandParent.removeChild(parentIndex, sizing).dispose();
|
|
2130
2143
|
if (sibling instanceof BranchNode) {
|
|
2144
|
+
// replace the parent with the siblings children
|
|
2131
2145
|
sizes.splice(parentIndex, 1, ...sibling.children.map((c) => c.size));
|
|
2146
|
+
// and add those siblings to the grandparent
|
|
2132
2147
|
for (let i = 0; i < sibling.children.length; i++) {
|
|
2133
2148
|
const child = sibling.children[i];
|
|
2134
2149
|
grandParent.addChild(child, child.size, parentIndex + i);
|
|
2135
2150
|
}
|
|
2136
2151
|
}
|
|
2137
2152
|
else {
|
|
2153
|
+
// otherwise create a new leaf node and add that to the grandparent
|
|
2138
2154
|
const newSibling = new LeafNode(sibling.view, orthogonal(sibling.orientation), sibling.size);
|
|
2139
2155
|
const siblingSizing = isSiblingVisible
|
|
2140
2156
|
? sibling.orthogonalSize
|
|
2141
2157
|
: Sizing.Invisible(sibling.orthogonalSize);
|
|
2142
2158
|
grandParent.addChild(newSibling, siblingSizing, parentIndex);
|
|
2143
2159
|
}
|
|
2160
|
+
// the containing node of the sibling is no longer required and can be disposed of
|
|
2161
|
+
sibling.dispose();
|
|
2162
|
+
// resize everything
|
|
2144
2163
|
for (let i = 0; i < sizes.length; i++) {
|
|
2145
2164
|
grandParent.resizeChild(i, sizes[i]);
|
|
2146
2165
|
}
|
|
2147
|
-
return
|
|
2166
|
+
return nodeToRemove.view;
|
|
2148
2167
|
}
|
|
2149
2168
|
layout(width, height) {
|
|
2150
2169
|
const [size, orthogonalSize] = this.root.orientation === Orientation.HORIZONTAL
|