Merge from vscode e0762af258c0b20320ed03f3871a41967acc4421 (#7404)
* Merge from vscode e0762af258c0b20320ed03f3871a41967acc4421 * readd svgs
@@ -173,6 +173,11 @@
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.menubar.compact > .menubar-menu-button {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.menubar .menubar-menu-items-holder {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
@@ -197,9 +202,23 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.menubar.compact .toolbar-toggle-more {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 16px;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.menubar .toolbar-toggle-more {
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
-webkit-mask: url('ellipsis.svg') no-repeat 50% 55%/14px 14px;
|
||||
mask: url('ellipsis.svg') no-repeat 50% 55%/14px 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.menubar.compact .toolbar-toggle-more {
|
||||
-webkit-mask: url('menu.svg') no-repeat 50% 55%/16px 16px;
|
||||
mask: url('menu.svg') no-repeat 50% 55%/16px 16px;
|
||||
}
|
||||
|
||||
3
src/vs/base/browser/ui/menu/menu.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18 5.625H0V4.5H18V5.625ZM18 14.625H0V13.5H18V14.625ZM18 10.1162H0V9H18V10.1162Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 209 B |
@@ -23,6 +23,11 @@ import { isLinux, isMacintosh } from 'vs/base/common/platform';
|
||||
export const MENU_MNEMONIC_REGEX = /\(&([^\s&])\)|(^|[^&])&([^\s&])/;
|
||||
export const MENU_ESCAPED_MNEMONIC_REGEX = /(&)?(&)([^\s&])/g;
|
||||
|
||||
export enum Direction {
|
||||
Right,
|
||||
Left
|
||||
}
|
||||
|
||||
export interface IMenuOptions {
|
||||
context?: any;
|
||||
actionViewItemProvider?: IActionViewItemProvider;
|
||||
@@ -31,6 +36,7 @@ export interface IMenuOptions {
|
||||
ariaLabel?: string;
|
||||
enableMnemonics?: boolean;
|
||||
anchorAlignment?: AnchorAlignment;
|
||||
expandDirection?: Direction;
|
||||
}
|
||||
|
||||
export interface IMenuStyles {
|
||||
@@ -591,6 +597,7 @@ class SubmenuMenuActionViewItem extends BaseMenuActionViewItem {
|
||||
private mouseOver: boolean;
|
||||
private showScheduler: RunOnceScheduler;
|
||||
private hideScheduler: RunOnceScheduler;
|
||||
private expandDirection: Direction;
|
||||
|
||||
constructor(
|
||||
action: IAction,
|
||||
@@ -600,6 +607,8 @@ class SubmenuMenuActionViewItem extends BaseMenuActionViewItem {
|
||||
) {
|
||||
super(action, action, submenuOptions);
|
||||
|
||||
this.expandDirection = submenuOptions && submenuOptions.expandDirection !== undefined ? submenuOptions.expandDirection : Direction.Right;
|
||||
|
||||
this.showScheduler = new RunOnceScheduler(() => {
|
||||
if (this.mouseOver) {
|
||||
this.cleanupExistingSubmenu(false);
|
||||
@@ -715,11 +724,17 @@ class SubmenuMenuActionViewItem extends BaseMenuActionViewItem {
|
||||
const computedStyles = getComputedStyle(this.parentData.parent.domNode);
|
||||
const paddingTop = parseFloat(computedStyles.paddingTop || '0') || 0;
|
||||
|
||||
if (window.innerWidth <= boundingRect.right + childBoundingRect.width) {
|
||||
this.submenuContainer.style.left = '10px';
|
||||
this.submenuContainer.style.top = `${this.element.offsetTop - this.parentData.parent.scrollOffset + boundingRect.height}px`;
|
||||
} else {
|
||||
this.submenuContainer.style.left = `${this.element.offsetWidth}px`;
|
||||
if (this.expandDirection === Direction.Right) {
|
||||
if (window.innerWidth <= boundingRect.right + childBoundingRect.width) {
|
||||
this.submenuContainer.style.left = '10px';
|
||||
this.submenuContainer.style.top = `${this.element.offsetTop - this.parentData.parent.scrollOffset + boundingRect.height}px`;
|
||||
} else {
|
||||
this.submenuContainer.style.left = `${this.element.offsetWidth}px`;
|
||||
this.submenuContainer.style.top = `${this.element.offsetTop - this.parentData.parent.scrollOffset - paddingTop}px`;
|
||||
}
|
||||
} else if (this.expandDirection === Direction.Left) {
|
||||
this.submenuContainer.style.right = `${this.element.offsetWidth}px`;
|
||||
this.submenuContainer.style.left = 'auto';
|
||||
this.submenuContainer.style.top = `${this.element.offsetTop - this.parentData.parent.scrollOffset - paddingTop}px`;
|
||||
}
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ import * as nls from 'vs/nls';
|
||||
import { domEvent } from 'vs/base/browser/event';
|
||||
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
|
||||
import { EventType, Gesture, GestureEvent } from 'vs/base/browser/touch';
|
||||
import { cleanMnemonic, IMenuOptions, Menu, MENU_ESCAPED_MNEMONIC_REGEX, MENU_MNEMONIC_REGEX, SubmenuAction, IMenuStyles } from 'vs/base/browser/ui/menu/menu';
|
||||
import { cleanMnemonic, IMenuOptions, Menu, MENU_ESCAPED_MNEMONIC_REGEX, MENU_MNEMONIC_REGEX, SubmenuAction, IMenuStyles, Direction } from 'vs/base/browser/ui/menu/menu';
|
||||
import { ActionRunner, IAction, IActionRunner } from 'vs/base/common/actions';
|
||||
import { RunOnceScheduler } from 'vs/base/common/async';
|
||||
import { Event, Emitter } from 'vs/base/common/event';
|
||||
@@ -29,6 +29,7 @@ export interface IMenuBarOptions {
|
||||
visibility?: string;
|
||||
getKeybinding?: (action: IAction) => ResolvedKeybinding | undefined;
|
||||
alwaysOnMnemonics?: boolean;
|
||||
compactMode?: Direction;
|
||||
}
|
||||
|
||||
export interface MenuBarMenu {
|
||||
@@ -92,6 +93,9 @@ export class MenuBar extends Disposable {
|
||||
super();
|
||||
|
||||
this.container.setAttribute('role', 'menubar');
|
||||
if (this.options.compactMode !== undefined) {
|
||||
DOM.addClass(this.container, 'compact');
|
||||
}
|
||||
|
||||
this.menuCache = [];
|
||||
this.mnemonics = new Map<string, number>();
|
||||
@@ -292,7 +296,7 @@ export class MenuBar extends Disposable {
|
||||
}
|
||||
|
||||
createOverflowMenu(): void {
|
||||
const label = nls.localize('mMore', "...");
|
||||
const label = this.options.compactMode !== undefined ? nls.localize('mAppMenu', 'Application Menu') : nls.localize('mMore', "...");
|
||||
const buttonElement = $('div.menubar-menu-button', { 'role': 'menuitem', 'tabindex': -1, 'aria-label': label, 'aria-haspopup': true });
|
||||
const titleElement = $('div.menubar-menu-title.toolbar-toggle-more', { 'role': 'none', 'aria-hidden': true });
|
||||
|
||||
@@ -421,7 +425,7 @@ export class MenuBar extends Disposable {
|
||||
|
||||
const sizeAvailable = this.container.offsetWidth;
|
||||
let currentSize = 0;
|
||||
let full = false;
|
||||
let full = this.options.compactMode !== undefined;
|
||||
const prevNumMenusShown = this.numMenusShown;
|
||||
this.numMenusShown = 0;
|
||||
for (let menuBarMenu of this.menuCache) {
|
||||
@@ -884,8 +888,19 @@ export class MenuBar extends Disposable {
|
||||
const menuHolder = $('div.menubar-menu-items-holder');
|
||||
|
||||
DOM.addClass(customMenu.buttonElement, 'open');
|
||||
menuHolder.style.top = `${this.container.clientHeight}px`;
|
||||
menuHolder.style.left = `${customMenu.buttonElement.getBoundingClientRect().left}px`;
|
||||
|
||||
if (this.options.compactMode === Direction.Right) {
|
||||
menuHolder.style.top = `0px`;
|
||||
menuHolder.style.left = `${customMenu.buttonElement.getBoundingClientRect().left + this.container.clientWidth}px`;
|
||||
} else if (this.options.compactMode === Direction.Left) {
|
||||
menuHolder.style.top = `0px`;
|
||||
menuHolder.style.right = `${this.container.clientWidth}px`;
|
||||
menuHolder.style.left = 'auto';
|
||||
console.log(customMenu.buttonElement.getBoundingClientRect().right - this.container.clientWidth);
|
||||
} else {
|
||||
menuHolder.style.top = `${this.container.clientHeight}px`;
|
||||
menuHolder.style.left = `${customMenu.buttonElement.getBoundingClientRect().left}px`;
|
||||
}
|
||||
|
||||
customMenu.buttonElement.appendChild(menuHolder);
|
||||
|
||||
@@ -893,7 +908,8 @@ export class MenuBar extends Disposable {
|
||||
getKeyBinding: this.options.getKeybinding,
|
||||
actionRunner: this.actionRunner,
|
||||
enableMnemonics: this.options.alwaysOnMnemonics || (this.mnemonicsInUse && this.options.enableMnemonics),
|
||||
ariaLabel: withNullAsUndefined(customMenu.buttonElement.getAttribute('aria-label'))
|
||||
ariaLabel: withNullAsUndefined(customMenu.buttonElement.getAttribute('aria-label')),
|
||||
expandDirection: this.options.compactMode !== undefined ? this.options.compactMode : Direction.Right
|
||||
};
|
||||
|
||||
let menuWidget = this._register(new Menu(menuHolder, customMenu.actions, menuOptions));
|
||||
|
||||
@@ -4,8 +4,6 @@
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
|
||||
import 'vs/css!./octicons/octicons';
|
||||
import 'vs/css!./octicons/octicons2';
|
||||
import 'vs/css!./octicons/octicons-main';
|
||||
import 'vs/css!./octicons/octicons-animations';
|
||||
import { escape } from 'vs/base/common/strings';
|
||||
|
||||
|
||||
@@ -1,17 +0,0 @@
|
||||
body[data-octicons-update="enabled"] {
|
||||
--version: octicons2;
|
||||
}
|
||||
|
||||
body {
|
||||
--version: octicons;
|
||||
}
|
||||
|
||||
.octicon, .mega-octicon {
|
||||
font-family: var(--version) !important;
|
||||
}
|
||||
|
||||
body[data-octicons-update="enabled"] .monaco-workbench .part.statusbar > .items-container > .statusbar-item > a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@@ -1,7 +1,6 @@
|
||||
@font-face {
|
||||
font-family: "octicons";
|
||||
src: url("./octicons.ttf?1b0f2a9535896866c74dd24eedeb4374") format("truetype"),
|
||||
url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
src: url("./octicons.ttf?628f71ee09945d25ba5fceb0c17f7b0f") format("truetype");
|
||||
}
|
||||
|
||||
.octicon, .mega-octicon {
|
||||
@@ -137,11 +136,11 @@ url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
.octicon-lock:before { content: "\f06a" }
|
||||
.octicon-log-in:before { content: "\f036" }
|
||||
.octicon-log-out:before { content: "\f032" }
|
||||
.octicon-logo-gist:before { content: "\f288" }
|
||||
.octicon-logo-github:before { content: "\f092" }
|
||||
.octicon-mail-read:before { content: "\f03c" }
|
||||
.octicon-mail-reply:before { content: "\f28c" }
|
||||
.octicon-mail:before { content: "\f03b" }
|
||||
.octicon-logo-gist:before { content: "\f00a" }
|
||||
.octicon-logo-github:before { content: "\f00a" }
|
||||
.octicon-mark-github:before { content: "\f00a" }
|
||||
.octicon-markdown:before { content: "\f0c9" }
|
||||
.octicon-megaphone:before { content: "\f077" }
|
||||
@@ -157,7 +156,7 @@ url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
.octicon-note:before { content: "\f289" }
|
||||
.octicon-octoface:before { content: "\f008" }
|
||||
.octicon-organization:before { content: "\f037" }
|
||||
.octicon-organization-filled:before { content: "\26a2" }
|
||||
.octicon-organization-filled:before { content: "\f037" }
|
||||
.octicon-organization-outline:before { content: "\f037" }
|
||||
.octicon-package:before { content: "\f0c4" }
|
||||
.octicon-paintcan:before { content: "\f0d1" }
|
||||
@@ -165,7 +164,7 @@ url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
.octicon-person-add:before { content: "\f018" }
|
||||
.octicon-person-follow:before { content: "\f018" }
|
||||
.octicon-person:before { content: "\f018" }
|
||||
.octicon-person-filled:before { content: "\26a3" }
|
||||
.octicon-person-filled:before { content: "\f018" }
|
||||
.octicon-person-outline:before { content: "\f018" }
|
||||
.octicon-pin:before { content: "\f041" }
|
||||
.octicon-plug:before { content: "\f0d4" }
|
||||
@@ -202,7 +201,7 @@ url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
.octicon-shield:before { content: "\f0e1" }
|
||||
.octicon-sign-in:before { content: "\f036" }
|
||||
.octicon-sign-out:before { content: "\f032" }
|
||||
.octicon-smiley:before { content: "\f27d" }
|
||||
.octicon-smiley:before { content: "\26b2" }
|
||||
.octicon-squirrel:before { content: "\f0b2" }
|
||||
.octicon-star-add:before { content: "\f02a" }
|
||||
.octicon-star-delete:before { content: "\f02a" }
|
||||
@@ -233,16 +232,20 @@ url("./octicons.svg?1b0f2a9535896866c74dd24eedeb4374#octicons") format("svg");
|
||||
.octicon-watch:before { content: "\f0e0" }
|
||||
.octicon-x:before { content: "\f081" }
|
||||
.octicon-zap:before { content: "\26a1" }
|
||||
.octicon-archive:before { content: "\f101" }
|
||||
.octicon-arrow-both:before { content: "\f102" }
|
||||
.octicon-error:before { content: "\f103" }
|
||||
.octicon-eye-closed:before { content: "\f104" }
|
||||
.octicon-fold-down:before { content: "\f105" }
|
||||
.octicon-fold-up:before { content: "\f106" }
|
||||
.octicon-github-action:before { content: "\f107" }
|
||||
.octicon-info-outline:before { content: "\f108" }
|
||||
.octicon-play:before { content: "\f109" }
|
||||
.octicon-remote:before { content: "\f10a" }
|
||||
.octicon-request-changes:before { content: "\f10b" }
|
||||
.octicon-smiley-outline:before { content: "\f10c" }
|
||||
.octicon-warning:before { content: "\f10d" }
|
||||
.octicon-error:before { content: "\26b1" }
|
||||
.octicon-eye-closed:before { content: "\26a3" }
|
||||
.octicon-fold-down:before { content: "\26a4" }
|
||||
.octicon-fold-up:before { content: "\26a5" }
|
||||
.octicon-github-action:before { content: "\26a6" }
|
||||
.octicon-info-outline:before { content: "\26a7" }
|
||||
.octicon-play:before { content: "\26a8" }
|
||||
.octicon-remote:before { content: "\26a9" }
|
||||
.octicon-request-changes:before { content: "\26aa" }
|
||||
.octicon-smiley-outline:before { content: "\26b2" }
|
||||
.octicon-warning:before { content: "\f02d" }
|
||||
.octicon-controls:before { content: "\26ad" }
|
||||
.octicon-event:before { content: "\26ae" }
|
||||
.octicon-record-keys:before { content: "\26af" }
|
||||
.octicon-Vector:before { content: "\f101" }
|
||||
.octicon-archive:before { content: "\f102" }
|
||||
.octicon-arrow-both:before { content: "\f103" }
|
||||
|
||||
|
Before Width: | Height: | Size: 130 KiB |
@@ -1,251 +0,0 @@
|
||||
@font-face {
|
||||
font-family: "octicons2";
|
||||
src: url("./octicons2.ttf?aa78025ff36faa0aebb5b864685c6dc4") format("truetype");
|
||||
}
|
||||
|
||||
.octicon, .mega-octicon {
|
||||
font: normal normal normal 16px/1 octicons2;
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.mega-octicon { font-size: 32px; }
|
||||
|
||||
|
||||
|
||||
body[data-octicons-update="enabled"] .octicon-alert:before { content: "\f02d" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-down:before { content: "\f03f" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-left:before { content: "\f040" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-right:before { content: "\f03e" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-small-down:before { content: "\f0a0" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-small-left:before { content: "\f0a1" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-small-right:before { content: "\f071" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-small-up:before { content: "\f09f" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-up:before { content: "\f03d" }
|
||||
body[data-octicons-update="enabled"] .octicon-beaker:before { content: "\f0dd" }
|
||||
body[data-octicons-update="enabled"] .octicon-bell:before { content: "\f0de" }
|
||||
body[data-octicons-update="enabled"] .octicon-bold:before { content: "\f282" }
|
||||
body[data-octicons-update="enabled"] .octicon-book:before { content: "\f007" }
|
||||
body[data-octicons-update="enabled"] .octicon-bookmark:before { content: "\f07b" }
|
||||
body[data-octicons-update="enabled"] .octicon-briefcase:before { content: "\f0d3" }
|
||||
body[data-octicons-update="enabled"] .octicon-broadcast:before { content: "\f048" }
|
||||
body[data-octicons-update="enabled"] .octicon-browser:before { content: "\f0c5" }
|
||||
body[data-octicons-update="enabled"] .octicon-bug:before { content: "\f091" }
|
||||
body[data-octicons-update="enabled"] .octicon-calendar:before { content: "\f068" }
|
||||
body[data-octicons-update="enabled"] .octicon-check:before { content: "\f03a" }
|
||||
body[data-octicons-update="enabled"] .octicon-checklist:before { content: "\f076" }
|
||||
body[data-octicons-update="enabled"] .octicon-chevron-down:before { content: "\f0a3" }
|
||||
body[data-octicons-update="enabled"] .octicon-chevron-left:before { content: "\f0a4" }
|
||||
body[data-octicons-update="enabled"] .octicon-chevron-right:before { content: "\f078" }
|
||||
body[data-octicons-update="enabled"] .octicon-chevron-up:before { content: "\f0a2" }
|
||||
body[data-octicons-update="enabled"] .octicon-circle-slash:before { content: "\f084" }
|
||||
body[data-octicons-update="enabled"] .octicon-circuit-board:before { content: "\f0d6" }
|
||||
body[data-octicons-update="enabled"] .octicon-clippy:before { content: "\f035" }
|
||||
body[data-octicons-update="enabled"] .octicon-clock:before { content: "\f046" }
|
||||
body[data-octicons-update="enabled"] .octicon-clone:before { content: "\f0dc" }
|
||||
body[data-octicons-update="enabled"] .octicon-cloud-download:before { content: "\f00b" }
|
||||
body[data-octicons-update="enabled"] .octicon-cloud-upload:before { content: "\f00c" }
|
||||
body[data-octicons-update="enabled"] .octicon-code:before { content: "\f05f" }
|
||||
body[data-octicons-update="enabled"] .octicon-color-mode:before { content: "\f065" }
|
||||
body[data-octicons-update="enabled"] .octicon-comment-add:before { content: "\f02b" }
|
||||
body[data-octicons-update="enabled"] .octicon-comment-discussion:before { content: "\f04f" }
|
||||
body[data-octicons-update="enabled"] .octicon-comment:before { content: "\f02b" }
|
||||
body[data-octicons-update="enabled"] .octicon-credit-card:before { content: "\f045" }
|
||||
body[data-octicons-update="enabled"] .octicon-dash:before { content: "\f0ca" }
|
||||
body[data-octicons-update="enabled"] .octicon-dashboard:before { content: "\f07d" }
|
||||
body[data-octicons-update="enabled"] .octicon-database:before { content: "\f096" }
|
||||
body[data-octicons-update="enabled"] .octicon-desktop-download:before { content: "\f0dc" }
|
||||
body[data-octicons-update="enabled"] .octicon-device-camera-video:before { content: "\f057" }
|
||||
body[data-octicons-update="enabled"] .octicon-device-camera:before { content: "\f056" }
|
||||
body[data-octicons-update="enabled"] .octicon-device-desktop:before { content: "\f27c" }
|
||||
body[data-octicons-update="enabled"] .octicon-device-mobile:before { content: "\f038" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff-added:before { content: "\f06b" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff-ignored:before { content: "\f099" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff-modified:before { content: "\f06d" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff-removed:before { content: "\f06c" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff-renamed:before { content: "\f06e" }
|
||||
body[data-octicons-update="enabled"] .octicon-diff:before { content: "\f04d" }
|
||||
body[data-octicons-update="enabled"] .octicon-ellipsis:before { content: "\f09a" }
|
||||
body[data-octicons-update="enabled"] .octicon-eye-unwatch:before { content: "\f04e" }
|
||||
body[data-octicons-update="enabled"] .octicon-eye-watch:before { content: "\f04e" }
|
||||
body[data-octicons-update="enabled"] .octicon-eye:before { content: "\f04e" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-add:before { content: "\f05d" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-binary:before { content: "\f094" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-code:before { content: "\f010" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-directory-create:before { content: "\f05d" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-directory:before { content: "\f016" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-media:before { content: "\f012" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-pdf:before { content: "\f014" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-submodule:before { content: "\f017" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-symlink-directory:before { content: "\f0b1" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-symlink-file:before { content: "\f0b0" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-text:before { content: "\f283" }
|
||||
body[data-octicons-update="enabled"] .octicon-file-zip:before { content: "\f013" }
|
||||
body[data-octicons-update="enabled"] .octicon-file:before { content: "\f283" }
|
||||
body[data-octicons-update="enabled"] .octicon-flame:before { content: "\f0d2" }
|
||||
body[data-octicons-update="enabled"] .octicon-fold:before { content: "\f0cc" }
|
||||
body[data-octicons-update="enabled"] .octicon-gear:before { content: "\f02f" }
|
||||
body[data-octicons-update="enabled"] .octicon-gift:before { content: "\f042" }
|
||||
body[data-octicons-update="enabled"] .octicon-gist-fork:before { content: "\f002" }
|
||||
body[data-octicons-update="enabled"] .octicon-gist-new:before { content: "\f05d" }
|
||||
body[data-octicons-update="enabled"] .octicon-gist-private:before { content: "\f06a" }
|
||||
body[data-octicons-update="enabled"] .octicon-gist-secret:before { content: "\f08c" }
|
||||
body[data-octicons-update="enabled"] .octicon-gist:before { content: "\f00e" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-branch-create:before { content: "\f020" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-branch-delete:before { content: "\f020" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-branch:before { content: "\f020" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-commit:before { content: "\f01f" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-compare:before { content: "\f0ac" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-fork-private:before { content: "\f06a" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-merge:before { content: "\f023" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-pull-request-abandoned:before { content: "\f009" }
|
||||
body[data-octicons-update="enabled"] .octicon-git-pull-request:before { content: "\f009" }
|
||||
body[data-octicons-update="enabled"] .octicon-globe:before { content: "\f0b6" }
|
||||
body[data-octicons-update="enabled"] .octicon-grabber:before { content: "\f284" }
|
||||
body[data-octicons-update="enabled"] .octicon-graph:before { content: "\f043" }
|
||||
body[data-octicons-update="enabled"] .octicon-heart:before { content: "\2665" }
|
||||
body[data-octicons-update="enabled"] .octicon-history:before { content: "\f07e" }
|
||||
body[data-octicons-update="enabled"] .octicon-home:before { content: "\f08d" }
|
||||
body[data-octicons-update="enabled"] .octicon-horizontal-rule:before { content: "\f070" }
|
||||
body[data-octicons-update="enabled"] .octicon-hubot:before { content: "\f09d" }
|
||||
body[data-octicons-update="enabled"] .octicon-inbox:before { content: "\f0cf" }
|
||||
body[data-octicons-update="enabled"] .octicon-info:before { content: "\f059" }
|
||||
body[data-octicons-update="enabled"] .octicon-issue-closed:before { content: "\f028" }
|
||||
body[data-octicons-update="enabled"] .octicon-issue-opened:before { content: "\f026" }
|
||||
body[data-octicons-update="enabled"] .octicon-issue-reopened:before { content: "\f027" }
|
||||
body[data-octicons-update="enabled"] .octicon-italic:before { content: "\f285" }
|
||||
body[data-octicons-update="enabled"] .octicon-jersey:before { content: "\f019" }
|
||||
body[data-octicons-update="enabled"] .octicon-kebab-horizontal:before { content: "\f286" }
|
||||
body[data-octicons-update="enabled"] .octicon-kebab-vertical:before { content: "\f287" }
|
||||
body[data-octicons-update="enabled"] .octicon-key:before { content: "\f049" }
|
||||
body[data-octicons-update="enabled"] .octicon-keyboard:before { content: "\f00d" }
|
||||
body[data-octicons-update="enabled"] .octicon-law:before { content: "\f0d8" }
|
||||
body[data-octicons-update="enabled"] .octicon-light-bulb:before { content: "\f000" }
|
||||
body[data-octicons-update="enabled"] .octicon-link-external:before { content: "\f07f" }
|
||||
body[data-octicons-update="enabled"] .octicon-link:before { content: "\f05c" }
|
||||
body[data-octicons-update="enabled"] .octicon-list-ordered:before { content: "\f062" }
|
||||
body[data-octicons-update="enabled"] .octicon-list-unordered:before { content: "\f061" }
|
||||
body[data-octicons-update="enabled"] .octicon-location:before { content: "\f060" }
|
||||
body[data-octicons-update="enabled"] .octicon-lock:before { content: "\f06a" }
|
||||
body[data-octicons-update="enabled"] .octicon-log-in:before { content: "\f036" }
|
||||
body[data-octicons-update="enabled"] .octicon-log-out:before { content: "\f032" }
|
||||
body[data-octicons-update="enabled"] .octicon-logo-gist:before { content: "\f288" }
|
||||
body[data-octicons-update="enabled"] .octicon-logo-github:before { content: "\f092" }
|
||||
body[data-octicons-update="enabled"] .octicon-mail-read:before { content: "\f03c" }
|
||||
body[data-octicons-update="enabled"] .octicon-mail-reply:before { content: "\f28c" }
|
||||
body[data-octicons-update="enabled"] .octicon-mail:before { content: "\f03b" }
|
||||
body[data-octicons-update="enabled"] .octicon-mark-github:before { content: "\f00a" }
|
||||
body[data-octicons-update="enabled"] .octicon-markdown:before { content: "\f0c9" }
|
||||
body[data-octicons-update="enabled"] .octicon-megaphone:before { content: "\f077" }
|
||||
body[data-octicons-update="enabled"] .octicon-mention:before { content: "\f0be" }
|
||||
body[data-octicons-update="enabled"] .octicon-microscope:before { content: "\f0dd" }
|
||||
body[data-octicons-update="enabled"] .octicon-milestone:before { content: "\f075" }
|
||||
body[data-octicons-update="enabled"] .octicon-mirror-private:before { content: "\f06a" }
|
||||
body[data-octicons-update="enabled"] .octicon-mirror-public:before { content: "\f024" }
|
||||
body[data-octicons-update="enabled"] .octicon-mirror:before { content: "\f024" }
|
||||
body[data-octicons-update="enabled"] .octicon-mortar-board:before { content: "\f0d7" }
|
||||
body[data-octicons-update="enabled"] .octicon-mute:before { content: "\f080" }
|
||||
body[data-octicons-update="enabled"] .octicon-no-newline:before { content: "\f09c" }
|
||||
body[data-octicons-update="enabled"] .octicon-note:before { content: "\f289" }
|
||||
body[data-octicons-update="enabled"] .octicon-octoface:before { content: "\f008" }
|
||||
body[data-octicons-update="enabled"] .octicon-organization:before { content: "\f037" }
|
||||
body[data-octicons-update="enabled"] .octicon-organization-filled:before { content: "\f037" }
|
||||
body[data-octicons-update="enabled"] .octicon-organization-outline:before { content: "\f037" }
|
||||
body[data-octicons-update="enabled"] .octicon-package:before { content: "\f0c4" }
|
||||
body[data-octicons-update="enabled"] .octicon-paintcan:before { content: "\f0d1" }
|
||||
body[data-octicons-update="enabled"] .octicon-pencil:before { content: "\f058" }
|
||||
body[data-octicons-update="enabled"] .octicon-person-add:before { content: "\f018" }
|
||||
body[data-octicons-update="enabled"] .octicon-person-follow:before { content: "\f018" }
|
||||
body[data-octicons-update="enabled"] .octicon-person:before { content: "\f018" }
|
||||
body[data-octicons-update="enabled"] .octicon-person-filled:before { content: "\f018" }
|
||||
body[data-octicons-update="enabled"] .octicon-person-outline:before { content: "\f018" }
|
||||
body[data-octicons-update="enabled"] .octicon-pin:before { content: "\f041" }
|
||||
body[data-octicons-update="enabled"] .octicon-plug:before { content: "\f0d4" }
|
||||
body[data-octicons-update="enabled"] .octicon-plus-small:before { content: "\f28a" }
|
||||
body[data-octicons-update="enabled"] .octicon-plus:before { content: "\f05d" }
|
||||
body[data-octicons-update="enabled"] .octicon-primitive-dot:before { content: "\f052" }
|
||||
body[data-octicons-update="enabled"] .octicon-primitive-square:before { content: "\f053" }
|
||||
body[data-octicons-update="enabled"] .octicon-project:before { content: "\f28b" }
|
||||
body[data-octicons-update="enabled"] .octicon-pulse:before { content: "\f085" }
|
||||
body[data-octicons-update="enabled"] .octicon-question:before { content: "\f02c" }
|
||||
body[data-octicons-update="enabled"] .octicon-quote:before { content: "\f063" }
|
||||
body[data-octicons-update="enabled"] .octicon-radio-tower:before { content: "\f030" }
|
||||
body[data-octicons-update="enabled"] .octicon-remove-close:before { content: "\f081" }
|
||||
body[data-octicons-update="enabled"] .octicon-reply:before { content: "\f28c" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-clone:before { content: "\f04c" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-create:before { content: "\f05d" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-delete:before { content: "\f001" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-force-push:before { content: "\f04a" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-forked:before { content: "\f002" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-pull:before { content: "\f006" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-push:before { content: "\f005" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo-sync:before { content: "\f087" }
|
||||
body[data-octicons-update="enabled"] .octicon-repo:before { content: "\f001" }
|
||||
body[data-octicons-update="enabled"] .octicon-report:before { content: "\f28d" }
|
||||
body[data-octicons-update="enabled"] .octicon-rocket:before { content: "\f033" }
|
||||
body[data-octicons-update="enabled"] .octicon-rss:before { content: "\f034" }
|
||||
body[data-octicons-update="enabled"] .octicon-ruby:before { content: "\f047" }
|
||||
body[data-octicons-update="enabled"] .octicon-screen-full:before { content: "\f066" }
|
||||
body[data-octicons-update="enabled"] .octicon-screen-normal:before { content: "\f067" }
|
||||
body[data-octicons-update="enabled"] .octicon-search-save:before { content: "\f02e" }
|
||||
body[data-octicons-update="enabled"] .octicon-search:before { content: "\f02e" }
|
||||
body[data-octicons-update="enabled"] .octicon-server:before { content: "\f097" }
|
||||
body[data-octicons-update="enabled"] .octicon-settings:before { content: "\f07c" }
|
||||
body[data-octicons-update="enabled"] .octicon-shield:before { content: "\f0e1" }
|
||||
body[data-octicons-update="enabled"] .octicon-sign-in:before { content: "\f036" }
|
||||
body[data-octicons-update="enabled"] .octicon-sign-out:before { content: "\f032" }
|
||||
body[data-octicons-update="enabled"] .octicon-smiley:before { content: "\26b2" }
|
||||
body[data-octicons-update="enabled"] .octicon-squirrel:before { content: "\f0b2" }
|
||||
body[data-octicons-update="enabled"] .octicon-star-add:before { content: "\f02a" }
|
||||
body[data-octicons-update="enabled"] .octicon-star-delete:before { content: "\f02a" }
|
||||
body[data-octicons-update="enabled"] .octicon-star:before { content: "\f02a" }
|
||||
body[data-octicons-update="enabled"] .octicon-stop:before { content: "\f08f" }
|
||||
body[data-octicons-update="enabled"] .octicon-sync:before { content: "\f087" }
|
||||
body[data-octicons-update="enabled"] .octicon-tag-add:before { content: "\f015" }
|
||||
body[data-octicons-update="enabled"] .octicon-tag-remove:before { content: "\f015" }
|
||||
body[data-octicons-update="enabled"] .octicon-tag:before { content: "\f015" }
|
||||
body[data-octicons-update="enabled"] .octicon-tasklist:before { content: "\f27e" }
|
||||
body[data-octicons-update="enabled"] .octicon-telescope:before { content: "\f088" }
|
||||
body[data-octicons-update="enabled"] .octicon-terminal:before { content: "\f0c8" }
|
||||
body[data-octicons-update="enabled"] .octicon-text-size:before { content: "\f27f" }
|
||||
body[data-octicons-update="enabled"] .octicon-three-bars:before { content: "\f05e" }
|
||||
body[data-octicons-update="enabled"] .octicon-thumbsdown:before { content: "\f0db" }
|
||||
body[data-octicons-update="enabled"] .octicon-thumbsup:before { content: "\f0da" }
|
||||
body[data-octicons-update="enabled"] .octicon-tools:before { content: "\f031" }
|
||||
body[data-octicons-update="enabled"] .octicon-trashcan:before { content: "\f0d0" }
|
||||
body[data-octicons-update="enabled"] .octicon-triangle-down:before { content: "\f05b" }
|
||||
body[data-octicons-update="enabled"] .octicon-triangle-left:before { content: "\f044" }
|
||||
body[data-octicons-update="enabled"] .octicon-triangle-right:before { content: "\f05a" }
|
||||
body[data-octicons-update="enabled"] .octicon-triangle-up:before { content: "\f0aa" }
|
||||
body[data-octicons-update="enabled"] .octicon-unfold:before { content: "\f039" }
|
||||
body[data-octicons-update="enabled"] .octicon-unmute:before { content: "\f0ba" }
|
||||
body[data-octicons-update="enabled"] .octicon-unverified:before { content: "\f280" }
|
||||
body[data-octicons-update="enabled"] .octicon-verified:before { content: "\f281" }
|
||||
body[data-octicons-update="enabled"] .octicon-versions:before { content: "\f064" }
|
||||
body[data-octicons-update="enabled"] .octicon-watch:before { content: "\f0e0" }
|
||||
body[data-octicons-update="enabled"] .octicon-x:before { content: "\f081" }
|
||||
body[data-octicons-update="enabled"] .octicon-zap:before { content: "\26a1" }
|
||||
body[data-octicons-update="enabled"] .octicon-error:before { content: "\26b1" }
|
||||
body[data-octicons-update="enabled"] .octicon-eye-closed:before { content: "\26a3" }
|
||||
body[data-octicons-update="enabled"] .octicon-fold-down:before { content: "\26a4" }
|
||||
body[data-octicons-update="enabled"] .octicon-fold-up:before { content: "\26a5" }
|
||||
body[data-octicons-update="enabled"] .octicon-github-action:before { content: "\26a6" }
|
||||
body[data-octicons-update="enabled"] .octicon-info-outline:before { content: "\26a7" }
|
||||
body[data-octicons-update="enabled"] .octicon-play:before { content: "\26a8" }
|
||||
body[data-octicons-update="enabled"] .octicon-remote:before { content: "\26a9" }
|
||||
body[data-octicons-update="enabled"] .octicon-request-changes:before { content: "\26aa" }
|
||||
body[data-octicons-update="enabled"] .octicon-smiley-outline:before { content: "\26b2" }
|
||||
body[data-octicons-update="enabled"] .octicon-warning:before { content: "\f02d" }
|
||||
body[data-octicons-update="enabled"] .octicon-controls:before { content: "\26ad" }
|
||||
body[data-octicons-update="enabled"] .octicon-event:before { content: "\26ae" }
|
||||
body[data-octicons-update="enabled"] .octicon-record-keys:before { content: "\26af" }
|
||||
body[data-octicons-update="enabled"] .octicon-Vector:before { content: "\f101" }
|
||||
body[data-octicons-update="enabled"] .octicon-archive:before { content: "\f102" }
|
||||
body[data-octicons-update="enabled"] .octicon-arrow-both:before { content: "\f103" }
|
||||
@@ -20,38 +20,22 @@
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
padding-left: 20px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.monaco-panel-view .panel > .panel-header {
|
||||
background-image: url('tree-collapsed-light.svg');
|
||||
background-position: 2px center;
|
||||
background-repeat: no-repeat;
|
||||
.monaco-panel-view .panel > .panel-header > .twisties {
|
||||
width: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transform-origin: center;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.monaco-panel-view .panel > .panel-header.expanded {
|
||||
background-image: url('tree-expanded-light.svg');
|
||||
background-position: 2px center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.vs-dark .monaco-panel-view .panel > .panel-header {
|
||||
background-image: url('tree-collapsed-dark.svg');
|
||||
}
|
||||
|
||||
.vs-dark .monaco-panel-view .panel > .panel-header.expanded {
|
||||
background-image: url('tree-expanded-dark.svg');
|
||||
}
|
||||
|
||||
.hc-black .monaco-panel-view .panel > .panel-header {
|
||||
background-image: url('tree-collapsed-hc.svg');
|
||||
}
|
||||
|
||||
.hc-black .monaco-panel-view .panel > .panel-header.expanded {
|
||||
background-image: url('tree-expanded-hc.svg');
|
||||
.monaco-panel-view .panel > .panel-header.expanded > .twisties::before {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
/* TODO: actions should be part of the panel, but they aren't yet */
|
||||
@@ -79,6 +63,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/* Bold font style does not go well with CJK fonts */
|
||||
|
||||
@@ -54,10 +54,10 @@ export interface IView {
|
||||
}
|
||||
|
||||
interface ISashEvent {
|
||||
sash: Sash;
|
||||
start: number;
|
||||
current: number;
|
||||
alt: boolean;
|
||||
readonly sash: Sash;
|
||||
readonly start: number;
|
||||
readonly current: number;
|
||||
readonly alt: boolean;
|
||||
}
|
||||
|
||||
type ViewItemSize = number | { cachedVisibleSize: number };
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0719 7.99999L5.71461 12.3573L6.33333 12.976L11 8.30935V7.69064L6.33333 3.02397L5.71461 3.64269L10.0719 7.99999Z" fill="#C5C5C5"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 286 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0719 7.99999L5.71461 12.3573L6.33333 12.976L11 8.30935V7.69063L6.33333 3.02396L5.71461 3.64268L10.0719 7.99999Z" fill="white"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 284 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0719 7.99999L5.71461 12.3573L6.33333 12.976L11 8.30935V7.69063L6.33333 3.02396L5.71461 3.64268L10.0719 7.99999Z" fill="#424242"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 286 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.97603 10.0719L12.3333 5.71461L12.9521 6.33333L8.28539 11L7.66667 11L3 6.33333L3.61872 5.71461L7.97603 10.0719Z" fill="#C5C5C5"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 284 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.97603 10.0719L12.3333 5.71461L12.9521 6.33333L8.28539 11L7.66667 11L3 6.33333L3.61872 5.71461L7.97603 10.0719Z" fill="white"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 282 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.97603 10.0719L12.3333 5.71461L12.9521 6.33333L8.28539 11L7.66667 11L3 6.33333L3.61872 5.71461L7.97603 10.0719Z" fill="#424242"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 284 B |
@@ -225,18 +225,14 @@ interface Collection<T> {
|
||||
|
||||
class EventCollection<T> implements Collection<T> {
|
||||
|
||||
private disposables = new DisposableStore();
|
||||
readonly onDidChange: Event<T[]>;
|
||||
|
||||
get elements(): T[] {
|
||||
return this._elements;
|
||||
}
|
||||
|
||||
constructor(readonly onDidChange: Event<T[]>, private _elements: T[] = []) {
|
||||
onDidChange(e => this._elements = e, null, this.disposables);
|
||||
}
|
||||
|
||||
dispose() {
|
||||
this.disposables.dispose();
|
||||
constructor(onDidChange: Event<T[]>, private _elements: T[] = []) {
|
||||
this.onDidChange = Event.forEach(onDidChange, elements => this._elements = elements);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -249,7 +245,7 @@ class TreeRenderer<T, TFilterData, TRef, TTemplateData> implements IListRenderer
|
||||
private renderedNodes = new Map<ITreeNode<T, TFilterData>, IRenderData<TTemplateData>>();
|
||||
private indent: number = TreeRenderer.DefaultIndent;
|
||||
|
||||
private _renderIndentGuides: RenderIndentGuides = RenderIndentGuides.None;
|
||||
private shouldRenderIndentGuides: boolean = false;
|
||||
private renderedIndentGuides = new SetMap<ITreeNode<T, TFilterData>, HTMLDivElement>();
|
||||
private activeIndentNodes = new Set<ITreeNode<T, TFilterData>>();
|
||||
private indentGuidesDisposable: IDisposable = Disposable.None;
|
||||
@@ -279,19 +275,18 @@ class TreeRenderer<T, TFilterData, TRef, TTemplateData> implements IListRenderer
|
||||
}
|
||||
|
||||
if (typeof options.renderIndentGuides !== 'undefined') {
|
||||
const renderIndentGuides = options.renderIndentGuides;
|
||||
const shouldRenderIndentGuides = options.renderIndentGuides !== RenderIndentGuides.None;
|
||||
|
||||
if (renderIndentGuides !== this._renderIndentGuides) {
|
||||
this._renderIndentGuides = renderIndentGuides;
|
||||
if (shouldRenderIndentGuides !== this.shouldRenderIndentGuides) {
|
||||
this.shouldRenderIndentGuides = shouldRenderIndentGuides;
|
||||
this.indentGuidesDisposable.dispose();
|
||||
|
||||
if (renderIndentGuides) {
|
||||
if (shouldRenderIndentGuides) {
|
||||
const disposables = new DisposableStore();
|
||||
this.activeNodes.onDidChange(this._onDidChangeActiveNodes, this, disposables);
|
||||
this.indentGuidesDisposable = disposables;
|
||||
|
||||
this._onDidChangeActiveNodes(this.activeNodes.elements);
|
||||
} else {
|
||||
this.indentGuidesDisposable.dispose();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -370,6 +365,8 @@ class TreeRenderer<T, TFilterData, TRef, TTemplateData> implements IListRenderer
|
||||
this.renderer.renderTwistie(node.element, templateData.twistie);
|
||||
}
|
||||
|
||||
toggleClass(templateData.twistie, 'codicon', node.collapsible);
|
||||
toggleClass(templateData.twistie, 'codicon-chevron-down', node.collapsible);
|
||||
toggleClass(templateData.twistie, 'collapsible', node.collapsible);
|
||||
toggleClass(templateData.twistie, 'collapsed', node.collapsible && node.collapsed);
|
||||
|
||||
@@ -384,7 +381,7 @@ class TreeRenderer<T, TFilterData, TRef, TTemplateData> implements IListRenderer
|
||||
clearNode(templateData.indent);
|
||||
templateData.indentGuidesDisposable.dispose();
|
||||
|
||||
if (this._renderIndentGuides === RenderIndentGuides.None) {
|
||||
if (!this.shouldRenderIndentGuides) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -424,7 +421,7 @@ class TreeRenderer<T, TFilterData, TRef, TTemplateData> implements IListRenderer
|
||||
}
|
||||
|
||||
private _onDidChangeActiveNodes(nodes: ITreeNode<T, TFilterData>[]): void {
|
||||
if (this._renderIndentGuides === RenderIndentGuides.None) {
|
||||
if (!this.shouldRenderIndentGuides) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1001,7 +998,6 @@ class Trait<T> {
|
||||
insertedNodes.forEach(node => dfs(node, insertedNodesVisitor));
|
||||
|
||||
const nodes: ITreeNode<T, any>[] = [];
|
||||
let silent = true;
|
||||
|
||||
for (const node of this.nodes) {
|
||||
const id = this.identityProvider.getId(node.element).toString();
|
||||
@@ -1014,13 +1010,11 @@ class Trait<T> {
|
||||
|
||||
if (insertedNode) {
|
||||
nodes.push(insertedNode);
|
||||
} else {
|
||||
silent = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this._set(nodes, silent);
|
||||
this._set(nodes, true);
|
||||
}
|
||||
|
||||
private createNodeSet(): Set<ITreeNode<T, any>> {
|
||||
@@ -1228,9 +1222,8 @@ export abstract class AbstractTree<T, TFilterData, TRef> implements IDisposable
|
||||
const treeDelegate = new ComposedTreeDelegate<T, ITreeNode<T, TFilterData>>(delegate);
|
||||
|
||||
const onDidChangeCollapseStateRelay = new Relay<ICollapseStateChangeEvent<T, TFilterData>>();
|
||||
const onDidChangeActiveNodes = new Emitter<ITreeNode<T, TFilterData>[]>();
|
||||
const onDidChangeActiveNodes = new Relay<ITreeNode<T, TFilterData>[]>();
|
||||
const activeNodes = new EventCollection(onDidChangeActiveNodes.event);
|
||||
this.disposables.push(activeNodes);
|
||||
|
||||
this.renderers = renderers.map(r => new TreeRenderer<T, TFilterData, TRef, any>(r, () => this.model, onDidChangeCollapseStateRelay.event, activeNodes, _options));
|
||||
this.disposables.push(...this.renderers);
|
||||
@@ -1250,24 +1243,35 @@ export abstract class AbstractTree<T, TFilterData, TRef> implements IDisposable
|
||||
this.model = this.createModel(user, this.view, _options);
|
||||
onDidChangeCollapseStateRelay.input = this.model.onDidChangeCollapseState;
|
||||
|
||||
this.model.onDidSplice(e => {
|
||||
const onDidModelSplice = Event.forEach(this.model.onDidSplice, e => {
|
||||
this.eventBufferer.bufferEvents(() => {
|
||||
this.focus.onDidModelSplice(e);
|
||||
this.selection.onDidModelSplice(e);
|
||||
});
|
||||
});
|
||||
|
||||
const set = new Set<ITreeNode<T, TFilterData>>();
|
||||
// Make sure the `forEach` always runs
|
||||
onDidModelSplice(() => null, null, this.disposables);
|
||||
|
||||
for (const node of this.focus.getNodes()) {
|
||||
set.add(node);
|
||||
}
|
||||
// Active nodes can change when the model changes or when focus or selection change.
|
||||
// We debouce it with 0 delay since these events may fire in the same stack and we only
|
||||
// want to run this once. It also doesn't matter if it runs on the next tick since it's only
|
||||
// a nice to have UI feature.
|
||||
onDidChangeActiveNodes.input = Event.chain(Event.any<any>(onDidModelSplice, this.focus.onDidChange, this.selection.onDidChange))
|
||||
.debounce(() => null, 0)
|
||||
.map(() => {
|
||||
const set = new Set<ITreeNode<T, TFilterData>>();
|
||||
|
||||
for (const node of this.selection.getNodes()) {
|
||||
set.add(node);
|
||||
}
|
||||
for (const node of this.focus.getNodes()) {
|
||||
set.add(node);
|
||||
}
|
||||
|
||||
onDidChangeActiveNodes.fire(fromSet(set));
|
||||
}, null, this.disposables);
|
||||
for (const node of this.selection.getNodes()) {
|
||||
set.add(node);
|
||||
}
|
||||
|
||||
return fromSet(set);
|
||||
}).event;
|
||||
|
||||
if (_options.keyboardSupport !== false) {
|
||||
const onKeyDown = Event.chain(this.view.onKeyDown)
|
||||
|
||||
@@ -108,7 +108,7 @@ class AsyncDataTreeRenderer<TInput, T, TFilterData, TTemplateData> implements IT
|
||||
}
|
||||
|
||||
renderTwistie(element: IAsyncDataTreeNode<TInput, T>, twistieElement: HTMLElement): boolean {
|
||||
toggleClass(twistieElement, 'loading', element.slow);
|
||||
toggleClass(twistieElement, 'codicon-loading', element.slow);
|
||||
return false;
|
||||
}
|
||||
|
||||
@@ -986,7 +986,7 @@ class CompressibleAsyncDataTreeRenderer<TInput, T, TFilterData, TTemplateData> i
|
||||
}
|
||||
|
||||
renderTwistie(element: IAsyncDataTreeNode<TInput, T>, twistieElement: HTMLElement): boolean {
|
||||
toggleClass(twistieElement, 'loading', element.slow);
|
||||
toggleClass(twistieElement, 'codicon-loading', element.slow);
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
@@ -27,7 +27,9 @@ function noCompress<T>(element: ICompressedTreeElement<T>): ITreeElement<ICompre
|
||||
|
||||
return {
|
||||
element: { elements, incompressible },
|
||||
children: Iterator.map(Iterator.from(element.children), noCompress)
|
||||
children: Iterator.map(Iterator.from(element.children), noCompress),
|
||||
collapsible: element.collapsible,
|
||||
collapsed: element.collapsed
|
||||
};
|
||||
}
|
||||
|
||||
@@ -58,7 +60,9 @@ export function compress<T>(element: ICompressedTreeElement<T>): ITreeElement<IC
|
||||
|
||||
return {
|
||||
element: { elements, incompressible },
|
||||
children: Iterator.map(Iterator.concat(Iterator.fromArray(children), childrenIterator), compress)
|
||||
children: Iterator.map(Iterator.concat(Iterator.fromArray(children), childrenIterator), compress),
|
||||
collapsible: element.collapsible,
|
||||
collapsed: element.collapsed
|
||||
};
|
||||
}
|
||||
|
||||
@@ -72,10 +76,21 @@ function _decompress<T>(element: ITreeElement<ICompressedTreeNode<T>>, index = 0
|
||||
}
|
||||
|
||||
if (index === 0 && element.element.incompressible) {
|
||||
return { element: element.element.elements[index], children, incompressible: true };
|
||||
return {
|
||||
element: element.element.elements[index],
|
||||
children,
|
||||
incompressible: true,
|
||||
collapsible: element.collapsible,
|
||||
collapsed: element.collapsed
|
||||
};
|
||||
}
|
||||
|
||||
return { element: element.element.elements[index], children };
|
||||
return {
|
||||
element: element.element.elements[index],
|
||||
children,
|
||||
collapsible: element.collapsible,
|
||||
collapsed: element.collapsed
|
||||
};
|
||||
}
|
||||
|
||||
// Exported only for test reasons, do not use directly
|
||||
|
||||
@@ -44,6 +44,11 @@
|
||||
margin-right: 6px;
|
||||
flex-shrink: 0;
|
||||
width: 16px;
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: inherit !important;
|
||||
transform: translateX(3px);
|
||||
}
|
||||
|
||||
.monaco-tl-contents {
|
||||
@@ -51,43 +56,10 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.monaco-tl-twistie.collapsible {
|
||||
background-size: 16px;
|
||||
background-position: 3px 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("tree-expanded-light.svg");
|
||||
.monaco-tl-twistie.collapsed::before {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
.monaco-tl-twistie.collapsible.collapsed:not(.loading) {
|
||||
display: inline-block;
|
||||
background-image: url("tree-collapsed-light.svg");
|
||||
}
|
||||
|
||||
.vs-dark .monaco-tl-twistie.collapsible:not(.loading) {
|
||||
background-image: url("tree-expanded-dark.svg");
|
||||
}
|
||||
|
||||
.vs-dark .monaco-tl-twistie.collapsible.collapsed:not(.loading) {
|
||||
background-image: url("tree-collapsed-dark.svg");
|
||||
}
|
||||
|
||||
.hc-black .monaco-tl-twistie.collapsible:not(.loading) {
|
||||
background-image: url("tree-expanded-hc.svg");
|
||||
}
|
||||
|
||||
.hc-black .monaco-tl-twistie.collapsible.collapsed:not(.loading) {
|
||||
background-image: url("tree-collapsed-hc.svg");
|
||||
}
|
||||
|
||||
.monaco-tl-twistie.loading {
|
||||
background-image: url("loading.svg");
|
||||
background-position: 0 center;
|
||||
}
|
||||
|
||||
.vs-dark .monaco-tl-twistie.loading {
|
||||
background-image: url("loading-dark.svg");
|
||||
}
|
||||
|
||||
.hc-black .monaco-tl-twistie.loading {
|
||||
background-image: url("loading-hc.svg");
|
||||
.monaco-tl-twistie.codicon-loading::before {
|
||||
animation: codicon-spin 1.25s linear infinite;
|
||||
}
|
||||
|
||||